body { background: #f5f7fb; }
.card { border: 0; border-radius: 16px; }
.card-header { border-radius: 16px 16px 0 0 !important; }
.stat-card { min-height: 125px; }
.stat-value { font-size: 2rem; font-weight: 800; }
.table thead th { background: #eef4ff; white-space: nowrap; }
.badge-soft-danger { background:#ffe7e7; color:#b00020; }
.badge-soft-warning { background:#fff4d9; color:#8a5a00; }
.badge-soft-success { background:#e6f7ed; color:#136d38; }
.scanner-video { width: 100%; max-width: 520px; min-height: 240px; background:#111; border-radius: 14px; }
.print-only { display:none; }
@media print {
    nav, .no-print, .btn, form { display:none !important; }
    body { background:white; }
    .card { box-shadow:none !important; border:1px solid #ddd; }
    .print-only { display:block; }
}

/* =========================================================
Dashboard
========================================================= */
:root {
    --medisync-primary: #2563eb;
    --medisync-primary-dark: #1d4ed8;
    --medisync-text: #1e293b;
    --medisync-muted: #64748b;
    --medisync-border: #e2e8f0;
    --medisync-background: #f8fafc;
    --medisync-success: #16a34a;
    --medisync-warning: #d97706;
    --medisync-danger: #dc2626;
}

body {
    background: var(--medisync-background);
    color: var(--medisync-text);
}

.dashboard-page {
    padding-bottom: 30px;
}

.dashboard-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.dashboard-header h1 {
    margin: 0 0 4px;
    font-size: 28px;
    font-weight: 700;
    letter-spacing: -0.4px;
}

.dashboard-header p {
    margin: 0;
    color: var(--medisync-muted);
    font-size: 14px;
}

.dashboard-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.dashboard-actions .btn {
    min-height: 40px;
    padding: 8px 15px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
}

.summary-card {
    position: relative;
    height: 100%;
    min-height: 145px;
    padding: 20px;
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--medisync-border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.summary-card::before {
    position: absolute;
    top: 0;
    right: 0;
    left: 0;
    height: 3px;
    content: "";
}

.summary-blue::before {
    background: var(--medisync-primary);
}

.summary-red::before {
    background: var(--medisync-danger);
}

.summary-yellow::before {
    background: #f59e0b;
}

.summary-green::before {
    background: var(--medisync-success);
}

.summary-purple::before {
    background: #7c3aed;
}

.summary-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.summary-label {
    color: var(--medisync-muted);
    font-size: 13px;
    font-weight: 600;
}

.summary-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    place-items: center;
    border-radius: 9px;
    font-size: 17px;
}

.summary-blue .summary-icon {
    color: var(--medisync-primary);
    background: #eff6ff;
}

.summary-red .summary-icon {
    color: var(--medisync-danger);
    background: #fef2f2;
}

.summary-yellow .summary-icon {
    color: var(--medisync-warning);
    background: #fffbeb;
}

.summary-green .summary-icon {
    color: var(--medisync-success);
    background: #f0fdf4;
}

.summary-purple .summary-icon {
    color: #7c3aed;
    background: #f5f3ff;
}

.summary-value {
    margin-top: 13px;
    color: var(--medisync-text);
    font-size: 28px;
    font-weight: 700;
    line-height: 1.2;
}

.summary-value.money-value {
    font-size: 24px;
}

.summary-description {
    margin-top: 5px;
    color: #94a3b8;
    font-size: 12px;
}

.dashboard-panel {
    overflow: hidden;
    background: #fff;
    border: 1px solid var(--medisync-border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.dashboard-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 17px 20px;
    border-bottom: 1px solid var(--medisync-border);
}

.dashboard-panel-header h2 {
    margin: 0 0 3px;
    font-size: 16px;
    font-weight: 700;
}

.dashboard-panel-header p {
    margin: 0;
    color: var(--medisync-muted);
    font-size: 12px;
}

.dashboard-panel-body {
    padding: 20px;
}

.panel-link {
    color: var(--medisync-primary);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}

.panel-link:hover {
    color: var(--medisync-primary-dark);
}

.quick-actions {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.quick-action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px;
    color: var(--medisync-text);
    background: #fff;
    border: 1px solid var(--medisync-border);
    border-radius: 10px;
    text-decoration: none;
    transition: 0.15s ease;
}

.quick-action:hover {
    color: var(--medisync-primary);
    border-color: #bfdbfe;
    box-shadow: 0 3px 10px rgba(37, 99, 235, 0.08);
    transform: translateY(-1px);
}

.quick-action-icon {
    display: grid;
    width: 38px;
    height: 38px;
    flex-shrink: 0;
    place-items: center;
    color: var(--medisync-primary);
    background: #eff6ff;
    border-radius: 8px;
}

.quick-action strong {
    display: block;
    font-size: 13px;
}

.quick-action span {
    display: block;
    margin-top: 2px;
    color: var(--medisync-muted);
    font-size: 11px;
}

.scanner-input .form-control,
.scanner-input .input-group-text,
.scanner-input .btn {
    min-height: 42px;
}

.scanner-input .form-control {
    font-size: 13px;
}

.scanner-input .form-control:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.scanner-area {
    position: relative;
    display: none;
    min-height: 220px;
    margin-top: 14px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #0f172a;
    border-radius: 10px;
}

.scanner-area.active {
    display: flex;
}

.scanner-video {
    width: 100%;
    min-height: 220px;
    max-height: 280px;
    object-fit: cover;
    background: #0f172a;
}

.scanner-status {
    min-height: 18px;
    margin-top: 10px;
    color: var(--medisync-muted);
    font-size: 12px;
}

.scanner-controls {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px;
}

.scanner-controls .btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-height: 39px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 600;
}

.clean-table {
    width: 100%;
    margin: 0;
    font-size: 13px;
}

.clean-table thead th {
    padding: 12px 20px;
    color: var(--medisync-muted);
    background: #f8fafc;
    border-bottom: 1px solid var(--medisync-border);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    white-space: nowrap;
}

.clean-table tbody td {
    padding: 14px 20px;
    color: #475569;
    border-bottom: 1px solid #edf2f7;
    vertical-align: middle;
}

.clean-table tbody tr:last-child td {
    border-bottom: 0;
}

.clean-table tbody tr:hover {
    background: #fafcff;
}

.medicine-name {
    color: var(--medisync-text);
    font-weight: 600;
}

.medicine-subtext {
    display: block;
    margin-top: 2px;
    color: #94a3b8;
    font-size: 11px;
}

.status-badge {
    display: inline-flex;
    align-items: center;
    padding: 5px 9px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
}

.status-danger {
    color: #b91c1c;
    background: #fef2f2;
}

.status-warning {
    color: #a16207;
    background: #fffbeb;
}

.status-success {
    color: #15803d;
    background: #f0fdf4;
}

.empty-state {
    display: flex;
    min-height: 85px;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--medisync-muted);
    font-size: 13px;
}

.empty-state i {
    color: var(--medisync-success);
    font-size: 18px;
}

.today-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.today-summary-item {
    padding: 15px;
    background: #f8fafc;
    border: 1px solid var(--medisync-border);
    border-radius: 9px;
}

.today-summary-item span {
    display: block;
    color: var(--medisync-muted);
    font-size: 11px;
    font-weight: 600;
    text-transform: uppercase;
}

.today-summary-item strong {
    display: block;
    margin-top: 5px;
    color: var(--medisync-text);
    font-size: 20px;
}

.dashboard-page .btn {
    border-radius: 8px;
}

.dashboard-page .btn-primary {
    background: var(--medisync-primary);
    border-color: var(--medisync-primary);
}

.dashboard-page .btn-primary:hover {
    background: var(--medisync-primary-dark);
    border-color: var(--medisync-primary-dark);
}

@media (max-width: 991.98px) {
    .quick-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767.98px) {
    .dashboard-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .dashboard-actions {
        width: 100%;
    }

    .dashboard-actions .btn {
        flex: 1;
    }

    .quick-actions,
    .today-summary {
        grid-template-columns: 1fr;
    }

    .dashboard-panel-header {
        align-items: flex-start;
    }

    .clean-table thead th,
    .clean-table tbody td {
        padding-right: 14px;
        padding-left: 14px;
    }
}

/* =========================================================
Reports
========================================================= */
:root {
    --report-primary: #1d4ed8;
    --report-primary-dark: #1e40af;
    --report-primary-light: #eff6ff;
    --report-text: #1e293b;
    --report-muted: #64748b;
    --report-border: #dbe3ee;
    --report-background: #f8fafc;
    --report-success: #15803d;
    --report-warning: #b45309;
    --report-danger: #b91c1c;
}

body {
    background: var(--report-background);
}

.report-page {
    width: 100%;
    padding-bottom: 30px;
}

.report-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
}

.report-toolbar h1 {
    margin: 0 0 4px;
    color: var(--report-text);
    font-size: 29px;
    font-weight: 700;
    letter-spacing: -0.4px;
}

.report-toolbar p {
    margin: 0;
    color: var(--report-muted);
    font-size: 14px;
}

.report-toolbar-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.report-toolbar-actions .btn {
    min-height: 41px;
    padding: 8px 15px;
    border-radius: 8px;
    font-size: 13px;
    font-weight: 600;
}

.report-print-select {
    width: auto;
    min-width: 245px;
    min-height: 41px;
    border-radius: 8px;
    font-size: 13px;
}

.report-filter-card {
    margin-bottom: 20px;
    padding: 20px;
    background: #ffffff;
    border: 1px solid var(--report-border);
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.report-filter-title {
    margin-bottom: 16px;
}

.report-filter-title h2 {
    margin: 0 0 3px;
    color: var(--report-text);
    font-size: 16px;
    font-weight: 700;
}

.report-filter-title p {
    margin: 0;
    color: var(--report-muted);
    font-size: 12px;
}

.report-filter-card .form-label {
    margin-bottom: 6px;
    color: #334155;
    font-size: 12px;
    font-weight: 700;
}

.report-filter-card .form-control,
.report-filter-card .form-select,
.report-filter-card .btn {
    min-height: 42px;
    border-radius: 8px;
    font-size: 13px;
}

.report-filter-card .form-control:focus,
.report-filter-card .form-select:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.1);
}

.report-document {
    overflow: hidden;
    background: #ffffff;
    border: 1px solid var(--report-border);
    border-radius: 12px;
    box-shadow: 0 4px 16px rgba(15, 23, 42, 0.06);
}

.report-letterhead {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 28px 32px;
    border-bottom: 2px solid var(--report-primary);
}

.report-brand {
    display: flex;
    align-items: center;
    gap: 14px;
}

.report-logo {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    color: #ffffff;
    background: var(--report-primary);
    border-radius: 12px;
    font-size: 24px;
    font-weight: 700;
}

.report-brand h2 {
    margin: 0 0 3px;
    color: var(--report-primary);
    font-size: 24px;
    font-weight: 700;
}

.report-brand p {
    margin: 0;
    color: var(--report-muted);
    font-size: 12px;
}

.report-document-info {
    text-align: right;
}

.report-document-info h3 {
    margin: 0 0 7px;
    color: var(--report-text);
    font-size: 18px;
    font-weight: 700;
    text-transform: uppercase;
}

.report-document-info div {
    margin-top: 3px;
    color: var(--report-muted);
    font-size: 12px;
}

.report-document-info strong {
    color: var(--report-text);
}

.report-body {
    padding: 28px 32px 34px;
}

.report-period-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 20px;
    padding: 14px 17px;
    background: var(--report-primary-light);
    border: 1px solid #bfdbfe;
    border-radius: 8px;
}

.report-period-banner span {
    display: block;
    color: var(--report-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.report-period-banner strong {
    display: block;
    margin-top: 3px;
    color: var(--report-primary-dark);
    font-size: 15px;
}

.report-introduction {
    margin-bottom: 24px;
    padding: 15px 17px;
    color: #475569;
    background: #f8fafc;
    border-left: 4px solid var(--report-primary);
    border-radius: 0 8px 8px 0;
    font-size: 13px;
    line-height: 1.6;
}

.report-summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 28px;
}

.report-summary-card {
    padding: 17px;
    background: #ffffff;
    border: 1px solid var(--report-border);
    border-radius: 9px;
}

.report-summary-card span {
    display: block;
    color: var(--report-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

.report-summary-card strong {
    display: block;
    margin-top: 8px;
    color: var(--report-text);
    font-size: 23px;
    font-weight: 700;
}

.report-summary-card small {
    display: block;
    margin-top: 4px;
    color: #94a3b8;
    font-size: 11px;
}

.report-section {
    margin-top: 30px;
}

.report-section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 12px;
    padding-bottom: 9px;
    border-bottom: 1px solid var(--report-border);
}

.report-section-heading h3 {
    margin: 0;
    color: var(--report-text);
    font-size: 17px;
    font-weight: 700;
}

.report-section-heading p {
    margin: 3px 0 0;
    color: var(--report-muted);
    font-size: 12px;
}

.report-section-number {
    color: var(--report-primary);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap;
}

.formal-report-table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    font-size: 11px;
}

.formal-report-table thead th {
    padding: 10px 9px;
    color: #334155;
    background: #eef3f8;
    border: 1px solid #cfd8e3;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.03em;
    text-transform: uppercase;
    vertical-align: middle;
}

.formal-report-table tbody td {
    padding: 9px;
    color: #475569;
    border: 1px solid #dbe3ee;
    vertical-align: middle;
}

.formal-report-table tbody tr:nth-child(even) {
    background: #fafcff;
}

.formal-report-table tfoot th {
    padding: 10px 9px;
    color: var(--report-text);
    background: #eef3f8;
    border: 1px solid #cfd8e3;
    font-size: 10px;
    font-weight: 700;
}

.medicine-cell {
    color: var(--report-text) !important;
    font-weight: 600;
}

.number-cell {
    text-align: right;
    white-space: nowrap;
}

.center-cell {
    text-align: center;
}

.report-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 68px;
    padding: 4px 7px;
    border-radius: 5px;
    font-size: 10px;
    font-weight: 700;
}

.report-badge-normal {
    color: var(--report-success);
    background: #f0fdf4;
}

.report-badge-low,
.report-badge-expired {
    color: var(--report-danger);
    background: #fef2f2;
}

.report-badge-warning {
    color: var(--report-warning);
    background: #fffbeb;
}

.empty-report-row {
    padding: 28px !important;
    color: var(--report-muted) !important;
    text-align: center;
}

.report-financial-summary {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin-top: 18px;
}

.financial-summary-item {
    padding: 16px;
    background: #f8fafc;
    border: 1px solid var(--report-border);
    border-radius: 8px;
}

.financial-summary-item span {
    display: block;
    color: var(--report-muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
}

.financial-summary-item strong {
    display: block;
    margin-top: 6px;
    color: var(--report-text);
    font-size: 20px;
}

.report-certification {
    margin-top: 40px;
    padding-top: 22px;
    border-top: 1px solid var(--report-border);
}

.report-certification p {
    margin: 0 0 35px;
    color: #475569;
    font-size: 12px;
    line-height: 1.6;
}

.signature-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 70px;
    max-width: 720px;
    margin: 0 auto;
}

.signature-box {
    padding-top: 35px;
    text-align: center;
}

.signature-line {
    border-top: 1px solid #334155;
}

.signature-box strong {
    display: block;
    margin-top: 6px;
    color: var(--report-text);
    font-size: 12px;
    text-transform: uppercase;
}

.signature-box span {
    display: block;
    margin-top: 2px;
    color: var(--report-muted);
    font-size: 11px;
}

.report-footer-note {
    margin-top: 35px;
    padding-top: 15px;
    color: #94a3b8;
    border-top: 1px solid var(--report-border);
    font-size: 10px;
    text-align: center;
}

@media (max-width: 991.98px) {
    .report-summary-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .report-financial-summary {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 767.98px) {
    .report-toolbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .report-toolbar-actions {
        width: 100%;
    }

    .report-toolbar-actions .btn {
        flex: 1;
    }

    .report-letterhead {
        align-items: flex-start;
        flex-direction: column;
        padding: 22px;
    }

    .report-document-info {
        text-align: left;
    }

    .report-body {
        padding: 22px;
    }

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

    .signature-grid {
        grid-template-columns: 1fr;
        gap: 30px;
    }
}

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

    body {
        background: #ffffff !important;
        color: #000000;
        font-size: 10pt;
    }

    .navbar,
    .app-sidebar,
    .app-topbar,
    .no-print,
    .report-toolbar,
    .report-filter-card {
        display: none !important;
    }

    body {
        padding-left: 0 !important;
    }

    .app-main,
    main,
    main.container,
    main.container-fluid,
    .app-content {
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 !important;
    }

    .report-page {
        padding: 0;
    }

    .report-document {
        overflow: visible;
        border: 0;
        border-radius: 0;
        box-shadow: none;
    }

    .report-letterhead {
        padding: 0 0 15px;
    }

    .report-body {
        padding: 18px 0 0;
    }

    .report-summary-grid {
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
    }

    .report-summary-card {
        padding: 10px;
        border-radius: 0;
    }

    .report-summary-card strong {
        font-size: 16px;
    }

    .report-section-heading {
        page-break-after: avoid;
    }

    .formal-report-table {
        font-size: 8px;
    }

    .formal-report-table thead {
        display: table-header-group;
    }

    .formal-report-table tr {
        page-break-inside: avoid;
    }

    .formal-report-table thead th,
    .formal-report-table tbody td,
    .formal-report-table tfoot th {
        padding: 5px;
    }

    .report-financial-summary {
        grid-template-columns: repeat(3, 1fr);
        gap: 8px;
    }

    .financial-summary-item {
        padding: 10px;
        border-radius: 0;
    }

    .financial-summary-item strong {
        font-size: 15px;
    }

    .report-certification {
        page-break-inside: avoid;
    }

    body.printing-selected-report .report-introduction,
    body.printing-selected-report .report-summary-grid,
    body.printing-selected-report .unselected-report-section {
        display: none !important;
    }

    body.printing-selected-report .selected-report-section {
        display: block !important;
        margin-top: 0;
    }
}


/* =========================================================
Login
========================================================= */
.login-body {
    --login-primary: #2563eb;
    --login-primary-dark: #1d4ed8;
    --login-text: #172033;
    --login-muted: #64748b;
    --login-border: #dce5f0;
    min-height: 100vh;
    margin: 0;
    color: var(--login-text);
    background:
        radial-gradient(circle at top left, rgba(37, 99, 235, 0.13), transparent 34%),
        radial-gradient(circle at bottom right, rgba(14, 165, 233, 0.10), transparent 32%),
        #f4f7fb;
    font-family: Arial, Helvetica, sans-serif;
}

.login-shell {
    display: grid;
    min-height: 100vh;
    place-items: center;
    padding: 32px 20px;
}

.login-card {
    width: min(100%, 450px);
    padding: 38px;
    overflow: hidden;
    background: rgba(255, 255, 255, 0.96);
    border: 1px solid rgba(220, 229, 240, 0.92);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, 0.13);
    backdrop-filter: blur(10px);
}

.login-brand {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-bottom: 34px;
}

.login-brand-icon {
    display: grid;
    width: 50px;
    height: 50px;
    flex: 0 0 50px;
    place-items: center;
    color: #ffffff;
    background: linear-gradient(135deg, #2563eb, #0ea5e9);
    border-radius: 15px;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.25);
    font-size: 24px;
}

.login-brand-name {
    color: #0f172a;
    font-size: 23px;
    font-weight: 800;
    letter-spacing: -0.4px;
    line-height: 1.1;
}

.login-brand-subtitle {
    margin-top: 4px;
    color: var(--login-muted);
    font-size: 12px;
}

.login-heading {
    margin-bottom: 25px;
}

.login-eyebrow {
    display: inline-block;
    margin-bottom: 8px;
    color: var(--login-primary);
    font-size: 11px;
    font-weight: 800;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

.login-heading h1 {
    margin: 0 0 8px;
    color: #0f172a;
    font-size: 30px;
    font-weight: 800;
    letter-spacing: -0.7px;
}

.login-heading p {
    margin: 0;
    color: var(--login-muted);
    font-size: 14px;
    line-height: 1.55;
}

.login-alert {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-bottom: 20px;
    padding: 12px 14px;
    color: #b91c1c;
    background: #fef2f2;
    border: 1px solid #fecaca;
    border-radius: 10px;
    font-size: 13px;
    line-height: 1.45;
}

.login-form .form-group {
    margin-bottom: 18px;
}

.login-form .form-label {
    margin-bottom: 7px;
    color: #334155;
    font-size: 13px;
    font-weight: 700;
}

.login-form .input-wrapper {
    position: relative;
}

.login-form .input-icon {
    position: absolute;
    top: 50%;
    left: 15px;
    z-index: 2;
    color: #94a3b8;
    font-size: 16px;
    transform: translateY(-50%);
}

.login-form .form-control {
    min-height: 52px;
    padding: 12px 46px 12px 43px;
    color: var(--login-text);
    background: #ffffff;
    border: 1px solid var(--login-border);
    border-radius: 11px;
    font-size: 14px;
}

.login-form .form-control::placeholder {
    color: #a0aec0;
}

.login-form .form-control:focus {
    border-color: #93c5fd;
    box-shadow: 0 0 0 4px rgba(37, 99, 235, 0.10);
}

.password-toggle {
    position: absolute;
    top: 50%;
    right: 12px;
    z-index: 3;
    display: grid;
    width: 34px;
    height: 34px;
    padding: 0;
    place-items: center;
    color: #94a3b8;
    background: transparent;
    border: 0;
    border-radius: 8px;
    transform: translateY(-50%);
}

.password-toggle:hover,
.password-toggle:focus {
    color: var(--login-primary);
    background: #eff6ff;
}

.remember-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: -2px 0 20px;
}

.remember-row .form-check-label {
    color: var(--login-muted);
    font-size: 12px;
}

.authorized-label {
    color: #94a3b8;
    font-size: 11px;
    white-space: nowrap;
}

.authorized-label i {
    color: #16a34a;
}

.login-button {
    display: flex;
    width: 100%;
    min-height: 52px;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: 0;
    border-radius: 11px;
    background: linear-gradient(135deg, #2563eb, #1d4ed8);
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.22);
    font-size: 14px;
    font-weight: 700;
}

.login-button:hover,
.login-button:focus {
    background: linear-gradient(135deg, #1d4ed8, #1e40af);
    transform: translateY(-1px);
}

.login-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin-top: 27px;
    padding-top: 20px;
    color: #94a3b8;
    border-top: 1px solid #edf2f7;
    font-size: 11px;
}

@media (max-width: 575.98px) {
    .login-shell {
        align-items: center;
        padding: 18px 14px;
    }

    .login-card {
        padding: 28px 22px;
        border-radius: 18px;
    }

    .login-brand {
        margin-bottom: 28px;
    }

    .login-heading h1 {
        font-size: 27px;
    }

    .remember-row {
        align-items: flex-start;
        flex-direction: column;
        gap: 8px;
    }

    .authorized-label {
        padding-left: 24px;
    }

    .login-footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }
}

@media (max-width: 360px) {
    .login-card {
        padding: 24px 18px;
    }

    .login-brand-subtitle {
        font-size: 11px;
    }
}

/* Professional application enhancements */
html[data-theme="dark"] { color-scheme: dark; }
body { min-height: 100vh; transition: background .2s ease, color .2s ease; }
.navbar { background: linear-gradient(135deg, #1d4ed8, #4338ca) !important; }
.navbar .nav-link { border-radius: .55rem; padding-inline: .7rem !important; }
.navbar .nav-link.active, .navbar .nav-link:hover { background: rgba(255,255,255,.14); }
.card, .dashboard-panel, .summary-card { transition: transform .18s ease, box-shadow .18s ease; }
.card:hover, .dashboard-panel:hover { box-shadow: 0 12px 30px rgba(15,23,42,.08) !important; }
.table-tools { display:flex; gap:.6rem; flex-wrap:wrap; align-items:center; justify-content:space-between; margin-bottom:1rem; }
.table-tools .form-control { max-width: 360px; }
.chart-wrap { position: relative; min-height: 310px; }
.alert-strip { border-left: 4px solid var(--medisync-danger); }
.metric-trend { font-size:.78rem; color:var(--medisync-muted); }
.activity-details { max-width: 520px; white-space: normal; }
html[data-theme="dark"] body { background:#0f172a; color:#e2e8f0; }
html[data-theme="dark"] .card, html[data-theme="dark"] .dashboard-panel, html[data-theme="dark"] .summary-card,
html[data-theme="dark"] .quick-action, html[data-theme="dark"] .form-control, html[data-theme="dark"] .form-select,
html[data-theme="dark"] .input-group-text, html[data-theme="dark"] .modal-content { background:#172033; color:#e2e8f0; border-color:#334155; }
html[data-theme="dark"] .text-muted, html[data-theme="dark"] .summary-label, html[data-theme="dark"] .summary-description { color:#94a3b8 !important; }
html[data-theme="dark"] .table { --bs-table-bg:transparent; --bs-table-color:#e2e8f0; --bs-table-border-color:#334155; }
html[data-theme="dark"] .table thead th { background:#1e293b; color:#e2e8f0; }
html[data-theme="dark"] .bg-white { background:#172033 !important; color:#e2e8f0; }
@media (max-width: 991.98px) { .dashboard-header { align-items:flex-start; flex-direction:column; } .quick-actions { grid-template-columns:repeat(2,1fr); } }
@media (max-width: 575.98px) { main.container-fluid { padding-inline:.75rem; } .quick-actions { grid-template-columns:1fr; } .table-tools { align-items:stretch; flex-direction:column; } .table-tools .form-control { max-width:none; } .dashboard-actions { width:100%; } .dashboard-actions .btn { flex:1; } }

/* =========================================================
   Professional left sidebar layout
   ========================================================= */
:root {
    --sidebar-width: 270px;
    --sidebar-bg: #0f172a;
    --sidebar-surface: #172033;
    --sidebar-text: #cbd5e1;
    --sidebar-muted: #64748b;
    --sidebar-active: #2563eb;
    --topbar-height: 72px;
}

.app-shell {
    min-height: 100vh;
}

.app-sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 1040;
    display: flex;
    width: var(--sidebar-width);
    min-height: 100vh;
    flex-direction: column;
    overflow-y: auto;
    color: var(--sidebar-text);
    background: linear-gradient(180deg, var(--sidebar-bg), #111827);
    box-shadow: 8px 0 28px rgba(15, 23, 42, .14);
    transition: transform .25s ease;
}

.sidebar-brand {
    display: flex;
    min-height: var(--topbar-height);
    align-items: center;
    justify-content: space-between;
    padding: 0 20px;
    border-bottom: 1px solid rgba(255, 255, 255, .08);
}

.sidebar-brand-link {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #fff;
    font-size: 21px;
    font-weight: 800;
    text-decoration: none;
    letter-spacing: -.3px;
}

.sidebar-brand-icon {
    display: grid;
    width: 40px;
    height: 40px;
    place-items: center;
    border-radius: 11px;
    background: linear-gradient(135deg, #3b82f6, #6366f1);
    box-shadow: 0 8px 18px rgba(37, 99, 235, .28);
}

.sidebar-close,
.topbar-menu-button {
    display: grid;
    border: 0;
    place-items: center;
}

.sidebar-close {
    width: 36px;
    height: 36px;
    color: #fff;
    background: transparent;
    border-radius: 8px;
}

.sidebar-user {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 18px 16px 8px;
    padding: 14px;
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .07);
    border-radius: 12px;
}

.sidebar-user-avatar {
    display: grid;
    width: 42px;
    height: 42px;
    flex: 0 0 auto;
    color: #fff;
    background: linear-gradient(135deg, #2563eb, #7c3aed);
    border-radius: 50%;
    place-items: center;
    font-weight: 800;
}

.sidebar-user-details {
    min-width: 0;
}

.sidebar-user-details strong,
.sidebar-user-details span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.sidebar-user-details strong {
    color: #f8fafc;
    font-size: 13px;
}

.sidebar-user-details span {
    margin-top: 2px;
    color: #94a3b8;
    font-size: 11px;
}

.sidebar-nav {
    flex: 1;
    padding: 12px 14px 20px;
}

.sidebar-nav-label {
    margin: 12px 10px 8px;
    color: var(--sidebar-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.1px;
    text-transform: uppercase;
}

.sidebar-link {
    position: relative;
    display: flex;
    min-height: 44px;
    align-items: center;
    gap: 13px;
    margin-bottom: 4px;
    padding: 10px 13px;
    color: var(--sidebar-text);
    border: 0;
    border-radius: 10px;
    text-decoration: none;
    transition: background .18s ease, color .18s ease, transform .18s ease;
}

.sidebar-link i {
    width: 22px;
    flex: 0 0 auto;
    font-size: 17px;
    text-align: center;
}

.sidebar-link span {
    font-size: 13px;
    font-weight: 600;
}

.sidebar-link:hover {
    color: #fff;
    background: rgba(255, 255, 255, .075);
    transform: translateX(2px);
}

.sidebar-link.active {
    color: #fff;
    background: linear-gradient(135deg, var(--sidebar-active), #4f46e5);
    box-shadow: 0 8px 20px rgba(37, 99, 235, .24);
}

.sidebar-link.active::before {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: -14px;
    width: 3px;
    content: "";
    background: #60a5fa;
    border-radius: 0 4px 4px 0;
}

.sidebar-footer {
    padding: 14px;
    border-top: 1px solid rgba(255, 255, 255, .08);
}

.sidebar-button {
    width: 100%;
    background: transparent;
    text-align: left;
}

.sidebar-logout {
    color: #fecaca;
}

.sidebar-logout:hover {
    color: #fff;
    background: rgba(220, 38, 38, .18);
}

.app-content {
    min-height: 100vh;
    margin-left: var(--sidebar-width);
    transition: margin-left .25s ease;
}

.app-content-full {
    margin-left: 0;
}

.app-topbar {
    position: sticky;
    top: 0;
    z-index: 1020;
    display: flex;
    min-height: var(--topbar-height);
    align-items: center;
    gap: 14px;
    padding: 0 26px;
    background: rgba(255, 255, 255, .92);
    border-bottom: 1px solid var(--medisync-border);
    backdrop-filter: blur(12px);
}

.topbar-title {
    display: flex;
    min-width: 0;
    flex: 1;
    flex-direction: column;
}

.topbar-page-name {
    color: var(--medisync-text);
    font-size: 17px;
    font-weight: 800;
}

.topbar-subtitle {
    color: var(--medisync-muted);
    font-size: 11px;
}

.topbar-user {
    align-items: center;
    gap: 8px;
    color: var(--medisync-muted);
    font-size: 13px;
    font-weight: 600;
}

.topbar-user i {
    color: var(--medisync-primary);
    font-size: 21px;
}

.topbar-menu-button {
    width: 42px;
    height: 42px;
    color: var(--medisync-text);
    background: #fff;
    border: 1px solid var(--medisync-border);
    border-radius: 10px;
    font-size: 22px;
}

.app-main {
    width: 100%;
    max-width: 1800px;
    padding-right: 26px;
    padding-left: 26px;
}

.sidebar-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1035;
    display: none;
    background: rgba(15, 23, 42, .58);
    backdrop-filter: blur(2px);
}

html[data-theme="dark"] .app-topbar {
    background: rgba(15, 23, 42, .9);
    border-color: #334155;
}

html[data-theme="dark"] .topbar-page-name,
html[data-theme="dark"] .topbar-menu-button {
    color: #e2e8f0;
}

html[data-theme="dark"] .topbar-menu-button {
    background: #172033;
    border-color: #334155;
}

@media (max-width: 991.98px) {
    .app-sidebar {
        transform: translateX(-100%);
    }

    body.sidebar-open {
        overflow: hidden;
    }

    body.sidebar-open .app-sidebar {
        transform: translateX(0);
    }

    body.sidebar-open .sidebar-backdrop {
        display: block;
    }

    .app-content {
        margin-left: 0;
    }

    .app-topbar {
        padding-right: 16px;
        padding-left: 16px;
    }

    .app-main {
        padding-right: 16px;
        padding-left: 16px;
    }
}

@media (max-width: 575.98px) {
    :root {
        --sidebar-width: min(86vw, 290px);
    }

    .topbar-subtitle {
        display: none;
    }

    .app-main {
        padding-right: 12px;
        padding-left: 12px;
    }
}

@media print {
    .app-sidebar,
    .app-topbar,
    .sidebar-backdrop {
        display: none !important;
    }

    .app-content {
        margin-left: 0 !important;
    }

    .app-main {
        max-width: none;
        padding: 0 !important;
    }
}


/* Medicines page: responsive add-medicine modal */
.add-medicine-modal {
    overflow: hidden;
    border: 0;
    border-radius: 18px;
    box-shadow: 0 24px 70px rgba(15, 23, 42, .24);
}

.add-medicine-modal .modal-header,
.add-medicine-modal .modal-footer {
    padding: 18px 22px;
    background: var(--medisync-surface, #fff);
    border-color: var(--medisync-border, #e2e8f0);
}

.add-medicine-modal .modal-body {
    padding: 22px;
    background: var(--medisync-bg, #f8fafc);
}

.modal-form-section {
    padding: 20px;
    background: var(--medisync-surface, #fff);
    border: 1px solid var(--medisync-border, #e2e8f0);
    border-radius: 14px;
}

.modal-form-title {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-bottom: 16px;
    color: var(--medisync-text, #0f172a);
    font-size: 15px;
    font-weight: 700;
}

.modal-form-title i {
    color: var(--medisync-primary, #2563eb);
    font-size: 18px;
}

html[data-theme="dark"] .add-medicine-modal .modal-header,
html[data-theme="dark"] .add-medicine-modal .modal-footer,
html[data-theme="dark"] .modal-form-section {
    background: #172033;
    border-color: #334155;
}

html[data-theme="dark"] .add-medicine-modal .modal-body {
    background: #0f172a;
}

html[data-theme="dark"] .modal-form-title {
    color: #e2e8f0;
}

@media (max-width: 575.98px) {
    .add-medicine-modal {
        border-radius: 14px;
    }

    .add-medicine-modal .modal-header,
    .add-medicine-modal .modal-footer,
    .add-medicine-modal .modal-body {
        padding: 16px;
    }

    .modal-form-section {
        padding: 15px;
    }

    .add-medicine-modal .modal-footer {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .add-medicine-modal .modal-footer .btn {
        width: 100%;
    }
}

/* Point-of-sale workspace */
.salesperson-badge { display:inline-flex; align-items:center; gap:.55rem; padding:.65rem .9rem; border:1px solid var(--bs-border-color); border-radius:999px; background:var(--bs-body-bg); font-weight:600; }
.pos-search { width:min(100%, 340px); }
.pos-products { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.8rem; max-height:620px; overflow:auto; padding:.1rem; }
.pos-product-card { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:.8rem; width:100%; min-height:92px; padding:.9rem; border:1px solid var(--bs-border-color); border-radius:1rem; background:var(--bs-body-bg); color:var(--bs-body-color); text-align:left; transition:.18s ease; }
.pos-product-card:hover,.pos-product-card:focus { border-color:var(--bs-primary); box-shadow:0 .45rem 1.2rem rgba(13,110,253,.12); transform:translateY(-1px); }
.pos-product-icon { display:grid; place-items:center; width:42px; height:42px; border-radius:.8rem; background:rgba(13,110,253,.12); color:var(--bs-primary); font-size:1.2rem; }
.pos-product-details { min-width:0; display:flex; flex-direction:column; }
.pos-product-details strong,.pos-product-details small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pos-product-details small,.pos-product-details span { color:var(--bs-secondary-color); font-size:.78rem; }
.pos-product-price { font-weight:800; color:var(--bs-success); }
.pos-cart-card { position:sticky; top:86px; min-height:520px; }
.pos-cart-empty { min-height:280px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:.45rem; color:var(--bs-secondary-color); text-align:center; }
.pos-cart-empty i { font-size:2.8rem; opacity:.55; }
.pos-cart-items { display:flex; flex-direction:column; gap:.8rem; max-height:430px; overflow:auto; }
.pos-cart-row { display:grid; grid-template-columns:minmax(0,1fr) auto auto auto; align-items:center; gap:.7rem; padding:.8rem; border:1px solid var(--bs-border-color); border-radius:.85rem; }
.pos-cart-info { min-width:0; display:flex; flex-direction:column; }
.pos-cart-info strong,.pos-cart-info small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.pos-cart-info small { color:var(--bs-secondary-color); font-size:.75rem; }
.pos-quantity { display:flex; align-items:center; gap:.25rem; }
.pos-quantity input { width:54px; text-align:center; border:1px solid var(--bs-border-color); border-radius:.4rem; padding:.28rem; background:var(--bs-body-bg); color:var(--bs-body-color); }
.pos-line-total { min-width:75px; text-align:right; }
.pos-remove { padding:.25rem; }
.pos-cart-footer { border-top:1px solid var(--bs-border-color); }
.pos-grand-total { font-size:1.45rem; color:var(--bs-success); }
.receipt-header { text-align:center; padding-bottom:1rem; border-bottom:1px dashed #aaa; }
.receipt-header i { font-size:2rem; }
.receipt-header h3 { margin:.35rem 0 .1rem; font-size:1.2rem; }
.receipt-header p,.receipt-thanks { margin:0; color:#666; font-size:.85rem; text-align:center; }
.receipt-meta { display:grid; grid-template-columns:auto 1fr; gap:.35rem .8rem; padding:1rem 0; font-size:.8rem; border-bottom:1px dashed #aaa; }
.receipt-meta strong { text-align:right; }
.receipt-lines { padding:.8rem 0; }
.receipt-line { display:flex; justify-content:space-between; gap:1rem; padding:.4rem 0; font-size:.85rem; }
.receipt-line div { display:flex; flex-direction:column; }
.receipt-line small { color:#666; }
.receipt-total { display:flex; justify-content:space-between; padding:.8rem 0; margin-bottom:.8rem; border-top:2px solid #222; font-size:1.1rem; }
@media (max-width: 767.98px) { .pos-products { grid-template-columns:1fr; max-height:none; } .pos-product-card { min-height:82px; } .pos-cart-card { position:static; min-height:0; } .pos-cart-row { grid-template-columns:minmax(0,1fr) auto; } .pos-quantity { grid-column:1; } .pos-line-total { grid-column:2; grid-row:2; } .pos-remove { grid-column:2; grid-row:1; justify-self:end; } }
@media print {
    /* Receipt-only printing: keep the complete receipt in normal print flow.
       This prevents the modal's screen height/overflow from cutting off
       receipt items in Chrome's print preview. */
    @page {
        size: 80mm auto;
        margin: 3mm;
    }

    html,
    body {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        overflow: visible !important;
    }

    body.printing-receipt * {
        visibility: hidden !important;
    }

    body.printing-receipt #receiptModal,
    body.printing-receipt #receiptModal *,
    body.printing-receipt #printReceipt,
    body.printing-receipt #printReceipt * {
        visibility: visible !important;
    }

    body.printing-receipt #receiptModal {
        position: static !important;
        display: block !important;
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        background: transparent !important;
    }

    body.printing-receipt #receiptModal .modal-dialog,
    body.printing-receipt #receiptModal .modal-content,
    body.printing-receipt #receiptModal .modal-body {
        position: static !important;
        display: block !important;
        width: 100% !important;
        max-width: none !important;
        height: auto !important;
        max-height: none !important;
        min-height: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        overflow: visible !important;
        transform: none !important;
        box-shadow: none !important;
        border: 0 !important;
        background: #ffffff !important;
    }

    body.printing-receipt #printReceipt {
        position: static !important;
        display: block !important;
        box-sizing: border-box !important;
        width: 74mm !important;
        max-width: 74mm !important;
        height: auto !important;
        min-height: 0 !important;
        margin: 0 auto !important;
        padding: 3mm !important;
        overflow: visible !important;
        page-break-inside: auto !important;
        background: #ffffff !important;
        color: #000000 !important;
    }

    body.printing-receipt .receipt-lines,
    body.printing-receipt .receipt-breakdown {
        overflow: visible !important;
        height: auto !important;
        max-height: none !important;
    }

    body.printing-receipt .receipt-line {
        page-break-inside: avoid !important;
        break-inside: avoid !important;
    }

    /* Report printing must remain visible and use normal document flow. */
    body.printing-selected-report,
    body.printing-selected-report * {
        visibility: visible !important;
    }

    body.printing-selected-report .selected-report-section {
        position: static !important;
        width: 100% !important;
        overflow: visible !important;
    }
}


/* POS payment summary */
.pos-summary {
    display: grid;
    gap: .55rem;
    padding: .85rem 0;
    border-top: 1px solid var(--bs-border-color);
}
.pos-summary > div,
.receipt-breakdown > div {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}
.pos-total-row {
    padding-top: .55rem;
    border-top: 1px dashed var(--bs-border-color);
}
.receipt-breakdown {
    display: grid;
    gap: .4rem;
    padding: .8rem 0;
    border-top: 1px dashed #aaa;
    font-size: .85rem;
}
.receipt-breakdown .receipt-total {
    margin: .35rem 0;
}
@media (max-width: 575.98px) {
    .pos-cart-footer .form-select,
    .pos-cart-footer .form-control {
        min-height: 44px;
    }
}


/* Enhanced dashboard and reporting analytics */
.report-analytics { margin-bottom: 1.5rem; }
.report-analytics-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:1rem; }
.report-kpi,.report-analysis-card { background:var(--bs-body-bg); border:1px solid var(--bs-border-color); border-radius:1rem; box-shadow:0 .45rem 1.35rem rgba(15,23,42,.06); }
.report-kpi { padding:1rem 1.1rem; display:flex; flex-direction:column; gap:.25rem; }
.report-kpi span,.report-kpi small,.report-analysis-heading span { color:var(--bs-secondary-color); }
.report-kpi strong { font-size:1.45rem; line-height:1.2; }
.report-analysis-card { overflow:hidden; }
.report-analysis-heading { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 1.1rem; border-bottom:1px solid var(--bs-border-color); }
.report-analysis-heading h2 { margin:0; font-size:1rem; font-weight:750; }
.report-analysis-card .table { --bs-table-bg:transparent; }
.inventory-alert-list { display:flex; flex-direction:column; gap:.7rem; padding:1rem; }
.inventory-alert-list > div { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:.7rem; border:1px solid var(--bs-border-color); border-radius:.75rem; }
.inventory-alert-list span { min-width:0; display:flex; flex-direction:column; }
.inventory-alert-list strong,.inventory-alert-list small { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.inventory-alert-list small { color:var(--bs-secondary-color); font-size:.75rem; }
.inventory-alert-list b { white-space:nowrap; font-size:.82rem; }
@media (max-width:1199.98px){ .report-analytics-grid{grid-template-columns:repeat(3,minmax(0,1fr));} }
@media (max-width:767.98px){ .report-analytics-grid{grid-template-columns:repeat(2,minmax(0,1fr));} .report-toolbar-actions{width:100%;} .report-toolbar-actions>*{flex:1 1 100%;} }
@media (max-width:479.98px){ .report-analytics-grid{grid-template-columns:1fr;} }
@media print { .report-analytics.no-print { display:none!important; } }


/* Activity Logs: make newly received activity easy to locate. */
.activity-new-banner {
    display: flex;
    align-items: center;
    gap: .75rem;
    padding: .85rem 1rem;
    border: 1px solid rgba(13, 110, 253, .25);
    border-radius: .75rem;
    background: rgba(13, 110, 253, .06);
}
.activity-new-dot {
    width: 10px;
    height: 10px;
    min-width: 10px;
    border-radius: 50%;
    background: #0d6efd;
    box-shadow: 0 0 0 5px rgba(13, 110, 253, .12);
    animation: activityNewPulse 1.8s ease-in-out infinite;
}
.activity-new-row {
    position: relative;
    animation: activityNewHighlight 1.8s ease-in-out 1;
}
.activity-new-row td {
    background: rgba(13, 110, 253, .075) !important;
}
.activity-new-row td:first-child {
    border-left: 4px solid #0d6efd;
    padding-left: calc(var(--bs-table-cell-padding-x, .5rem) - 4px);
}
.activity-new-badge {
    display: inline-flex;
    align-items: center;
    gap: .3rem;
    margin-left: .45rem;
    padding: .18rem .45rem;
    border-radius: 999px;
    font-size: .68rem;
    font-weight: 700;
    letter-spacing: .03em;
    vertical-align: middle;
    background: #0d6efd;
    color: #fff;
}
.activity-new-badge-dot {
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: #fff;
    animation: activityNewPulse 1.2s ease-in-out infinite;
}
@keyframes activityNewPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: .45; transform: scale(.82); }
}
@keyframes activityNewHighlight {
    0% { box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, .13); }
    100% { box-shadow: inset 0 0 0 9999px rgba(13, 110, 253, 0); }
}


/* Clean Complete Sale confirmation */
.sale-confirm-modal {
    border: 0;
    border-radius: 18px;
    overflow: hidden;
}
.sale-confirm-icon {
    width: 54px;
    height: 54px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(25, 135, 84, .10);
    color: #198754;
    font-size: 1.45rem;
}
.sale-confirm-total {
    font-size: 1.75rem;
    line-height: 1.2;
    font-weight: 800;
    color: #198754;
    margin-bottom: .8rem;
}
.sale-confirm-summary {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: .75rem 1rem;
    padding: .7rem .8rem;
    border-radius: 10px;
    background: rgba(0, 0, 0, .035);
    color: #6c757d;
    font-size: .85rem;
}
.sale-confirm-summary i {
    color: #198754;
}
#confirmCompleteSale {
    font-weight: 600;
}


@media print {
    body.printing-receipt .receipt-header {
        padding-bottom: 3mm !important;
    }
    body.printing-receipt .receipt-header i {
        font-size: 20pt !important;
    }
    body.printing-receipt .receipt-header h3 {
        font-size: 13pt !important;
        margin: 2mm 0 1mm !important;
    }
    body.printing-receipt .receipt-header p,
    body.printing-receipt .receipt-thanks {
        font-size: 8.5pt !important;
    }
    body.printing-receipt .receipt-meta {
        padding: 3mm 0 !important;
        font-size: 8.5pt !important;
    }
    body.printing-receipt .receipt-lines {
        padding: 2mm 0 !important;
    }
    body.printing-receipt .receipt-line {
        padding: 1.5mm 0 !important;
        font-size: 9pt !important;
    }
    body.printing-receipt .receipt-line small {
        font-size: 7.5pt !important;
    }
    body.printing-receipt .receipt-breakdown {
        padding: 2mm 0 !important;
        font-size: 8.5pt !important;
    }
    body.printing-receipt .receipt-total {
        padding: 2.5mm 0 !important;
        font-size: 11pt !important;
    }
}


/* Fallback receipt printing: never constrain receipt height. */
@media print {
    body.printing-receipt #printReceipt,
    body.printing-receipt #printReceipt .receipt-lines,
    body.printing-receipt #printReceipt .receipt-breakdown {
        height: auto !important;
        min-height: 0 !important;
        max-height: none !important;
        overflow: visible !important;
    }
    body.printing-receipt #printReceipt {
        page-break-inside: auto !important;
        break-inside: auto !important;
    }
}

/* Activity notification badge */
#activityNotificationBadge:not([hidden]) {
    animation: activity-notification-pulse 1.8s ease-in-out infinite;
}
@keyframes activity-notification-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.08); }
}


/* Professional Top Selling Medicines */
.top-medicine-card .dashboard-panel-body{
    padding:20px;
}
.top-med-item{
    display:flex;
    gap:14px;
    padding:14px;
    margin-bottom:12px;
    background:#f8fafc;
    border-radius:16px;
    transition:.2s ease;
}
.top-med-item:hover{
    transform:translateX(4px);
    background:#eff6ff;
}
.top-med-rank{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#eef2ff;
    font-size:22px;
    flex-shrink:0;
}
.top-med-content{
    flex:1;
}
.top-med-content strong{
    font-size:15px;
    color:#0f172a;
}
.top-med-qty{
    font-weight:800;
    color:#2563eb;
}
.top-med-progress{
    height:8px;
    background:#e2e8f0;
    border-radius:99px;
    overflow:hidden;
    margin:9px 0 5px;
}
.top-med-progress span{
    display:block;
    height:100%;
    border-radius:99px;
    background:linear-gradient(90deg,#2563eb,#60a5fa);
}
.top-med-content small{
    color:#64748b;
}
/* Tablet Responsive Fix */

@media (max-width: 1024px) {

    .form-grid,
    .grid-4,
    .row-4 {
        grid-template-columns: repeat(2, 1fr) !important;
        gap: 15px;
    }

}


/* Mobile Responsive Fix */

@media (max-width: 600px) {

    .form-grid,
    .grid-4,
    .row-4 {
        grid-template-columns: 1fr !important;
    }


    input,
    select,
    textarea {
        width: 100% !important;
        box-sizing: border-box;
    }

}
@media(max-width:768px){

    .logout-btn,
    .nav-logout {
        display:flex !important;
        width:100%;
        margin-top:10px;
    }

}
@media(max-width:768px){

.modal-content{
    width:95% !important;
    margin:auto;
}

}


/* =========================================================
   FINAL MODAL RESPONSIVE FIX
   Tablet and Mobile scrolling support
   ========================================================= */

.modal-dialog {
    max-height: calc(100vh - 30px);
    margin: 15px auto;
    display: flex;
    align-items: center;
}

.modal-content {
    max-height: calc(100vh - 30px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.modal-body {
    overflow-y: auto !important;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
}

/* Add Medicine Modal */
.add-medicine-modal {
    overflow: hidden;
}

.add-medicine-modal .modal-body {
    max-height: calc(100vh - 170px);
    overflow-y: auto !important;
}

.add-medicine-modal .modal-footer {
    flex-shrink: 0;
    background: #ffffff;
}

/* Tablet */
@media (max-width:1024px) {

    .modal-dialog {
        width: 95%;
    }

    .add-medicine-modal .modal-body {
        max-height: calc(100vh - 160px);
    }

}

/* Mobile */
@media (max-width:600px) {

    .modal-dialog {
        width: 95%;
        margin: 10px auto;
    }

    .modal-content {
        max-height: calc(100vh - 20px);
    }

    .add-medicine-modal .modal-header,
    .add-medicine-modal .modal-footer {
        padding: 14px;
    }

    .add-medicine-modal .modal-body {
        padding: 15px;
        max-height: calc(100vh - 150px);
        overflow-y: auto !important;
    }

    .add-medicine-modal .modal-footer {
        position: sticky;
        bottom: 0;
        z-index: 20;
    }

}


/* =========================================================
   MediSync InfinityFree Final Responsive Fix
   Modal scrolling for tablet and mobile
   ========================================================= */

.modal {
    overflow-y: auto !important;
}

.modal-dialog {
    max-width: 95%;
    margin: 10px auto;
}

.modal-dialog.modal-xl {
    max-width: 1140px;
}

.modal-content {
    max-height: calc(100vh - 20px);
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.modal-body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
    -webkit-overflow-scrolling: touch;
}


/* Add Medicine modal */
.add-medicine-modal .modal-body {
    max-height: calc(100vh - 220px);
    overflow-y: auto !important;
}


/* Make form controls fit smaller screens */
.modal-body .row {
    margin-left: -8px;
    margin-right: -8px;
}

.modal-body [class*="col-"] {
    padding-left: 8px;
    padding-right: 8px;
}

.modal-body input,
.modal-body select,
.modal-body textarea {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}


/* Tablet */
@media(max-width:1024px){

    .modal-dialog.modal-xl {
        max-width:95%;
    }

    .add-medicine-modal .modal-body {
        max-height: calc(100vh - 190px);
    }

}


/* Phone */
@media(max-width:600px){

    .modal-dialog,
    .modal-dialog.modal-xl {
        width:100%;
        max-width:100%;
        margin:5px auto;
    }

    .modal-content {
        max-height: calc(100vh - 10px);
    }

    .add-medicine-modal .modal-body {
        max-height: calc(100vh - 170px);
        padding:15px;
    }

    .modal-footer {
        flex-wrap:wrap;
    }

    .modal-footer .btn {
        width:100%;
        margin-bottom:5px;
    }

}


/* =========================================================
   Add Medicine UI Repair - No Barcode
   ========================================================= */
#addMedicineModal .modal-dialog {
    width: min(1120px, calc(100vw - 32px));
    max-width: 1120px;
}
#addMedicineModal .modal-content {
    max-height: calc(100vh - 32px);
}
#addMedicineModal .modal-body {
    overflow-y: auto !important;
    overflow-x: hidden !important;
}
#addMedicineModal .modal-form-section {
    width: 100%;
}
#addMedicineModal .form-control,
#addMedicineModal .form-select {
    width: 100%;
    min-width: 0;
}
@media (max-width: 767.98px) {
    #addMedicineModal {
        padding: 0 !important;
    }
    #addMedicineModal .modal-dialog {
        width: calc(100vw - 16px) !important;
        max-width: none !important;
        margin: 8px auto !important;
    }
    #addMedicineModal .modal-content {
        max-height: calc(100dvh - 16px);
        border-radius: 14px;
    }
    #addMedicineModal .modal-header {
        padding: 14px 16px;
    }
    #addMedicineModal .modal-header .btn-primary {
        display: none;
    }
    #addMedicineModal .modal-body {
        padding: 14px !important;
        max-height: none !important;
        flex: 1 1 auto;
    }
    #addMedicineModal .modal-form-section {
        padding: 16px;
    }
    #addMedicineModal .modal-footer {
        padding: 12px 14px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
    }
    #addMedicineModal .modal-footer .btn {
        width: 100%;
        margin: 0;
    }
}