/* 
 * Luxury Slate & Gold theme for Ata Gold Boutique Login page
 * Place in your theme's root stylelog.css
 */
@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700&display=swap');

:root {
  --gold-primary: #ffd700;
  --gold-glow: #ffee0b;
  --gold-dark: #b8860b;
  --slate-dark-bg: rgba(24, 2, 2, 0.94);
  --gold-gradient: linear-gradient(135deg, #ffd700, #b8860b);
  --maroon-gradient: linear-gradient(145deg, #180202, #3c0303);
}
@font-face {
    font-family: 'Kamran-Bold';
    src: url('assets/fonts/Kamran-Bold.woff2') format('woff2'),
         url('assets/fonts/Kamran-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: swap;
}
/*font2*/
/*@font-face {*/
/*    font-family: 'ASoraya';*/
/*    src: url('assets/fonts/ASoraya.woff2') format('woff2'),*/
/*         url('assets/fonts/ASoraya.woff') format('woff');*/
/*    font-weight: normal;*/
/*    font-style: normal;*/
/*    font-display: swap;*/
/*}*/

/* اعمال روی کل سایت */
*, *::before, *::after {
    font-family: Kamran-Bold, sans-serif !important;
}

html, body {
    font-family: Kamran-Bold, sans-serif !important;
}
body.woocommerce-account, 
.auth-page-wrapper {
  background: radial-gradient(circle, #2d0404 0%, #0d0101 100%) !important;
  font-family: 'Vazirmatn', sans-serif !important;
  color: #fff !important;
  direction: rtl !important;
}

/* حل تداخل باکس لاگین */
.auth-container {
  width: 100%;
  max-width: 480px;
  background: var(--maroon-gradient);
  border: 1px solid rgba(255, 215, 0, 0.2) !important;
  border-radius: 24px;
  padding: 40px 30px;
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9), inset 0 0 30px rgba(255, 215, 0, 0.1);
  margin: 40px auto;
  position: relative;
  overflow: hidden;
}

/* افکت نور طلایی */
.auth-container::before {
  content: "";
  position: absolute;
  top: -50%;
  left: -50%;
  width: 200%;
  height: 200%;
  background: radial-gradient(circle, rgba(255, 215, 0, 0.04) 0%, transparent 60%);
  pointer-events: none;
}

.logo-section .logo-circle {
  width: 80px;
  height: 80px;
  background: linear-gradient(135deg, #2a0000, #160101);
  border: 2px solid var(--gold-primary);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 15px;
  box-shadow: 0 0 25px rgba(255, 215, 0, 0.25);
  font-size: 32px;
  color: var(--gold-primary);
}

.brand-name {
  color: var(--gold-primary) !important;
  font-weight: 700;
  font-size: 24px;
  letter-spacing: 0.5px;
  text-shadow: 0 2px 10px rgba(255, 215, 0, 0.25);
}

.brand-tagline {
  color: #ffead3 !important; /* بهبود کنتراست متون حاشیه‌ای */
  font-weight: 500;
  font-size: 13.5px;
  margin-top: 4px;
}

/* استایل دهی به تب‌های جفت بوت‌استرپ و حذف کامل بالت‌های مزاحم */
.custom-tabs, 
ul.custom-tabs,
ul.custom-tabs li,
.custom-tabs li {
  list-style: none !important;
  list-style-type: none !important;
  padding: 0 !important;
  margin: 0 !important;
  border-bottom: 2px solid rgba(255, 215, 0, 0.15) !important;
  gap: 10px;
}

.custom-tabs li::before,
.custom-tabs li::after,
ul.custom-tabs li::before,
ul.custom-tabs li::after {
  content: none !important;
  display: none !important;
}

/* مسدود کردن پاشیدگی فیلدها قبل از اجرای جاوااسکریپت */
#loginOtpForm,
#registerOtpForm,
#registrationForm {
  display: none;
}

.custom-tabs .nav-link {
  color: #ddd !important;
  border: none !important;
  font-weight: 600;
  font-size: 15px;
  padding: 10px 24px !important;
  border-radius: 12px 12px 0 0 !important;
  background: transparent !important;
  transition: all 0.3s ease;
}

.custom-tabs .nav-link.active {
  color: var(--gold-primary) !important;
  border-bottom: 3px solid var(--gold-primary) !important;
  text-shadow: 0 0 10px rgba(255, 215, 0, 0.3);
  font-size: 16px;
}

.form-label {
  color: #fff !important; /* تغییر به سفید خالص برای حداکثر خوانایی */
  font-weight: 600;
  font-size: 14.5px;
  margin-bottom: 8px;
}

.input-group-text {
  background-color: rgba(255, 215, 0, 0.08) !important;
  border: 1px solid rgba(255, 215, 0, 0.3) !important;
  color: var(--gold-primary) !important;
  border-radius: 0 12px 12px 0 !important;
}

.form-control, .form-select {
  background-color: rgba(0, 0, 0, 0.5) !important;
  border: 1px solid rgba(255, 215, 0, 0.3) !important;
  border-radius: 12px 0 0 12px !important;
  color: #fff !important;
  padding: 12px 16px !important;
  transition: all 0.3s ease;
  font-weight: 500;
}

.form-select {
  border-radius: 12px !important;
}

.form-control::placeholder {
  color: rgba(255, 255, 255, 0.5) !important; /* روشن‌سازی موثر هولدرها */
  font-weight: 400;
}

.form-select option {
  background-color: #1a0202 !important;
  color: #fff !important;
}

.btn-primary {
  background: var(--gold-gradient) !important;
  border: none !important;
  color: #120101 !important;
  font-weight: bold !important;
  padding: 12px 20px !important;
  border-radius: 12px !important;
  transition: all 0.33s ease !important;
  box-shadow: 0 4px 15px rgba(184, 134, 11, 0.5);
}

.btn-primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 25px rgba(255, 215, 0, 0.5);
}

.btn-outline-secondary {
  border: 1px solid rgba(255, 215, 0, 0.35) !important;
  color: var(--gold-primary) !important;
  border-radius: 12px !important;
  padding: 10px !important;
}

.btn-outline-secondary:hover {
  background-color: rgba(255, 215, 0, 0.12) !important;
  color: #fff !important;
}

/* فیلدهای OTP تک بیتی */
.otp-container {
  display: flex;
  gap: 12px;
  justify-content: center;
  direction: ltr !important;
}

.otp-input {
  width: 50px;
  height: 55px;
  background: rgba(0, 0, 0, 0.5) !important;
  border: 1px solid rgba(255, 215, 0, 0.3) !important;
  border-radius: 12px !important;
  font-size: 24px;
  font-weight: bold;
  color: var(--gold-primary) !important;
  text-align: center;
  transition: all 0.25s ease;
}

.otp-input:focus {
  border-color: var(--gold-glow) !important;
  box-shadow: 0 0 15px rgba(255, 215, 0, 0.45) !important;
  transform: scale(1.05);
}

.modal-content {
  background: var(--maroon-gradient) !important;
  border: 1px solid var(--gold-primary) !important;
  border-radius: 24px !important;
}

.success-icon {
  font-size: 64px;
  color: var(--gold-primary);
  text-shadow: 0 0 20px rgba(255, 215, 0, 0.3);
}

/* پایداری تضاد رنگ اعلامیه‌های ووکامرس */
.woocommerce-error, .woocommerce-message, .woocommerce-info, .alert {
  background-color: #2e0505 !important;
  color: #ffebd3 !important;
  border: 1px solid var(--gold-primary) !important;
  border-radius: 12px !important;
}

.woocommerce-error li {
  color: #fca5a5 !important;
}

.btn-close {
  filter: invert(1) grayscale(100%) brightness(200%);
}