/* ============================================================
   PV CaseLab v1.41 — Simple Clinical Theme Refresh
   Presentation layer only. No JavaScript, API, Supabase,
   Razorpay, role, entitlement, classroom or case logic changes.
   ============================================================ */

:root{
  --bg:#f4f8fc;
  --card:#ffffff;
  --text:#102746;
  --muted:#65778e;
  --line:#d8e4f0;
  --blue:#0b6fd9;
  --blue2:#0a57b4;
  --nav:#07396d;
  --nav2:#0a4d87;
  --teal:#0aa6a6;
  --good:#0b7a55;
  --warn:#9a6700;
  --bad:#b42318;
  --radius:18px;
}

html{background:var(--bg)}
body{
  color:var(--text);
  background:
    radial-gradient(circle at 92% 4%,rgba(11,111,217,.08),transparent 25%),
    radial-gradient(circle at 6% 94%,rgba(10,166,166,.06),transparent 28%),
    var(--bg);
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
}

/* ---------- Shared controls ---------- */
.btn{
  min-height:44px;
  border-radius:12px;
  padding:11px 16px;
  font-weight:800;
  transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease,background .16s ease;
}
.btn:hover{transform:translateY(-1px)}
.primary{
  background:linear-gradient(135deg,var(--blue),var(--blue2));
  color:#fff;
  box-shadow:0 8px 18px rgba(11,111,217,.18);
}
.primary:hover{box-shadow:0 11px 22px rgba(11,111,217,.24)}
.secondary{background:#fff;border-color:#8ebae8;color:#075cae}
.secondary:hover{background:#f5faff;border-color:#5f9cdb}
.ghost{background:#fff;border-color:var(--line);color:var(--text)}
.link{color:#234568;font-weight:700}
.link:hover{color:var(--blue)}
.info,.menuBtn{
  border:1px solid var(--line)!important;
  background:#fff!important;
  color:#234568!important;
  box-shadow:0 3px 10px rgba(15,39,70,.05);
}
.input,.select,.textarea{
  border-color:#cfdeec;
  background:#fff;
  color:var(--text);
  transition:border-color .15s ease,box-shadow .15s ease;
}
.input:focus,.select:focus,.textarea:focus{
  border-color:#72aee7;
  box-shadow:0 0 0 4px rgba(11,111,217,.09);
  outline:none;
}

/* ---------- Public header / footer ---------- */
header{
  height:74px;
  padding:0 clamp(16px,4vw,54px);
  border-bottom:1px solid rgba(207,222,236,.85);
  background:rgba(255,255,255,.92);
  backdrop-filter:blur(14px);
  box-shadow:0 5px 18px rgba(15,39,70,.035);
}
header>.brand{
  display:flex;
  align-items:center;
  gap:11px;
  font-size:1.38rem;
  letter-spacing:-.025em;
  color:#092f5f;
}
header>.brand::before,
.side .brand::before,
.brandline::before{
  content:"";
  width:24px;
  height:12px;
  flex:0 0 auto;
  border-radius:999px;
  transform:rotate(-42deg);
  background:linear-gradient(90deg,#0b6fd9 0 50%,#bfe7f5 50% 100%);
  box-shadow:0 0 0 1px rgba(7,57,109,.08);
}
.nav{gap:7px}
.nav .link{border-radius:9px;padding:8px 11px}
.nav .link:hover{background:#f2f7fd}
footer,.publicFooter{
  min-height:70px;
  background:rgba(255,255,255,.94);
  border-top:1px solid var(--line);
  color:var(--muted);
}
.footerLinks .link,footer .link{font-size:.84rem}

/* ---------- Opening page: attractive but intentionally simple ---------- */
main.public{
  min-height:calc(100vh - 144px);
  padding:clamp(18px,4vw,52px) 18px;
  background:
    radial-gradient(circle at 80% 15%,rgba(11,111,217,.09),transparent 28%),
    radial-gradient(circle at 16% 82%,rgba(10,166,166,.07),transparent 26%);
}
.homeBtns{
  width:min(980px,100%);
  min-height:540px;
  position:relative;
  overflow:hidden;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-content:end;
  gap:18px;
  padding:255px 36px 88px;
  border:1px solid rgba(202,220,238,.9);
  border-radius:30px;
  background:
    radial-gradient(circle at 18% 18%,rgba(10,166,166,.10),transparent 24%),
    radial-gradient(circle at 84% 12%,rgba(11,111,217,.12),transparent 30%),
    linear-gradient(145deg,rgba(255,255,255,.99),rgba(247,251,255,.96));
  box-shadow:0 28px 70px rgba(15,39,70,.10);
}
.homeBtns::before{
  content:"Choose your PV CaseLab workspace\A\A Practice pharmacovigilance through guided, fictional ICSR cases in a secure educational environment.";
  white-space:pre-line;
  position:absolute;
  top:54px;
  left:44px;
  right:44px;
  max-width:720px;
  margin:auto;
  text-align:center;
  font-size:clamp(1.35rem,2.6vw,2.35rem);
  line-height:1.18;
  letter-spacing:-.035em;
  font-weight:850;
  color:#0c2c55;
}
.homeBtns::after{
  content:"Educational training only  •  Fictional cases  •  Secure role-based access";
  position:absolute;
  left:28px;
  right:28px;
  bottom:28px;
  text-align:center;
  color:#617790;
  font-size:.82rem;
  font-weight:700;
  letter-spacing:.01em;
}
.homeBtns .btn{
  min-height:142px;
  border-radius:20px;
  padding:26px 27px;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  justify-content:center;
  text-align:left;
  font-size:1.28rem;
  letter-spacing:-.015em;
  box-shadow:0 12px 30px rgba(15,39,70,.07);
  position:relative;
  overflow:hidden;
}
.homeBtns .btn::before{
  display:block;
  margin-bottom:9px;
  font-size:.73rem;
  line-height:1;
  letter-spacing:.13em;
  font-weight:900;
  opacity:.78;
}
.homeBtns .btn::after{
  display:block;
  margin-top:9px;
  max-width:310px;
  font-size:.83rem;
  line-height:1.45;
  font-weight:600;
  opacity:.78;
}
.homeBtns .btn:first-child::before{content:"STUDENT PORTAL"}
.homeBtns .btn:first-child::after{content:"Practice cases, learn structured ICSR workflows and track your progress."}
.homeBtns .btn:nth-child(2)::before{content:"TEACHER PORTAL"}
.homeBtns .btn:nth-child(2)::after{content:"Create classrooms, assign cases and support learner progress."}
.homeBtns .primary{background:linear-gradient(145deg,#0a65c7,#08498f)}
.homeBtns .secondary{border-color:#b8d5ee;background:#fff;color:#0a4d91}
.homeBtns .secondary:hover{background:#f7fbff}

/* ---------- Auth ---------- */
.auth,.auth.authWide{
  border:1px solid rgba(205,220,234,.9);
  border-radius:24px;
  box-shadow:0 24px 65px rgba(15,39,70,.11);
  background:rgba(255,255,255,.98);
}
.authTitle{color:#0c2c55;letter-spacing:-.02em}
.roleMark{
  background:linear-gradient(145deg,#eaf5ff,#e7f8f7);
  border:1px solid #d2e5f4;
  color:#0b6fd9;
}
.googleBtn{border-color:#d3e0ec;border-radius:12px}
.googleBtn:hover{background:#f7fbff}
.consentBox,.legalAcceptBox,.note,.successSoft,.issue,.success{
  border-radius:14px;
}

/* ---------- Student / Teacher shell ---------- */
.side{
  background:linear-gradient(180deg,#07396d 0%,#0a4b83 72%,#083965 100%);
  box-shadow:10px 0 30px rgba(7,57,109,.10);
}
.side .brand{
  display:flex;
  align-items:center;
  gap:10px;
  padding:9px 10px 21px;
  margin-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.12);
  font-size:1.02rem;
  letter-spacing:-.01em;
}
.side .brand::before{filter:saturate(.8) brightness(1.4)}
.sideBtn,.sidebtn{
  min-height:42px;
  margin:3px 0;
  padding:10px 12px;
  border-radius:11px;
  color:#dcecff;
  transition:background .14s ease,color .14s ease,transform .14s ease;
}
.sideBtn:hover,.sideBtn.active,.sidebtn:hover,.sidebtn.active{
  background:rgba(255,255,255,.13);
  color:#fff;
  transform:translateX(2px);
}
.groupLabel,.sidegroup{color:#9bc4ec}
.portal{background:transparent}
.top{
  height:70px;
  padding:0 22px;
  background:rgba(255,255,255,.93);
  backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(211,225,238,.9);
  box-shadow:0 5px 16px rgba(15,39,70,.035);
}
.top b{color:#15385e;letter-spacing:-.01em}
.content{
  max-width:1280px;
  padding:28px;
}
.section{margin:26px 0 12px}
.section h2,.section h3{color:#13355b;letter-spacing:-.015em}
.card{
  border:1px solid rgba(211,225,238,.96);
  border-radius:18px;
  background:rgba(255,255,255,.98);
  box-shadow:0 7px 22px rgba(15,39,70,.045);
}
.cards3,.grid2,.grid3{gap:16px}
.kicker{color:#6d8095;letter-spacing:.09em}
.big{color:#0b3b70;letter-spacing:-.035em}
.badge{border:1px solid #e2e9f1;background:#f4f7fa;color:#52677e}
.badge.good,.good{border-color:#c8eadc;background:#eefaf4;color:#0b7a55}
.badge.warn,.warn{border-color:#f1dbab;background:#fff8e6;color:#8a5a00}

/* ---------- Case workspace ---------- */
.workspace{background:transparent}
.workflow{
  background:linear-gradient(180deg,#f8fbff,#f4f9fd);
  border-right:1px solid #dce8f2;
}
.wHead{color:#173a61;border-radius:10px}
.wHead:hover{background:#eaf4fd}
.wStep{color:#587089}
.wStep:hover{background:#eef5fb;color:#214f7e}
.wStep.active{
  background:linear-gradient(90deg,#dceeff,#eaf8f7);
  color:#075cae;
  box-shadow:inset 3px 0 0 #0b6fd9;
}
.work{padding:28px}
.source{background:#fffdf6;border-color:#eadfae}
.bottom{border-top-color:#dce7f1}

/* ---------- Lists / tables / finance ---------- */
.case{
  border-radius:14px;
  transition:background .15s ease,transform .15s ease;
}
.case:hover{background:#f8fbfe}
.table{
  border-color:#d7e3ee;
  border-radius:16px;
  box-shadow:0 5px 18px rgba(15,39,70,.035);
}
th{background:#f7fafe;color:#5f738a}
th,td{border-bottom-color:#e4ebf2}
.finRow{border-bottom-color:#e5edf4}
.priceCard{box-shadow:0 8px 24px rgba(15,39,70,.05)}
.codeBox{background:#f7fbff;border-color:#a9c7e4}

/* ---------- Modal ---------- */
.back,.shade{background:rgba(6,26,47,.58);backdrop-filter:blur(2px)}
.modal{
  border:1px solid rgba(205,220,234,.92);
  border-radius:22px;
  box-shadow:0 30px 80px rgba(6,26,47,.22);
}

/* ---------- Admin page ---------- */
#gate{
  background:
    radial-gradient(circle at 82% 12%,rgba(11,111,217,.08),transparent 30%),
    radial-gradient(circle at 14% 86%,rgba(10,166,166,.06),transparent 28%);
}
.brandline{
  display:flex;
  align-items:center;
  gap:10px;
  color:#0a4d91;
  font-weight:900;
}
#gate .auth{padding:30px}
.dangerBtn{border-radius:12px}
.warning,.error{border-radius:14px}
.mfaStrip{border-radius:999px}

/* ---------- Responsive ---------- */
@media(max-width:900px){
  .homeBtns{min-height:590px;padding:230px 24px 82px}
  .homeBtns::before{top:46px;left:24px;right:24px}
}
@media(max-width:720px){
  header{height:68px;padding:0 14px}
  header>.brand{font-size:1.08rem}
  header>.brand::before{width:20px;height:10px}
  .nav{gap:2px}
  .nav .link{padding:7px 6px;font-size:.78rem}
  main.public{padding:16px 12px}
  .homeBtns{
    min-height:auto;
    grid-template-columns:1fr;
    padding:210px 15px 82px;
    border-radius:22px;
  }
  .homeBtns::before{top:40px;font-size:1.45rem}
  .homeBtns .btn{min-height:128px;padding:22px}
  .homeBtns::after{font-size:.72rem;bottom:24px}
  .content,.work{padding:16px}
  .card{border-radius:15px}
  .top{padding:0 14px}
}
@media(max-width:480px){
  .homeBtns{padding-top:225px}
  .homeBtns::before{font-size:1.28rem;line-height:1.25}
  .homeBtns .btn{font-size:1.08rem}
  .homeBtns .btn::after{font-size:.77rem}
  .nav .info{display:none}
}
