/* Login / Register / Parent / Course log-in — Success English College skin.
   The left brand panel is the logo's royal blue with the light logo and the
   open-book wings; the form side is the silver paper of the logo backdrop.
   Tokens: css/brand.css (loaded by partials_public_shell.php). */
:root[data-theme="dark"],:root[data-theme="light"]{--bg-main:#f5f7fb;--bg-panel:#f5f7fb;--text-primary:#0e1b2c;--text-secondary:#5b6578;--border-color:#e1e6f0;--input-bg:#fff;--primary-logic:#10324d;--accent-logic:#1a24c4;--accent-hover:#1018a0;--shadow-lg:0 24px 70px rgba(16,50,77,.14);--brand-gradient:linear-gradient(150deg,#1a24c4 0%,#0d2c8f 55%,#10324d 100%)}
body{background:#f5f7fb!important;color:#0e1b2c!important;font-family:'Plus Jakarta Sans','Noto Sans Sinhala',sans-serif}
.layout-wrapper{background:#f5f7fb}

/* ---- 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:44px 48px!important;display:flex!important;flex-direction:column!important;justify-content:space-between!important;gap:24px;
  background:linear-gradient(150deg,#1a24c4 0%,#0d2c8f 55%,#10324d 100%)!important;color:#fff!important;overflow:hidden!important}
.brand-section::before{content:""!important;position:absolute;inset:auto -80px -40px auto;width:560px;height:170px;opacity:.12;animation:none!important;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 36'%3E%3Cpath d='M57 33C42 21 22 11 3 8c11 9 31 18 54 25z' fill='%23fff'/%3E%3Cpath d='M57 35C44 29 27 24 10 23c14 6 30 10 47 12z' fill='%23fff'/%3E%3Cpath d='M63 33c15-12 35-22 54-25-11 9-31 18-54 25z' fill='%23fff'/%3E%3Cpath d='M63 35c13-6 30-11 47-12-14 6-30 10-47 12z' fill='%23fff'/%3E%3C/svg%3E") center/contain no-repeat!important;
  background-size:contain!important}
.brand-section::after{content:"";position:absolute;right:-120px;top:-120px;width:360px;height:360px;border-radius:50%;border:46px solid rgba(40,196,53,.16);pointer-events:none}
.brand-section>*{position:relative;z-index:1}
/* a panel with no markup of its own (course log-in / register) shows the logo on a white disc */
.brand-section:empty{background-image:url('../uploads/branding/sec-logo.png'),radial-gradient(circle,#fff 0 150px,rgba(255,255,255,.22) 151px 152px,transparent 153px),linear-gradient(150deg,#1a24c4 0%,#0d2c8f 55%,#10324d 100%)!important;
  background-repeat:no-repeat!important;background-position:center 46%,center 45%,center!important;background-size:200px auto,auto,cover!important}
.brand-header-top .brand-title-mini{color:#9ff0a5!important;font-size:12px!important;font-weight:800!important;letter-spacing:.18em!important;text-transform:uppercase}
.brand-header-top h2{color:#fff!important;font:700 30px/1.05 'Oswald','Plus Jakarta Sans',sans-serif!important;letter-spacing:.03em!important;text-transform:uppercase}
.brand-header-top h2 span{color:#9ff0a5!important;margin-left:8px}
.sec-auth-art{position:relative;align-self:center;display:grid;place-items:center;width:min(70%,300px);aspect-ratio:1/1;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,#fff 0 55%,#eef1f7 100%);box-shadow:0 0 0 14px rgba(255,255,255,.08),0 0 0 15px rgba(255,255,255,.22),0 30px 60px rgba(0,0,0,.28)}
.sec-auth-art img{width:68%;height:auto;margin-top:-4%}
.sec-auth-bubble{position:absolute;padding:8px 13px;border-radius:14px;font:800 13px/1.2 'Plus Jakarta Sans',sans-serif;white-space:nowrap;box-shadow:0 12px 24px rgba(0,0,0,.22);animation:secAuthFloat 6s ease-in-out infinite}
.sec-auth-bubble.b1{left:-8%;top:8%;background:#13801f;color:#fff}
.sec-auth-bubble.b2{right:-14%;bottom:2%;background:#28c435;color:#0a1f33;animation-delay:-3s}
@keyframes secAuthFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.sec-auth-bubble{animation:none}}
.brand-content-bottom h1{color:#fff!important;font:700 clamp(30px,3.2vw,44px)/1.04 'Oswald','Plus Jakarta Sans',sans-serif!important;text-transform:uppercase;letter-spacing:.01em}
.brand-content-bottom h1 span{color:#9ff0a5!important;-webkit-text-fill-color:#9ff0a5!important;background:none!important}
.brand-content-bottom p{color:#d6def5!important;max-width:44ch}
.brand-content-bottom .badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.brand-content-bottom .badge{background:rgba(255,255,255,.12)!important;color:#fff!important;border:1px solid rgba(255,255,255,.22)!important;border-radius:999px!important;padding:7px 14px!important;font-weight:700!important;font-size:13px!important}
.brand-content-bottom .badge i{color:#9ff0a5!important}
.logic-particle,.slideshow-container{display:none!important}

/* ---- form side ---- */
.login-section,.register-section{position:relative;flex:.95!important;background:#f5f7fb!important;padding:70px 6vw 55px!important;align-items:flex-start!important}
.login-section:before,.register-section:before{content:"";position:absolute;top:26px;left:6vw;width:150px;height:46px;background:url('../uploads/branding/sec-logo.png') left center/contain no-repeat}
.login-box,.register-box{width:100%!important;max-width:560px!important;margin:auto!important;padding:40px!important;background:#fff!important;border:1px solid #e1e6f0!important;border-radius:22px!important;box-shadow:0 24px 70px rgba(16,50,77,.12)!important;position:relative;overflow:hidden}
.login-box:before,.register-box:before{content:""!important;position:absolute;left:0;right:0;top:0;height:4px!important;background:linear-gradient(90deg,#28c435 0,#28c435 50%,#1a24c4 50%,#1a24c4 100%)!important;display:block!important}
.login-header h2{color:#10324d!important;font-size:30px!important;font-weight:800!important;letter-spacing:-.01em}
.login-header p{color:#5b6578!important}
.login-header .eyebrow{background:#eef0ff!important;color:#1a24c4!important;border-color:#d9ddff!important}
.form-group label{color:#10324d!important;font-weight:700!important}
.input-wrapper input,.input-wrapper select,.input-wrapper textarea{background:#fff!important;color:#0e1b2c!important;border:1px solid #d6dce8!important;border-radius:12px!important}
.input-wrapper input:focus,.input-wrapper select:focus,.input-wrapper textarea:focus{border-color:#1a24c4!important;box-shadow:0 0 0 4px rgba(26,36,196,.12)!important}
.field-icon,.password-toggle,.select-arrow{color:#7d88a0!important}
.input-wrapper input:focus ~ .field-icon,.input-wrapper:focus-within .field-icon{color:#1a24c4!important}
.login-btn{background:#1a24c4!important;color:#fff!important;border-radius:999px!important;box-shadow:0 12px 28px rgba(26,36,196,.28)!important;font-weight:800!important}
.login-btn:hover{background:#1018a0!important;transform:translateY(-2px)!important}
.register-link{color:#5b6578!important}.register-link a{color:#1a24c4!important;font-weight:800!important}
.perk{background:#eef0ff!important;color:#10324d!important;border-color:#d9ddff!important}.perk i{color:#1a24c4!important}
.theme-toggle-wrapper{display:none!important}
.error-card{background:#fdecea!important;border-color:#f5c2bc!important;color:#a3271b!important}
.success-card,.alert-success{background:#e9fbea!important;border-color:#bfe9c3!important;color:#13801f!important}

@media(max-width:900px){
  .brand-section{display:none!important}
  .login-section,.register-section{padding:84px 16px 36px!important;min-height:100vh!important}
  .login-section:before,.register-section:before{left:50%;transform:translateX(-50%);top:22px}
  .login-box,.register-box{max-width:620px!important;padding:30px 20px!important;background:#fff!important;border:1px solid #e1e6f0!important;box-shadow:0 18px 50px rgba(16,50,77,.10)!important}
}