/*! =============================================
 *  Excribo Auth Palette v2
 *
 *  PALETTE HEX CODES
 *  ──────────────────────────────────────────
 *  Light mode
 *    Primary:          #4F46E5  (Indigo 600 — buttons, rings, links)
 *    Primary hover:    #4338CA  (Indigo 700)
 *    Page BG from:     #EEF2FF  (Indigo 50)
 *    Page BG to:       #F8FAFC  (Slate 50)
 *    Card BG:          #FFFFFF  (White)
 *    Card border:      #C7D2FE  (Indigo 200)
 *    Text:             #0F172A  (Slate 900)
 *    Muted text:       #64748B  (Slate 500)
 *    Input BG:         #FFFFFF  (White)
 *    Input border:     #E2E8F0  (Slate 200)
 *    Link:             #4F46E5  (Indigo 600)
 *
 *  Dark mode
 *    Primary:          #818CF8  (Indigo 400)
 *    Primary hover:    #6366F1  (Indigo 500)
 *    Page BG from:     #1E1B4B  (Indigo 950)
 *    Page BG to:       #0F172A  (Slate 900)
 *    Card BG:          #1E293B  (Slate 800)
 *    Card border:      rgba(99,102,241,0.25)
 *    Text:             #F1F5F9  (Slate 100)
 *    Muted text:       #94A3B8  (Slate 400)
 *    Input BG:         #0F172A  (Slate 900)
 *    Input border:     #334155  (Slate 700)
 *
 *  TO ADJUST PALETTE LATER
 *  ──────────────────────────────────────────
 *  Edit the CSS custom properties in the two
 *  blocks below (:root and .theme-dark).
 *  File: public/themes/default/assets/css/auth-palette.css
 *  ============================================= */

/* ─── Design Tokens (Light) ─────────────────── */

:root {
  --ex-auth-primary:         #4F46E5;
  --ex-auth-primary-hover:   #4338CA;
  --ex-auth-primary-rgb:     79, 70, 229;
  --ex-auth-bg-from:         #EEF2FF;
  --ex-auth-bg-to:           #F8FAFC;
  --ex-auth-card-bg:         #FFFFFF;
  --ex-auth-card-border:     #C7D2FE;
  --ex-auth-card-shadow:     0 20px 60px rgba(79, 70, 229, 0.10),
                             0 4px 20px rgba(0, 0, 0, 0.06);
  --ex-auth-text:            #0F172A;
  --ex-auth-muted:           #64748B;
  --ex-auth-input-bg:        #FFFFFF;
  --ex-auth-input-border:    #E2E8F0;
  --ex-auth-input-focus:     #4F46E5;
  --ex-auth-link:            #4F46E5;
  --ex-auth-divider:         #E2E8F0;
  --ex-auth-heading:         #0F172A;
}

/* ─── Design Tokens (Dark) ───────────────────── */

.theme-dark {
  --ex-auth-primary:         #818CF8;
  --ex-auth-primary-hover:   #6366F1;
  --ex-auth-primary-rgb:     129, 140, 248;
  --ex-auth-bg-from:         #1E1B4B;
  --ex-auth-bg-to:           #0F172A;
  --ex-auth-card-bg:         #1E293B;
  --ex-auth-card-border:     rgba(99, 102, 241, 0.25);
  --ex-auth-card-shadow:     0 20px 60px rgba(0, 0, 0, 0.40),
                             0 4px 20px rgba(0, 0, 0, 0.25);
  --ex-auth-text:            #F1F5F9;
  --ex-auth-muted:           #94A3B8;
  --ex-auth-input-bg:        #0F172A;
  --ex-auth-input-border:    #334155;
  --ex-auth-input-focus:     #818CF8;
  --ex-auth-link:            #818CF8;
  --ex-auth-divider:         #334155;
  --ex-auth-heading:         #F1F5F9;
}

/* ─── Page Background ────────────────────────── */

body.is-auth-page {
  background: linear-gradient(
    145deg,
    var(--ex-auth-bg-from) 0%,
    var(--ex-auth-bg-to) 100%
  ) !important;
  /* Override system --primary so buttons/rings use indigo across the page */
  --primary: 243 75% 59%;
  --secondary: 243 75% 59%;
  --primary-foreground: 0 0% 100%;
}

body.is-auth-page .lqd-auth-content {
  background: transparent;
}

/* ─── Auth Card ──────────────────────────────── */

.lqd-auth-card {
  background:          var(--ex-auth-card-bg) !important;
  border:              1px solid var(--ex-auth-card-border) !important;
  border-radius:       20px !important;
  box-shadow:          var(--ex-auth-card-shadow) !important;
  padding:             2.5rem !important;
  backdrop-filter:     none !important;
  -webkit-backdrop-filter: none !important;
}

/* ─── Heading ────────────────────────────────── */

body.is-auth-page .lqd-auth-card h1 {
  color:          var(--ex-auth-heading) !important;
  font-size:      1.75rem;
  font-weight:    700;
  letter-spacing: -0.02em;
  line-height:    1.25;
  margin-bottom:  1.75rem !important;
}

/* ─── Form Inputs ────────────────────────────── */

body.is-auth-page .lqd-auth-card .lqd-input {
  background-color: var(--ex-auth-input-bg) !important;
  border-color:     var(--ex-auth-input-border) !important;
  color:            var(--ex-auth-text) !important;
  border-radius:    10px !important;
  transition:       border-color 0.15s ease, box-shadow 0.15s ease;
}

body.is-auth-page .lqd-auth-card .lqd-input::placeholder {
  color:   var(--ex-auth-muted);
  opacity: 1;
}

body.is-auth-page .lqd-auth-card .lqd-input:focus {
  border-color: var(--ex-auth-input-focus) !important;
  box-shadow:   0 0 0 3px rgba(var(--ex-auth-primary-rgb), 0.12) !important;
  outline:      none;
  --tw-ring-color: transparent;
}

/* ─── Form Labels ────────────────────────────── */

body.is-auth-page .lqd-auth-card .lqd-input-label {
  color: var(--ex-auth-muted) !important;
}

/* ─── Primary Button (Sign In / Sign Up) ──────── */

body.is-auth-page .lqd-auth-card .lqd-btn-primary {
  background-color: var(--ex-auth-primary) !important;
  color:            #ffffff !important;
  font-weight:      600;
  border-radius:    10px !important;
  outline:          none !important;
  box-shadow:       0 4px 14px rgba(var(--ex-auth-primary-rgb), 0.30);
  transition:       background-color 0.15s ease,
                    box-shadow 0.15s ease,
                    transform 0.1s ease;
}

body.is-auth-page .lqd-auth-card .lqd-btn-primary:hover,
body.is-auth-page .lqd-auth-card .lqd-btn-primary:focus-visible {
  background-color: var(--ex-auth-primary-hover) !important;
  box-shadow:       0 6px 20px rgba(var(--ex-auth-primary-rgb), 0.40) !important;
}

/* ─── Outline Buttons (Social Login) ─────────── */

body.is-auth-page .lqd-auth-card .lqd-btn-outline {
  outline:          1px solid var(--ex-auth-input-border) !important;
  color:            var(--ex-auth-text) !important;
  background:       transparent !important;
  border-radius:    10px !important;
  transition:       outline-color 0.15s ease, background-color 0.15s ease;
}

body.is-auth-page .lqd-auth-card .lqd-btn-outline:hover {
  outline-color:    var(--ex-auth-primary) !important;
  background-color: rgba(var(--ex-auth-primary-rgb), 0.04) !important;
}

/* ─── Links ──────────────────────────────────── */

body.is-auth-page .lqd-auth-card a {
  color:      var(--ex-auth-link);
  transition: color 0.15s ease;
}

body.is-auth-page .lqd-auth-card a:hover {
  color:             var(--ex-auth-primary-hover);
  text-decoration-color: var(--ex-auth-primary-hover);
}

/* Tailwind hard-coded indigo class override */
body.is-auth-page .lqd-auth-card .text-indigo-600 {
  color: var(--ex-auth-link) !important;
}

/* ─── "or" Divider ───────────────────────────── */

body.is-auth-page .lqd-auth-card .bg-foreground\/10 {
  background-color: var(--ex-auth-divider) !important;
}

/* "or" text */
body.is-auth-page .lqd-auth-card .text-black {
  color: var(--ex-auth-muted) !important;
}

/* ─── Muted / Legal text ──────────────────────── */

body.is-auth-page .lqd-auth-card .text-foreground\/70 {
  color: var(--ex-auth-muted) !important;
}

/* "Don't have account yet?" block */
body.is-auth-page .lqd-auth-card .mt-20,
body.is-auth-page .lqd-auth-card .mt-10 {
  color: var(--ex-auth-muted);
}

/* ─── Header (logo + back link) ──────────────── */

body.is-auth-page header .inline-flex.items-center {
  color:           var(--ex-auth-text) !important;
  opacity:         0.65;
  text-decoration: none !important;
}

body.is-auth-page header .inline-flex.items-center:hover {
  color:   var(--ex-auth-primary) !important;
  opacity: 1;
}

/* ─── Register page: un-constrain inner container ─── */

body.is-auth-page .lqd-auth-card .container-tight {
  width:     100%;
  max-width: 100%;
  padding:   0;
}

/* ─── Responsive ─────────────────────────────── */

@media (max-width: 640px) {
  .lqd-auth-card {
    padding:       1.5rem !important;
    border-radius: 16px !important;
  }

  body.is-auth-page .lqd-auth-content > div {
    padding-left:  1rem;
    padding-right: 1rem;
  }
}