/* =============================================================================
   CPCSL authentication pages — student login / register, parent login,
   course login / register. Left: the wine brand panel (texts editable in
   Admin → Website Design → "Brand Panel"); right: the form card on ivory.
   ============================================================================= */
:root[data-theme="dark"],:root[data-theme="light"],:root{
  --bg-main:#FBF7F1;--bg-panel:#FBF7F1;--text-primary:#21161A;--text-secondary:#76686A;--border-color:#E9DDCF;--input-bg:#fff;
  --primary-logic:#3A0A12;--accent-logic:#B3151F;--accent-hover:#8E1422;--shadow-lg:0 24px 70px -20px rgba(58,10,18,.28);--brand-gradient:none}
body{background:#FBF7F1!important;color:#21161A!important;font-family:var(--cp-font-ui,'Manrope','Noto Sans Sinhala',sans-serif)!important}
.layout-wrapper{background:#FBF7F1}

/* ---------- brand panel ---------- */
.brand-section{position:sticky!important;top:0!important;align-self:flex-start!important;flex:1.05!important;height:100vh!important;min-height:100vh!important;
  padding:clamp(36px,5vw,64px)!important;overflow:hidden!important;isolation:isolate;color:#fff!important;
  display:flex!important;flex-direction:column!important;justify-content:space-between!important;gap:28px;
  background:
    radial-gradient(520px 420px at 100% 0%,rgba(227,139,18,.30),transparent 70%),
    radial-gradient(520px 460px at 0% 100%,rgba(213,28,30,.38),transparent 70%),
    linear-gradient(160deg,#4A0A14 0%,#2A0810 55%,#1C060B 100%)!important}
/* dot grid */
.brand-section::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background-image:radial-gradient(rgba(243,199,122,.16) 1px,transparent 1.2px);background-size:24px 24px;
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 80%);mask-image:linear-gradient(180deg,#000,transparent 80%)}
/* the logo's symbol on an ivory plate, floating between the two text blocks */
.brand-section::after{content:"";position:absolute;z-index:0;right:clamp(28px,5vw,64px);top:50%;width:min(230px,34%);aspect-ratio:1;transform:translateY(-58%) rotate(-6deg);
  border-radius:38px;background:#FBF7F1 url('../uploads/branding/cpcsl-mark.png') center/68% no-repeat;
  box-shadow:0 40px 80px -30px rgba(0,0,0,.6),0 0 0 10px rgba(243,199,122,.08)}
.brand-section>*{position:relative;z-index:1}
.brand-section .logic-particle,.brand-section .slideshow-container{display:none!important}
.brand-section .brand-header-top{display:block!important}
.brand-section .brand-title-mini{display:inline-flex;align-items:center;gap:10px;font:600 11.5px/1 var(--cp-font-mark,'Cinzel',serif)!important;letter-spacing:.28em;text-transform:uppercase;color:#F3C77A!important;opacity:1!important}
.brand-section .brand-title-mini::before{content:"";width:24px;height:2px;border-radius:2px;background:linear-gradient(90deg,#D51C1E,#E38B12)}
.brand-section .brand-header-top h2{font:600 30px/1.1 var(--cp-font-display,'Fraunces',serif)!important;letter-spacing:.02em!important;color:#fff!important;margin-top:10px!important}
.brand-section .brand-header-top h2 span{color:#F3C77A!important}
.brand-section .brand-content-bottom{display:block!important;max-width:min(30rem,62%)}
.brand-section .brand-content-bottom h1{font:600 clamp(32px,3.4vw,48px)/1.05 var(--cp-font-display,'Fraunces',serif)!important;letter-spacing:-.025em;color:#fff!important;margin:0 0 14px!important}
.brand-section .brand-content-bottom h1 span{display:block;font-style:italic;font-weight:500;color:#F3C77A!important;background:none!important;-webkit-text-fill-color:currentColor!important}
.brand-section .brand-content-bottom p{color:rgba(255,241,230,.78)!important;font-size:15.5px!important;line-height:1.65!important}
.brand-section .badges{display:flex!important;flex-wrap:wrap;gap:10px;margin-top:22px}
.brand-section .badge{display:inline-flex!important;align-items:center;gap:8px;padding:9px 15px!important;border-radius:999px!important;
  background:rgba(255,255,255,.06)!important;border:1px solid rgba(243,199,122,.32)!important;color:#FFF3E6!important;font-weight:700!important;font-size:13px!important;box-shadow:none!important}
.brand-section .badge i{color:#F3C77A!important}
/* course login / register: the panel has no markup, so draw the texts' place with the wordmark */
.brand-section:empty{justify-content:flex-end!important}
.brand-section:empty::after{top:50%;right:50%;transform:translate(50%,-50%) rotate(-6deg);width:min(260px,42%)}

/* ---------- form side ---------- */
.login-section,.register-section{position:relative;flex:.95!important;background:#FBF7F1!important;padding:90px 6vw 55px!important;align-items:flex-start!important}
.login-section:before,.register-section:before{content:"";position:absolute;top:30px;left:6vw;width:200px;height:40px;background:url('../uploads/branding/cpcsl-mark.png') left center/contain no-repeat}
.login-box,.register-box{width:100%!important;max-width:560px!important;margin:auto!important;padding:42px!important;background:#fff!important;border:1px solid #E9DDCF!important;border-radius:24px!important;box-shadow:0 30px 70px -30px rgba(58,10,18,.35)!important;position:relative}
.login-box:before,.register-box:before{background:linear-gradient(90deg,#8E1422,#D51C1E 45%,#E38B12)!important}
.login-header h2,.register-header h2{color:#21161A!important;font:600 32px/1.15 var(--cp-font-display,'Fraunces',serif)!important;letter-spacing:-.02em!important}
.login-header p,.register-header p{color:#76686A!important}
.form-group label{color:#4A3D40!important;font-weight:700!important}
.input-wrapper input,.input-wrapper select{background:#FFFDF9!important;color:#21161A!important;border:1.5px solid #E2D4C6!important;border-radius:12px!important}
.input-wrapper input:focus,.input-wrapper select:focus{border-color:#B3151F!important;box-shadow:0 0 0 4px rgba(179,21,31,.1)!important;background:#fff!important}
.field-icon,.password-toggle,.select-arrow{color:#A08A80!important}
.login-btn,.register-btn{background:linear-gradient(118deg,#5A0E1A,#B3151F 60%,#D51C1E)!important;color:#fff!important;border-radius:999px!important;box-shadow:0 16px 30px -14px rgba(142,20,34,.75)!important}
.login-btn:hover,.register-btn:hover{filter:brightness(1.08);transform:translateY(-2px)!important}
.register-link{color:#76686A!important}.register-link a,.forgot-link a,a.forgot-link{color:#B3151F!important}
.theme-toggle-wrapper{display:none!important}
.error-card{background:#FDEDEC!important;border-color:#F6C2BD!important;color:#B3261E!important}

@media(max-width:900px){
  .brand-section{display:none!important}
  .login-section,.register-section{padding:92px 20px 36px!important;min-height:100vh!important}
  .login-section:before,.register-section:before{left:50%;transform:translateX(-50%);top:28px}
  .login-box,.register-box{max-width:620px!important;padding:32px 22px!important}
}