/* AIDx app theme – blue and sky-blue with bold Calibri headings (matches the new landing page).
   Loaded AFTER the app's own CSS, so it restyles every page without touching app code. */
@import url('https://fonts.googleapis.com/css2?family=Carlito:wght@400;700&display=swap');

:root{
  color-scheme:light;
  --ink:#10286a; --teal:#10286a; --teal-dark:#0a1d4d;
  --paper:#f3f7ff; --card:#fafcff; --line:#10286a;
  --danger:#c0392b; --success:#1d7a3a;
  --forest:#10286a; --lime:#8cd0ff; --lav:#e6e0fb; --sage:#dbe8ff; --muted:#4a5f8a;
  --serif:Calibri,Carlito,"Segoe UI",system-ui,sans-serif;
  font-family:Calibri,Carlito,"Segoe UI",system-ui,sans-serif;
}
body{background:var(--paper);color:var(--forest);line-height:1.6;font-size:17px;font-family:Calibri,Carlito,"Segoe UI",system-ui,sans-serif}
button,input,select,textarea,table,label,legend{font-family:inherit}
body::before{content:"";position:fixed;top:0;left:0;right:0;height:5px;background:var(--lime);border-bottom:1.5px solid var(--forest);z-index:100}

h1,h2,h3{font-family:var(--serif);font-weight:700;color:var(--forest);letter-spacing:-.01em;line-height:1.1}
h1{font-size:clamp(2rem,4.5vw,3rem)}
a{color:var(--forest)}
a:focus-visible,button:focus-visible{outline:3px solid var(--forest);outline-offset:2px}

/* Buttons: lime oval with dark outline; secondary = outline only */
button{background:var(--lime);color:var(--forest);border:1.5px solid var(--forest);border-radius:999px;padding:.7rem 1.7rem;font-weight:500;font-family:inherit;transition:background .15s,color .15s,transform .15s}
button:hover{background:var(--forest);color:var(--paper);transform:translateY(-2px)}
button.secondary{background:transparent;color:var(--forest)}
button.secondary:hover{background:var(--lime);color:var(--forest)}
button.link{background:transparent;border:none;color:var(--forest);padding:.2rem .4rem;text-decoration:underline;font-weight:500}
button.link:hover{background:transparent;color:var(--forest);transform:none;text-decoration-thickness:2px}
button.link.danger{color:var(--danger)}
button:disabled{opacity:.5;transform:none}

/* Login / register pages */
.auth-page{background:var(--forest)}
.auth-card{background:var(--paper);border:1.5px solid var(--lime);border-radius:24px;box-shadow:0 22px 50px rgba(0,0,0,.35)}
.auth-card::before,.admin-sidebar::before{content:"";display:block;width:46px;height:46px;margin-bottom:14px;background:url(/logo.png) center/contain no-repeat}
.auth-subtitle{color:var(--muted)}
.auth-form label,.doctor-form label{color:var(--forest);font-weight:500}
.auth-form input,.auth-form select,.doctor-form input,.freetext-label textarea{border:1.5px solid var(--forest);border-radius:12px;background:#fff;padding:.7rem .85rem;font-family:inherit;color:var(--forest)}
.auth-form input:focus,.auth-form select:focus,.doctor-form input:focus,.freetext-label textarea:focus{outline:3px solid rgba(140,208,255,.85);border-color:var(--forest)}
.form-error{background:#ffe4dc;color:#8c2a17;border:1.5px solid var(--danger);border-radius:12px}
.form-success{color:var(--success)}

/* Pages */
.page{max-width:960px}
.page-header{padding-bottom:1rem;border-bottom:1.5px solid var(--forest)}

/* Symptom groups: light blue / lavender / light-blue tint / cream, each with a dark outline */
.symptom-group{border:1.5px solid var(--forest);border-radius:18px;padding:1.25rem 1.5rem}
.symptom-group:nth-of-type(4n+1){background:var(--sage)}
.symptom-group:nth-of-type(4n+2){background:var(--lav)}
.symptom-group:nth-of-type(4n+3){background:#d9f1ff}
.symptom-group:nth-of-type(4n+4){background:var(--card)}
.symptom-group legend{font-family:var(--serif);font-weight:700;font-size:1.15rem;color:var(--forest);padding:0 .4rem}
.symptom-checkbox input{accent-color:var(--forest);width:1.1rem;height:1.1rem}

/* Cards */
.intake-card,.application-card,.doctor-form{background:var(--card);border:1.5px solid var(--forest);border-radius:18px;box-shadow:none}
.intake-card:nth-of-type(3n+2),.application-card:nth-of-type(3n+2){background:#ece8fc}
.intake-card:nth-of-type(3n+3),.application-card:nth-of-type(3n+3){background:#e8f0ff}
.doc-preview-link{border-radius:12px;border:1.5px solid var(--forest)}

/* Status labels */
.status-badge{background:var(--lav);color:var(--forest);border:1.5px solid var(--forest)}
.status-pending{background:#d9f1ff;color:var(--forest)}
.status-approved{background:var(--lime);color:var(--forest)}
.status-rejected{background:#ffe4dc;color:#8c2a17}
.status-submitted{background:var(--lav);color:var(--forest)}

/* Admin panel */
.admin-sidebar{background:var(--forest)}
.admin-sidebar h2{color:var(--lime)}
.admin-sidebar nav a{color:var(--paper);opacity:1;padding:.6rem .9rem;border-radius:12px}
.admin-sidebar nav a:hover{background:var(--lime);color:var(--forest)}
.admin-content{background:var(--paper)}
.data-table{border:1.5px solid var(--forest);border-radius:14px;overflow:hidden}
.data-table th{background:var(--lime);color:var(--forest);font-weight:600}

/* Phones */
@media (max-width:760px){
  .admin-layout{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .page{padding:1.5rem 1rem}
  .admin-content{padding:1.5rem 1rem}
  .page-header,.button-row{flex-wrap:wrap;gap:.8rem}
  .data-table{display:block;overflow-x:auto}
}

/* ===================== v2: friendlier, more graphic pages ===================== */
body{background:radial-gradient(circle at 0% 0%,#dbe8ff 0,transparent 38%),radial-gradient(circle at 100% 18%,#e6e0fb 0,transparent 34%),var(--paper);background-attachment:fixed}
.page{max-width:920px;margin:2.2rem auto;padding:2.2rem clamp(1.2rem,4vw,2.6rem);background:var(--card);border:1.5px solid var(--forest);border-radius:26px;box-shadow:0 18px 44px rgba(16,40,106,.12)}
.page-header h1{font-size:clamp(1.9rem,4.5vw,2.6rem)}
.page h2{display:flex;align-items:center;gap:.6rem;font-size:1.3rem;margin-top:2rem}
.page h2::before{content:"";flex:none;width:8px;height:1.3em;border-radius:6px;background:var(--lime);border:1.5px solid var(--forest)}
.page > a > button{font-size:1.1rem;padding:1rem 2.2rem}

/* progress tracker */
.aidx-steps{margin:1.2rem 0 1.8rem}
.aidx-steps ol{list-style:none;display:flex;gap:6px;padding:0;margin:0}
.aidx-steps li{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:.85rem;color:var(--muted);position:relative}
.aidx-steps li::before{content:"";position:absolute;top:16px;left:-50%;width:100%;height:3px;background:#cfdcf7}
.aidx-steps li:first-child::before{display:none}
.aidx-steps li.done::before,.aidx-steps li.now::before{background:var(--forest)}
.aidx-steps b{position:relative;z-index:1;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid #cfdcf7;color:var(--muted)}
.aidx-steps li.done b{background:var(--forest);border-color:var(--forest);color:#fff}
.aidx-steps li.now b{background:var(--lime);border-color:var(--forest);color:var(--forest);box-shadow:0 0 0 5px rgba(140,208,255,.45)}
.aidx-steps li.now span{color:var(--forest);font-weight:700}

/* questions + voice */
.freetext-label{display:block;font-weight:700;background:#fff;border:1.5px solid var(--sage);border-left:6px solid var(--lime);border-radius:16px;padding:1rem 1.2rem}
.freetext-label textarea{display:block;width:100%;margin-top:.6rem;min-height:84px;resize:vertical;font-weight:400;border:1.5px solid var(--forest);border-radius:12px;padding:.7rem .85rem;font-family:inherit;font-size:1rem}
.freetext-label textarea:focus,select:focus{outline:3px solid rgba(140,208,255,.85);border-color:var(--forest)}
.voice-lang{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;background:var(--lav);border:1.5px solid var(--forest);border-radius:16px;padding:14px 18px;margin-bottom:1.4rem}
.voice-lang select{border:1.5px solid var(--forest);border-radius:10px;padding:.35rem .6rem;background:#fff;font-family:inherit;margin-left:.3rem}
.voice-lang small{flex-basis:100%;color:var(--muted)}
.voice-bar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-top:10px;font-weight:400}
.voice-btn{background:#fff;color:var(--forest);padding:.5rem 1.2rem;font-size:.95rem;box-shadow:none}
.voice-btn:hover{background:var(--sage);color:var(--forest)}
.voice-btn.on{background:#ff5a5a;color:#fff;border-color:#b82a2a;animation:aidxpulse 1.4s infinite}
.voice-btn.on:hover{background:#e84a4a;color:#fff}
.voice-btn:disabled{opacity:.6}
.voice-msg{font-size:.92rem;color:var(--muted);font-style:italic}
@keyframes aidxpulse{50%{box-shadow:0 0 0 7px rgba(255,90,90,.25)}}
@media (prefers-reduced-motion:reduce){.voice-btn.on{animation:none}}

/* notice boxes that the app styles inline */
.page div[style*="255, 244, 229"],.page div[style*="#fff4e5"]{background:#e8f1ff!important;border:1.5px solid var(--forest)!important;border-radius:16px!important;padding:1rem 1.2rem!important;font-size:.95rem!important}
.page div[style*="253, 236, 234"],.page div[style*="#fdecea"]{background:#ffe9e6!important;border:1.5px solid #d9483a!important;border-radius:16px!important;padding:1.1rem 1.3rem!important}
.page div[style*="inline-block"][style*="999px"]{box-shadow:0 6px 14px rgba(0,0,0,.18);letter-spacing:.02em}

/* symptom tick-boxes become tap-friendly chips */
.symptom-grid{display:flex;flex-wrap:wrap;gap:10px}
.symptom-checkbox{display:inline-flex;align-items:center;gap:8px;border:1.5px solid var(--forest);border-radius:999px;padding:.4rem 1rem;background:#fff;cursor:pointer;transition:background .15s}
.symptom-checkbox:hover{background:var(--sage)}
.symptom-checkbox:has(input:checked){background:var(--forest);color:#fff}
.symptom-checkbox:has(input:checked) input{accent-color:var(--lime)}

/* file upload + selects */
input[type=file]{width:100%;max-width:100%;padding:.8rem;margin-top:.5rem;border:2px dashed var(--forest);border-radius:14px;background:#fff;font-family:inherit}
input[type=file]::file-selector-button{margin-right:.8rem;padding:.45rem 1.1rem;border:1.5px solid var(--forest);border-radius:999px;background:var(--lime);color:var(--forest);font-weight:500;cursor:pointer}
.page select,.auth-form select{border:1.5px solid var(--forest);border-radius:12px;padding:.6rem .8rem;background:#fff;font-family:inherit}
.page textarea{border:1.5px solid var(--forest);border-radius:12px;padding:.7rem .85rem;font-family:inherit;width:100%}

/* cards */
.intake-card{transition:transform .15s}
.intake-card:hover{transform:translateY(-3px)}
.intake-header{align-items:center}
.status-badge{border-radius:999px;padding:.25rem .8rem;font-size:.85rem;font-weight:700}

@media (max-width:600px){
  .page{margin:1rem .6rem;border-radius:20px}
  .aidx-steps span{font-size:.7rem}
  .aidx-steps b{width:28px;height:28px}
  .aidx-steps li::before{top:13px}
  .page > a > button{width:100%}
}