/* ============================================================
   One Stop Health Services – Public Stylesheet
   Nirmol Bangladesh
   ============================================================ */

:root {
  --oshs-primary:   #006A4E; /* Bangladesh green */
  --oshs-secondary: #F42A41; /* Bangladesh red   */
  --oshs-light:     #f5f9f7;
  --oshs-white:     #ffffff;
  --oshs-text:      #1a1a2e;
  --oshs-muted:     #6c757d;
  --oshs-border:    #dee2e6;
  --oshs-radius:    8px;
  --oshs-shadow:    0 2px 12px rgba(0,0,0,.10);
}

/* ── Layout ──────────────────────────────────────────────── */
.oshs-wrap          { font-family: 'Segoe UI', Roboto, sans-serif; color: var(--oshs-text); max-width: 1100px; margin: 0 auto; padding: 0 16px; }
.oshs-card          { background: var(--oshs-white); border-radius: var(--oshs-radius); box-shadow: var(--oshs-shadow); padding: 24px; margin-bottom: 24px; }
.oshs-grid-2        { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.oshs-grid-3        { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }

@media(max-width:680px){ .oshs-grid-2, .oshs-grid-3 { grid-template-columns: 1fr; } }

/* ── Dashboard header ────────────────────────────────────── */
.oshs-dashboard-header { display:flex; align-items:center; gap:16px; background:var(--oshs-primary); color:#fff; padding:20px 24px; border-radius:var(--oshs-radius); margin-bottom:24px; }
.oshs-dashboard-header img.avatar { width:72px; height:72px; border-radius:50%; border:3px solid #fff; object-fit:cover; }
.oshs-dashboard-header .meta h2   { margin:0; font-size:1.25rem; }
.oshs-dashboard-header .meta p    { margin:4px 0 0; opacity:.85; font-size:.9rem; }
.oshs-patient-id    { display:inline-block; background:#fff; color:var(--oshs-primary); font-weight:700; padding:4px 12px; border-radius:20px; font-size:.85rem; margin-top:6px; }

/* ── QR code ─────────────────────────────────────────────── */
.oshs-qr-wrap       { text-align:center; }
.oshs-qr-wrap img   { width:140px; height:140px; border:4px solid var(--oshs-primary); border-radius:var(--oshs-radius); }

/* ── Stat boxes ──────────────────────────────────────────── */
.oshs-stat-box      { background:var(--oshs-light); border-left:4px solid var(--oshs-primary); padding:16px 20px; border-radius:var(--oshs-radius); }
.oshs-stat-box .num { font-size:2rem; font-weight:700; color:var(--oshs-primary); line-height:1; }
.oshs-stat-box .lbl { font-size:.85rem; color:var(--oshs-muted); margin-top:4px; }

/* ── Tabs ────────────────────────────────────────────────── */
.oshs-tabs          { display:flex; flex-wrap:wrap; gap:4px; border-bottom:2px solid var(--oshs-border); margin-bottom:20px; }
.oshs-tabs .tab-btn { background:none; border:none; padding:10px 18px; cursor:pointer; font-size:.9rem; color:var(--oshs-muted); border-bottom:2px solid transparent; margin-bottom:-2px; transition:.2s; }
.oshs-tabs .tab-btn.active, .oshs-tabs .tab-btn:hover { color:var(--oshs-primary); border-bottom-color:var(--oshs-primary); }
.oshs-tab-panel     { display:none; }
.oshs-tab-panel.active { display:block; }

/* ── Forms ───────────────────────────────────────────────── */
.oshs-form .form-row    { margin-bottom:16px; }
.oshs-form label        { display:block; font-size:.88rem; font-weight:600; margin-bottom:6px; }
.oshs-form input,
.oshs-form select,
.oshs-form textarea     { width:100%; padding:10px 12px; border:1px solid var(--oshs-border); border-radius:var(--oshs-radius); font-size:.95rem; box-sizing:border-box; transition:border .2s; }
.oshs-form input:focus,
.oshs-form select:focus,
.oshs-form textarea:focus { outline:none; border-color:var(--oshs-primary); }
.oshs-form textarea     { min-height:90px; resize:vertical; }

/* ── Buttons ─────────────────────────────────────────────── */
.oshs-btn           { display:inline-block; padding:10px 22px; border:none; border-radius:var(--oshs-radius); font-size:.95rem; font-weight:600; cursor:pointer; text-decoration:none; transition:.2s; }
.oshs-btn-primary   { background:var(--oshs-primary); color:#fff; }
.oshs-btn-primary:hover { background:#004d38; }
.oshs-btn-danger    { background:var(--oshs-secondary); color:#fff; }
.oshs-btn-danger:hover  { background:#c0212f; }
.oshs-btn-outline   { background:transparent; border:2px solid var(--oshs-primary); color:var(--oshs-primary); }
.oshs-btn-sm        { padding:6px 14px; font-size:.82rem; }

/* ── Tables ──────────────────────────────────────────────── */
.oshs-table         { width:100%; border-collapse:collapse; font-size:.9rem; }
.oshs-table th      { background:var(--oshs-primary); color:#fff; padding:10px 12px; text-align:left; }
.oshs-table td      { padding:10px 12px; border-bottom:1px solid var(--oshs-border); }
.oshs-table tr:last-child td { border-bottom:none; }
.oshs-table tr:hover td { background:var(--oshs-light); }

/* ── Status badges ───────────────────────────────────────── */
.oshs-badge         { display:inline-block; padding:3px 10px; border-radius:20px; font-size:.78rem; font-weight:600; text-transform:uppercase; }
.oshs-badge-success { background:#d1fadf; color:#166534; }
.oshs-badge-warning { background:#fef3c7; color:#92400e; }
.oshs-badge-danger  { background:#fee2e2; color:#991b1b; }
.oshs-badge-info    { background:#dbeafe; color:#1e40af; }

/* ── Doctor card ─────────────────────────────────────────── */
.oshs-doctor-card   { display:grid; grid-template-columns:1fr 1fr; gap:0; border:1px solid var(--oshs-border); border-radius:var(--oshs-radius); overflow:hidden; background:#fff; }
.oshs-doctor-card .col-left  { padding:16px; border-right:1px solid var(--oshs-border); }
.oshs-doctor-card .col-right { padding:16px; background:var(--oshs-light); }
.oshs-doctor-card img.dr-photo { width:64px; height:64px; border-radius:50%; object-fit:cover; border:3px solid var(--oshs-primary); margin-bottom:8px; }
.oshs-doctor-card h4 { margin:0 0 4px; font-size:1rem; color:var(--oshs-primary); }
.oshs-doctor-card p  { margin:3px 0; font-size:.85rem; color:var(--oshs-muted); }

/* ── Alert messages ──────────────────────────────────────── */
.oshs-alert         { padding:12px 16px; border-radius:var(--oshs-radius); margin-bottom:16px; font-size:.9rem; display:none; }
.oshs-alert-success { background:#d1fadf; color:#166534; border:1px solid #6ee7b7; }
.oshs-alert-error   { background:#fee2e2; color:#991b1b; border:1px solid #fca5a5; }

/* ── Medicine reminder badge ─────────────────────────────── */
.oshs-reminder      { background:#fff8e1; border:1px solid #f9a825; border-radius:var(--oshs-radius); padding:10px 14px; display:flex; align-items:center; gap:10px; font-size:.88rem; }
.oshs-reminder .bell{ font-size:1.2rem; }

/* ── Auth forms (login/register) ─────────────────────────── */
.oshs-auth-box      { max-width:460px; margin:40px auto; }
.oshs-auth-box .logo{ text-align:center; margin-bottom:20px; }
.oshs-auth-box .logo img { height:60px; }
.oshs-auth-box h2   { text-align:center; color:var(--oshs-primary); margin-bottom:24px; }