/* HMZ Pathology — Patient Self-Service Portal V1 */

.patient-auth-body {
    min-height:100vh;
    margin:0;
    background:linear-gradient(135deg,#eaf1ff,#f8fbff 50%,#dff8ff);
    font-family:Arial,sans-serif;
}

.patient-auth-shell {
    min-height:100vh;
    display:grid;
    grid-template-columns:1.1fr .9fr;
}

.patient-auth-brand,
.patient-auth-card {
    display:flex;
    justify-content:center;
    flex-direction:column;
    padding:7vw;
}

.patient-auth-brand {
    background:linear-gradient(145deg,#172033,#2563eb);
    color:#fff;
}

.patient-brand-icon {
    width:76px;
    height:76px;
    display:grid;
    place-items:center;
    margin-bottom:22px;
    border-radius:22px;
    background:rgba(255,255,255,.14);
    font-size:32px;
}

.patient-auth-brand h1 {
    margin:0;
    font-size:42px;
    font-weight:900;
}

.patient-auth-brand>p {
    margin:10px 0 0;
    color:#dbeafe;
    font-size:18px;
}

.patient-auth-features {
    display:flex;
    flex-direction:column;
    gap:14px;
    margin-top:40px;
}

.patient-auth-features span {
    display:flex;
    align-items:center;
    gap:12px;
}

.patient-auth-card {
    background:#fff;
}

.patient-auth-card>div:first-child h2 {
    margin:8px 0;
    font-size:32px;
    font-weight:900;
}

.patient-auth-card>div:first-child p {
    color:#64748b;
}

.patient-auth-eyebrow,
.patient-uid {
    color:#2563eb;
    font-size:12px;
    font-weight:900;
    letter-spacing:1.2px;
}

.patient-input-group {
    position:relative;
}

.patient-input-group i {
    position:absolute;
    top:50%;
    left:15px;
    z-index:2;
    transform:translateY(-50%);
    color:#64748b;
}

.patient-input-group .form-control {
    padding-left:43px;
    min-height:50px;
}

.patient-auth-help {
    margin:20px 0 0;
    color:#64748b;
    text-align:center;
}

.patient-portal-body {
    min-height:100vh;
    margin:0;
    background:#f3f7fb;
    color:#172033;
    font-family:Arial,sans-serif;
}

.patient-topbar {
    position:sticky;
    top:0;
    z-index:10;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:16px 5vw;
    border-bottom:1px solid #dbe4ef;
    background:#fff;
}

.patient-logo {
    display:flex;
    align-items:center;
    gap:11px;
    color:#172033;
    text-decoration:none;
}

.patient-logo span {
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    border-radius:13px;
    background:linear-gradient(135deg,#2563eb,#06b6d4);
    color:#fff;
}

.patient-topbar nav {
    display:flex;
    align-items:center;
    gap:18px;
}

.patient-topbar nav a {
    color:#334155;
    text-decoration:none;
    font-weight:700;
}

.patient-portal-main {
    width:min(1180px,92%);
    margin:30px auto 60px;
}

.patient-welcome-card {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    padding:28px;
    border-radius:22px;
    background:linear-gradient(135deg,#172033,#2563eb);
    color:#fff;
}

.patient-welcome-card h1 {
    margin:8px 0;
    font-size:32px;
    font-weight:900;
}

.patient-welcome-card p {
    margin:0;
    color:#dbeafe;
}

.patient-avatar {
    width:74px;
    height:74px;
    display:grid;
    place-items:center;
    border-radius:22px;
    background:rgba(255,255,255,.15);
    font-size:30px;
    font-weight:900;
}

.patient-summary-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
    margin:22px 0;
}

.patient-summary-grid article {
    display:flex;
    align-items:center;
    gap:13px;
    padding:18px;
    border:1px solid #dbe4ef;
    border-radius:17px;
    background:#fff;
}

.patient-summary-grid article>span {
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:14px;
}

.patient-summary-grid .blue { background:#eaf1ff;color:#2563eb; }
.patient-summary-grid .cyan { background:#dff8ff;color:#0891b2; }
.patient-summary-grid .green { background:#e2f8e9;color:#15803d; }
.patient-summary-grid .gray { background:#eef2f7;color:#475569; }

.patient-summary-grid article>div {
    display:flex;
    flex-direction:column;
}

.patient-summary-grid strong {
    margin-top:4px;
    font-size:24px;
}

.patient-content-card {
    overflow:hidden;
    border:1px solid #dbe4ef;
    border-radius:20px;
    background:#fff;
}

.patient-section-head,
.patient-page-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
}

.patient-section-head {
    padding:20px;
    border-bottom:1px solid #dbe4ef;
}

.patient-section-head h2,
.patient-page-head h1 {
    margin:0;
    font-weight:900;
}

.patient-section-head p,
.patient-page-head p {
    margin:5px 0 0;
    color:#64748b;
}

.patient-page-head {
    margin-bottom:20px;
}

.patient-report-list {
    display:grid;
    gap:12px;
    padding:18px;
}

.patient-report-card {
    display:grid;
    grid-template-columns:auto minmax(0,1fr) auto auto;
    align-items:center;
    gap:16px;
    padding:16px;
    border:1px solid #e2e8f0;
    border-radius:15px;
}

.patient-report-icon {
    width:48px;
    height:48px;
    display:grid;
    place-items:center;
    border-radius:14px;
    background:#eaf1ff;
    color:#2563eb;
    font-size:20px;
}

.patient-report-copy span {
    color:#2563eb;
    font-size:11px;
    font-weight:900;
}

.patient-report-copy h3 {
    margin:4px 0 0;
    font-size:17px;
}

.patient-report-copy p,
.patient-report-status small {
    margin:4px 0 0;
    color:#64748b;
}

.patient-report-status {
    display:flex;
    align-items:flex-end;
    flex-direction:column;
}

.patient-report-status span {
    padding:5px 9px;
    border-radius:999px;
    background:#e2f8e9;
    color:#15803d;
    font-size:11px;
    font-weight:800;
}

.patient-empty-state {
    min-height:220px;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-direction:column;
    color:#64748b;
    text-align:center;
}

.patient-empty-state i {
    margin-bottom:12px;
    font-size:38px;
}

.patient-report-view {
    width:min(1000px,94%);
    margin:28px auto 60px;
}

.patient-print-report {
    overflow:hidden;
    border:1px solid #dbe4ef;
    background:#fff;
}

.patient-print-report>header {
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:20px;
    padding:24px 28px;
    border-bottom:3px solid #2563eb;
}

.patient-print-report h1 {
    margin:0;
    font-size:26px;
    font-weight:900;
}

.patient-print-report header p,
.patient-print-report header span {
    margin:5px 0 0;
    color:#64748b;
}

.patient-print-report header>div:last-child {
    display:flex;
    align-items:flex-end;
    flex-direction:column;
}

.patient-report-demographics {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:1px;
    background:#dbe4ef;
}

.patient-report-demographics div {
    padding:14px;
    background:#f8fafc;
}

.patient-report-demographics span {
    display:block;
    color:#64748b;
    font-size:11px;
}

.patient-report-demographics strong {
    display:block;
    margin-top:5px;
}

.patient-report-results {
    padding:24px;
}

.patient-report-results table {
    width:100%;
    border-collapse:collapse;
}

.patient-report-results th,
.patient-report-results td {
    padding:10px;
    border:1px solid #dbe4ef;
}

.patient-report-results th {
    background:#eef5ff;
    font-size:11px;
    text-transform:uppercase;
}

.patient-report-results td small {
    display:block;
    margin-top:3px;
    color:#64748b;
}

.patient-print-report footer {
    display:flex;
    justify-content:space-between;
    gap:18px;
    padding:14px 24px;
    background:#172033;
    color:#fff;
    font-size:11px;
}

.module-toolbar {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:18px;
    margin-bottom:22px;
    padding:22px;
    border:1px solid var(--hmz-border);
    border-radius:var(--hmz-radius);
    background:#fff;
    box-shadow:var(--hmz-shadow);
}

.module-heading {
    display:flex;
    align-items:center;
    gap:14px;
}

.module-heading h2 {
    margin:0;
    font-size:22px;
    font-weight:800;
}

.module-heading p {
    margin:5px 0 0;
    color:var(--hmz-muted);
}

.module-icon {
    width:52px;
    height:52px;
    display:grid;
    place-items:center;
    border-radius:16px;
    color:#fff;
    background:linear-gradient(135deg,#2563eb,#06b6d4);
    font-size:22px;
}

.filter-panel {
    padding:20px;
    border-bottom:1px solid var(--hmz-border);
    background:#fbfdff;
}

.form-action-bar {
    display:flex;
    justify-content:flex-end;
    margin-top:20px;
    padding:16px;
    border:1px solid var(--hmz-border);
    border-radius:15px;
    background:#fff;
}

@media(max-width:900px) {
    .patient-auth-shell {
        grid-template-columns:1fr;
    }

    .patient-auth-brand {
        min-height:340px;
    }

    .patient-summary-grid,
    .patient-report-demographics {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .patient-report-card {
        grid-template-columns:auto 1fr;
    }

    .patient-report-status,
    .patient-report-card>.btn {
        grid-column:2;
        align-items:flex-start;
    }
}

@media(max-width:600px) {
    .patient-topbar,
    .patient-section-head,
    .patient-page-head,
    .patient-print-report>header,
    .patient-print-report footer,
    .module-toolbar {
        align-items:stretch;
        flex-direction:column;
    }

    .patient-topbar nav {
        flex-wrap:wrap;
    }

    .patient-summary-grid,
    .patient-report-demographics {
        grid-template-columns:1fr;
    }

    .patient-welcome-card {
        align-items:flex-start;
        flex-direction:column;
    }

    .patient-report-card {
        grid-template-columns:1fr;
    }

    .patient-report-status,
    .patient-report-card>.btn {
        grid-column:auto;
        align-items:flex-start;
    }
}

@media print {
    @page {
        size:A4;
        margin:10mm;
    }

    .no-print {
        display:none !important;
    }

    body {
        background:#fff !important;
    }

    .patient-report-view {
        width:100%;
        margin:0;
    }

    .patient-print-report {
        border:0;
    }
}
