/* ===== Auth/Register — WebMeez Brand | Scoped ===== */
[data-scope="wmz-auth-register"] {
  --wmz-primary: #7a3bdc;
  --wmz-accent:  #ee2a7b;
  --wmz-text:    #222;
  --wmz-muted:   #6a6f7a;
  --wmz-card:    #fff;
  --wmz-line:    #e7e8ef;
  --wmz-bg:      #f6f6fb;
}

@media (prefers-color-scheme: dark){
  [data-scope="wmz-auth-register"]{
    --wmz-text:   #e8e8ee;
    --wmz-muted:  #aab1c2;
    --wmz-card:   #171923;
    --wmz-line:   #2a2f3b;
    --wmz-bg:     #0f1115;
  }
}

/* هرو */
[data-scope="wmz-auth-register"] .reg-hero{
  position: relative;
  padding: 56px 16px 24px;
  text-align: center;
  overflow: hidden;
}
[data-scope="wmz-auth-register"] .reg-hero__bg{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 600px at 100% -10%, rgba(122,59,220,.20), transparent 60%),
    radial-gradient(900px 500px at -10% 120%, rgba(238,42,123,.16), transparent 55%),
    var(--wmz-bg);
  z-index:0;
}
[data-scope="wmz-auth-register"] .reg-hero__content{ position: relative; z-index:1; max-width:920px; margin:0 auto; }
[data-scope="wmz-auth-register"] .reg-hero__logo{ height:40px; margin-bottom:10px }
[data-scope="wmz-auth-register"] .reg-hero__title{
  margin:0 0 6px; font-weight:900; font-size:28px; color:var(--wmz-text);
}
[data-scope="wmz-auth-register"] .reg-hero__subtitle{
  margin:0 auto; max-width:720px; color:var(--wmz-muted); line-height:1.9; font-size:15px;
}

/* شِل (گرید دو ستونه) */
[data-scope="wmz-auth-register"] .reg-shell{
  display:grid; gap:20px; grid-template-columns: 1fr; align-items:start;
  max-width: 1100px; margin: 8px auto 40px; padding: 0 16px;
}
@media (min-width: 980px){
  [data-scope="wmz-auth-register"] .reg-shell{
    grid-template-columns: 1.05fr .95fr;
  }
}

/* پنل تصویری/مزایا */
[data-scope="wmz-auth-register"] .reg-visual{
  background: var(--wmz-card);
  border-radius: 18px;
  border:1px solid var(--wmz-line);
  box-shadow: 0 10px 26px rgba(0,0,0,.05);
  padding: 14px 14px 18px;
}
[data-scope="wmz-auth-register"] .reg-visual__media{
  height: 220px;
  border-radius: 14px;
  background-image:
    linear-gradient(135deg, rgba(122,59,220,.28), rgba(238,42,123,.22)),
    url('/assets/img/auth/register-hero.png');
  background-size: cover; background-position: center;
}
@media (min-width: 980px){
  [data-scope="wmz-auth-register"] .reg-visual__media{ height: 280px }
}
[data-scope="wmz-auth-register"] .reg-visual__bullets{
  margin: 14px 6px 0; padding: 0 6px; list-style: none; color: var(--wmz-text);
}
[data-scope="wmz-auth-register"] .reg-visual__bullets li{
  display: flex; align-items: center; gap:10px;
  padding: 10px 6px; border-bottom:1px dashed var(--wmz-line);
  font-size:14.5px;
}
[data-scope="wmz-auth-register"] .reg-visual__bullets li:last-child{ border-bottom:0 }
[data-scope="wmz-auth-register"] .reg-visual__bullets i{ font-size:16px; color: var(--wmz-primary) }

/* کارت فرم */
[data-scope="wmz-auth-register"] .reg-card{
  background: var(--wmz-card);
  border-radius: 18px;
  border:1px solid var(--wmz-line);
  box-shadow: 0 12px 30px rgba(0,0,0,.06);
  padding: 18px 18px 16px;
}
@media (min-width: 560px){
  [data-scope="wmz-auth-register"] .reg-card{ padding: 22px 22px 18px }
}
[data-scope="wmz-auth-register"] .reg-card__title{
  margin: 2px 0 14px; font-size: 20px; font-weight:800; color: var(--wmz-text); text-align: center;
}

/* اخطارها */
[data-scope="wmz-auth-register"] .reg-alert{
  padding: 10px 12px;
  border-radius: 12px;
  font-size: 13.5px;
  margin-bottom: 14px;
  line-height: 1.8;
  background:#fff7f7;
  border:1px solid #ffd1d1;
  color:#9b1c1c;
}
@media (prefers-color-scheme: dark){
  [data-scope="wmz-auth-register"] .reg-alert{
    background:#2a1b22; border-color:#5b2a45; color:#ffd4de;
  }
}

/* لیبل، فیلدها، آیکون‌ها */
[data-scope="wmz-auth-register"] .reg-form{ display:block }
[data-scope="wmz-auth-register"] .reg-label{
  display:block; font-size: 12.5px; margin: 10px 2px 6px; color: var(--wmz-muted); font-weight:700;
}

[data-scope="wmz-auth-register"] .reg-field{
  position: relative;
}
[data-scope="wmz-auth-register"] .reg-ico{
  position:absolute; inset-inline-end:12px; inset-block-start:50%; transform: translateY(-50%);
  font-size: 15px; color:#9aa0ac; pointer-events:none;
}
[data-scope="wmz-auth-register"] .reg-input{
  width:100%; padding: 12px 40px 12px 12px; /* جای آیکون */
  border:1px solid var(--wmz-line);
  border-radius: 12px; font-size: 14.5px; background: #fbfcfe;
  color: var(--wmz-text);
  outline: none; transition: .15s ease;
}
[data-scope="wmz-auth-register"] .reg-input:focus{
  border-color: #bf9dff;
  background:#fff;
  box-shadow: 0 0 0 4px rgba(155,94,255,.15);
}

/* دکمهٔ نمایش رمز */
[data-scope="wmz-auth-register"] .reg-field--pw .reg-toggle{
  position:absolute; inset-inline-start:8px; inset-block-start:50%; transform: translateY(-50%);
  inline-size:34px; block-size:34px; border-radius:10px; border:1px solid var(--wmz-line);
  background:transparent; cursor:pointer;
  display:grid; place-items:center; font-size:15px;
  transition: background .15s ease, border-color .15s ease, box-shadow .15s ease;
}
[data-scope="wmz-auth-register"] .reg-field--pw .reg-toggle:hover{
  background:#f5f6fb; box-shadow:0 2px 8px rgba(0,0,0,.06);
}

/* نقش‌ها */
[data-scope="wmz-auth-register"] .reg-roles{
  display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin-top:4px;
}
[data-scope="wmz-auth-register"] .reg-check{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 10px; border:1px solid var(--wmz-line); border-radius:12px; background:var(--wmz-card);
  cursor:pointer; user-select:none; transition: .15s ease;
}
[data-scope="wmz-auth-register"] .reg-check:hover{ box-shadow:0 3px 10px rgba(0,0,0,.05) }
[data-scope="wmz-auth-register"] .reg-check input[type="checkbox"]{
register-hero}
[data-scope="wmz-auth-register"] .reg-hint{ margin-top:8px; font-size:12.5px; color:var(--wmz-muted) }

/* دکمه اصلی */
[data-scope="wmz-auth-register"] .reg-btn{
  width:100%; margin-top:16px;
  background: linear-gradient(135deg, var(--wmz-primary), var(--wmz-accent));
  color:#fff; border:0; border-radius:12px; padding: 12px 16px;
  font-size:15.5px; font-weight:800; cursor:pointer;
  box-shadow: 0 8px 18px rgba(122,59,220,.22);
  transition: transform .06s ease, filter .15s ease, box-shadow .15s ease;
}
[data-scope="wmz-auth-register"] .reg-btn:hover{ filter: brightness(1.02); box-shadow:0 10px 22px rgba(122,59,220,.26) }
[data-scope="wmz-auth-register"] .reg-btn:active{ transform: translateY(1px) }

/* لینک‌ها و قوانین */
[data-scope="wmz-auth-register"] .reg-foot{ text-align:center; margin-top:14px }
[data-scope="wmz-auth-register"] .reg-link{ color: var(--wmz-primary); text-decoration:none; font-weight:700 }
[data-scope="wmz-auth-register"] .reg-link:hover{ text-decoration:underline }
[data-scope="wmz-auth-register"] .reg-terms{
  margin:12px 0 0; font-size:12.5px; color:var(--wmz-muted); text-align:center;
}

/* فاصله‌ها در موبایل */
@media (max-width: 560px){
  [data-scope="wmz-auth-register"] .reg-hero{ padding: 44px 12px 18px }
  [data-scope="wmz-auth-register"] .reg-card{ padding: 16px }
  [data-scope="wmz-auth-register"] .reg-visual{ padding: 12px }
}

/* تطبیق دارک‌مود برای تصویر کاور */
@media (prefers-color-scheme: dark){
  [data-scope="wmz-auth-register"] .reg-visual__media{
    filter: saturate(1.06) brightness(.92);
  }
}
/* ==== PATCH 1: جلوگیری از رفتن هرو زیر هدر ==== */
[data-scope="wmz-auth-register"] .reg-hero{
  /* ارتفاع هدر ثابت: اگر در پروژه متغیر سراسری داری از همان استفاده کن */
  --wmz-header-h: var(--header-h, 72px);
  padding-top: calc(var(--wmz-header-h) + max(24px, env(safe-area-inset-top)));
}

/* موبایل کمی فشرده‌تر */
@media (max-width: 560px){
  [data-scope="wmz-auth-register"] .reg-hero{
    --wmz-header-h: var(--header-h, 64px);
    padding-top: calc(var(--wmz-header-h) + max(18px, env(safe-area-inset-top)));
  }
}

/* متن هرو همیشه بالای بک‌گراند بماند */
[data-scope="wmz-auth-register"] .reg-hero__content{ position: relative; z-index: 1 }

/* ==== PATCH 2: بهبود دارک‌مود برای فیلدها/آیکون‌ها/Placeholder ==== */
@media (prefers-color-scheme: dark){
  /* رنگ‌های پایه در دارک */
  [data-scope="wmz-auth-register"]{
    --wmz-text:   #e9e9f1;
    --wmz-muted:  #b1b6c7;
    --wmz-card:   #151824;
    --wmz-line:   #2b3140;
    --wmz-bg:     #0f1117;
    --wmz-ico:    #9aa3b2;   /* آیکون فیلدها */
    --wmz-input:  #0f121a;   /* پس‌زمینه ورودی‌ها */
    --wmz-input2: #0b0e15;   /* برای Autofill/Hover */
  }

  /* کارت/متن */
  [data-scope="wmz-auth-register"] .reg-card{ background: var(--wmz-card); border-color: var(--wmz-line) }
  [data-scope="wmz-auth-register"] .reg-card__title,
  [data-scope="wmz-auth-register"] .reg-hero__title{ color: var(--wmz-text) }
  [data-scope="wmz-auth-register"] .reg-hero__subtitle{ color: var(--wmz-muted) }

  /* آیکون‌های داخل فیلد */
  [data-scope="wmz-auth-register"] .reg-ico{ color: var(--wmz-ico) }

  /* ورودی‌ها: پس‌زمینه تیره، متن روشن، کنتراست مناسب */
  [data-scope="wmz-auth-register"] .reg-input{
    background: var(--wmz-input);
    color: var(--wmz-text);
    border-color: var(--wmz-line);
  }
  [data-scope="wmz-auth-register"] .reg-input::placeholder{
    color: color-mix(in oklab, var(--wmz-ico) 80%, transparent);
  }
  [data-scope="wmz-auth-register"] .reg-input:focus{
    border-color:#bf9dff;
    box-shadow: 0 0 0 4px rgba(155,94,255,.18);
    background: var(--wmz-input2);
  }

  /* دکمهٔ نمایش رمز */
  [data-scope="wmz-auth-register"] .reg-field--pw .reg-toggle{
    border-color: var(--wmz-line);
    color: var(--wmz-ico);
    background: transparent;
  }
  [data-scope="wmz-auth-register"] .reg-field--pw .reg-toggle:hover{
    background: #171b27;
    box-shadow: 0 2px 8px rgba(0,0,0,.25);
  }

  /* چک‌باکس نقش‌ها */
  [data-scope="wmz-auth-register"] .reg-check{
    background: #131723;
    border-color: var(--wmz-line);
    color: var(--wmz-text);
  }
  [data-scope="wmz-auth-register"] .reg-hint{ color: var(--wmz-muted) }

  /* لینک‌ها */
  [data-scope="wmz-auth-register"] .reg-link{ color:#bf9dff }
}

/* ==== PATCH 3: اصلاح رنگ Autofill در کروم (لایت/دارک) ==== */
[data-scope="wmz-auth-register"] .reg-input:-webkit-autofill,
[data-scope="wmz-auth-register"] .reg-input:-webkit-autofill:hover,
[data-scope="wmz-auth-register"] .reg-input:-webkit-autofill:focus{
  -webkit-text-fill-color: var(--wmz-text);
  transition: background-color 600000s 0s, color 600000s 0s;
  box-shadow: 0 0 0px 1000px #ffffff inset;
}
@media (prefers-color-scheme: dark){
  [data-scope="wmz-auth-register"] .reg-input:-webkit-autofill,
  [data-scope="wmz-auth-register"] .reg-input:-webkit-autofill:hover,
  [data-scope="wmz-auth-register"] .reg-input:-webkit-autofill:focus{
    -webkit-text-fill-color: var(--wmz-text);
    box-shadow: 0 0 0px 1000px #0f121a inset; /* همان --wmz-input */
  }
}
/* ==== PATCH 4: اصلاح فونت و ظاهر دکمه ثبت‌نام ==== */
[data-scope="wmz-auth-register"] .reg-btn {
  font-family: "Vazirmatn", "IRANSans", sans-serif !important;
  font-weight: 700;              /* ضخیم و خواناتر */
  font-size: 15.5px;             /* اندازه استاندارد */
  letter-spacing: 0.3px;         /* کمی فاصله برای زیبایی */
  line-height: 1.6;

  /* ظاهر */
  background: linear-gradient(135deg, #7a3bdc, #ee2a7b);
  color: #fff;
  border: none;
  border-radius: 12px;
  padding: 13px 20px;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(122, 59, 220, 0.24);

  /* انیمیشن نرم */
  transition:
    transform 0.1s ease,
    filter 0.2s ease,
    box-shadow 0.2s ease;
}

/* حالت Hover */
[data-scope="wmz-auth-register"] .reg-btn:hover {
  filter: brightness(1.05);
  box-shadow: 0 10px 24px rgba(122, 59, 220, 0.3);
  transform: translateY(-1px);
}

/* حالت کلیک */
[data-scope="wmz-auth-register"] .reg-btn:active {
  transform: translateY(1px);
  box-shadow: 0 4px 10px rgba(122, 59, 220, 0.18);
}

/* دارک مود */
@media (prefers-color-scheme: dark) {
  [data-scope="wmz-auth-register"] .reg-btn {
    box-shadow: 0 6px 14px rgba(122, 59, 220, 0.35);
  }
}