/* ===== Standard stat cards (matches supervisor dashboard) ===== */
.stat-card {
    position: relative; overflow: hidden; border: none !important; border-radius: 16px !important;
    box-shadow: 0 8px 25px rgba(0,0,0,.1) !important; padding: 0 !important; margin-bottom: 0 !important;
    transition: transform .2s ease, box-shadow .2s ease;
    height: 100% !important;
}
.stat-card:hover { transform: translateY(-4px) !important; box-shadow: 0 14px 30px rgba(0,0,0,.15) !important; }
.stat-card .card-body {
    position: relative; padding: 1.25rem 1.5rem; text-align: left;
    height: 100%; display: flex; flex-direction: column; justify-content: center;
}
.stat-card .stat-icon {
    position: absolute !important; top: 15px !important; right: 20px !important; bottom: auto !important; left: auto !important;
    font-size: 3rem !important; opacity: .2 !important;
}
.stat-card h5 { font-size: 1.1rem; font-weight: 500; margin: 0 0 .25rem; }
.stat-card h2 { font-size: 2rem; font-weight: 500; margin: 0; }
.stat-card h2.stat-text { font-size: 1.25rem; font-weight: 600; padding-top: .45rem; }
.stat-card small { opacity: .85; }

/* ===== Table cards: no blue title bar ===== */
/* multi-table pages / headers with controls: flat, light title row */
.card:has(> .card-body table) > .card-header {
    background: transparent !important; color: #212529 !important;
    border-bottom: 1px solid #e9ecef; padding: 1rem 1.5rem !important; border-radius: 16px 16px 0 0 !important;
}
.card:has(> .card-body table) > .card-header :is(h1,h2,h3,h4,h5,h6,.text-white) { color: #212529 !important; }
.card:has(> .card-body table) > .card-header h5 i, .card:has(> .card-body table) > .card-header h4 i { color: #0d6efd; }
.card:has(> .card-body table) > .card-header .badge.bg-white { background: #e7f0ff !important; color: #0d6efd !important; }
.card:has(> .card-body table) > .card-header .btn-light { background: #e7f0ff; border-color: #e7f0ff; color: #0d6efd; }
/* single-table pages: title bar removed entirely (page already has a heading) */
.main-content:not(:has(.card:has(> .card-body table) ~ .card:has(> .card-body table)))
  .card:has(> .card-body table) > .card-header:not(:has(.btn, form, input, select)) { display: none !important; }

@media print { .stat-card { box-shadow: none !important; border: 1px solid #dee2e6 !important; } }

/* ===== Standard table header: light blue bar, bold dark text ===== */
.table > thead > tr > th, .table > thead > tr > td,
table thead th, .table thead th, .table-primary > th, thead.table-primary th {
    background: #cfe2ff !important; background-image: none !important;
    color: #000 !important; font-weight: 700 !important; border-color: #cfe2ff !important;
    border-radius: 0 !important; text-shadow: none !important;
}
.table > thead { --bs-table-bg: #cfe2ff; --bs-table-color: #000; }
.table > thead > tr > th { border-bottom: 1px solid #b6d4fe !important; }

/* ===== Standard search bar: input + outline search button ===== */
.search-bar { display: flex; align-items: center; gap: .5rem; width: 100%; max-width: 420px; }
.search-bar .form-control { flex: 1 1 auto; min-width: 0; border: 1px solid #dee2e6 !important; border-radius: 8px !important; box-shadow: none !important; background: #fff; }
.search-bar .form-control:focus { border-color: #86b7fe !important; box-shadow: 0 0 0 .2rem rgba(13,110,253,.15) !important; }
.search-bar .btn { flex: 0 0 auto; border-radius: 8px !important; padding: .375rem .75rem !important; text-transform: none !important; letter-spacing: 0 !important; font-weight: 400 !important; width: auto !important; margin: 0 !important; }
.card-header .search-bar { width: auto; max-width: 340px; }
.search-container { max-width: none !important; }

/* ===== Standard row-action buttons (any .btn-sm inside a table cell) ===== */
.table td .btn.btn-sm {
    display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
    height: 34px; min-width: 34px; padding: 0 .85rem; border: none !important; border-radius: 10px !important;
    font-size: .82rem !important; font-weight: 600 !important; line-height: 1; white-space: nowrap;
    text-transform: none !important; letter-spacing: 0 !important; margin: 0 !important; width: auto;
    transition: transform .15s ease, box-shadow .15s ease, background-color .15s ease, color .15s ease;
}
.table td .btn.btn-sm:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(0,0,0,.15); }
.table td .btn.btn-sm i { margin: 0 !important; }
.table td .btn-sm:is(.btn-primary, .btn-outline-primary)     { background: #e7f0ff !important; color: #0d6efd !important; }
.table td .btn-sm:is(.btn-success, .btn-outline-success)     { background: #d9f2e4 !important; color: #157347 !important; }
.table td .btn-sm:is(.btn-warning, .btn-outline-warning)     { background: #fff1cc !important; color: #8a6100 !important; }
.table td .btn-sm:is(.btn-danger, .btn-outline-danger)       { background: #ffe1e4 !important; color: #dc3545 !important; }
.table td .btn-sm:is(.btn-info, .btn-outline-info)           { background: #d7f3fb !important; color: #087990 !important; }
.table td .btn-sm:is(.btn-secondary, .btn-outline-secondary) { background: #e9ecef !important; color: #495057 !important; }
.table td .btn-sm.btn-primary:hover, .table td .btn-sm.btn-outline-primary:hover     { background: #0d6efd !important; color: #fff !important; }
.table td .btn-sm.btn-success:hover, .table td .btn-sm.btn-outline-success:hover     { background: #198754 !important; color: #fff !important; }
.table td .btn-sm.btn-warning:hover, .table td .btn-sm.btn-outline-warning:hover     { background: #ffc107 !important; color: #000 !important; }
.table td .btn-sm.btn-danger:hover, .table td .btn-sm.btn-outline-danger:hover       { background: #dc3545 !important; color: #fff !important; }
.table td .btn-sm.btn-info:hover, .table td .btn-sm.btn-outline-info:hover           { background: #0dcaf0 !important; color: #000 !important; }
.table td .btn-sm:disabled, .table td .btn-sm.disabled { opacity: .55; transform: none !important; box-shadow: none !important; }
.table td .btn-sm.rounded-circle { border-radius: 10px !important; width: 34px; padding: 0; }

/* action cells: tidy, evenly spaced group */
.table td.actions-cell, .table th.actions-cell { text-align: center; white-space: nowrap; width: 1%; }
.table td.actions-cell { display: table-cell; }
.table td.actions-cell > * { vertical-align: middle; }
.table td.actions-cell > .btn + .btn, .table td.actions-cell > form + .btn, .table td.actions-cell > .btn + form,
.table td.actions-cell > form + form { margin-left: .4rem !important; }
.table td .btn-sm .count-pill {
    display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px;
    padding: 0 5px; border-radius: 999px; background: #dc3545; color: #fff; font-size: .7rem; font-weight: 700;
}
.table th, .table td { vertical-align: middle; }
.table td.actions-cell form { display: inline-block; margin: 0; }

/* ===== Standard page layout (header / sidebar / content) — matches cashier dashboard ===== */
body:not(.legacy-layout) .header {
    position: fixed !important; top: 0; left: 0; right: 0; height: 70px !important; z-index: 1030 !important;
    display: flex; align-items: center; padding: 0 1.5rem !important; background-color: #0d6efd;
    box-shadow: 0 2px 10px rgba(0,0,0,.12);
}
body:not(.legacy-layout) .header .dropdown-menu { z-index: 1100; }
body:not(.legacy-layout) .sidebar {
    position: fixed !important; top: 70px !important; left: 0; bottom: 0; width: 250px !important;
    background: #343a40 !important; overflow-y: auto; z-index: 1020 !important; padding-top: 1rem !important; box-shadow: none !important;
}
body:not(.legacy-layout) .sidebar .nav-link {
    color: rgba(255,255,255,.85); border-radius: 8px; margin: .25rem 1rem !important; padding: .75rem 1rem !important;
    white-space: nowrap; box-shadow: none !important; transition: all .25s;
}
body:not(.legacy-layout) .sidebar .nav-link:hover,
body:not(.legacy-layout) .sidebar .nav-link.active { background-color: #0d6efd !important; color: #fff !important; }
body:not(.legacy-layout) .sidebar .nav-link i { width: 24px; text-align: center; }
body:not(.legacy-layout) .main-content {
    margin-left: 250px !important; margin-top: 70px !important; padding: 2rem 2.5rem !important; min-height: calc(100vh - 70px);
}
@media (max-width: 992px) {
    body:not(.legacy-layout) .sidebar { width: 80px !important; }
    body:not(.legacy-layout) .sidebar .nav-link { text-align: center; padding: .75rem 0 !important; }
    body:not(.legacy-layout) .sidebar .nav-link span { display: none; }
    body:not(.legacy-layout) .sidebar .nav-link i { margin: 0 !important; font-size: 1.3rem; }
    body:not(.legacy-layout) .main-content { margin-left: 80px !important; padding: 1.5rem !important; }
}
@media print { body:not(.legacy-layout) .main-content { margin: 0 !important; padding: 1rem !important; } }

/* ===== Page welcome/title card (matches receptionist dashboard) ===== */
.welcome-card {
    background: #fff; border-radius: 16px; padding: 1.75rem 2rem; margin-bottom: 1.75rem;
    box-shadow: 0 8px 25px rgba(0,0,0,.08);
}
.welcome-card h3 { font-weight: 700; margin: 0 0 .25rem; }
.form-section { margin-bottom: 1.75rem; }
.form-section-title {
    display: flex; align-items: center; gap: .6rem; font-size: 1rem; font-weight: 700; color: #0d6efd;
    padding-bottom: .6rem; margin-bottom: 1.1rem; border-bottom: 2px solid #e9f0ff;
}
.form-section-title i { width: 32px; height: 32px; border-radius: 10px; background: #e7f0ff; display: inline-flex; align-items: center; justify-content: center; font-size: .9rem; }
.form-label { font-weight: 600; color: #343a40; }
.form-control, .form-select { border-radius: 10px; border: 1px solid #dee2e6; padding: .6rem .85rem; }
.form-control:focus, .form-select:focus { border-color: #86b7fe; box-shadow: 0 0 0 .2rem rgba(13,110,253,.15); }
.card-body.p-0 > .search-bar, .card-body.p-0 > .table-responsive + .search-bar { margin: 1rem 1.5rem; }
.card-body.p-0 > .search-bar { margin: 1rem 1.5rem .5rem; }

/* ===== Typography: smaller base size, plain black codes ===== */
html { font-size: 14px; }
code, kbd, samp, span.patient-code {
    color: #212529 !important; font-family: inherit !important; font-size: inherit !important;
    font-weight: 400 !important; background: none !important; padding: 0 !important;
}
/* patient codes anywhere: plain, standard size, black */
td.patient-code, .patient-code strong, .patient-code b { font-family: inherit !important; font-weight: 400 !important; color: #212529 !important; }

/* ===== Round logo badge (header, login, print) ===== */
.logo-badge, .header .navbar-brand {
    position: relative; display: block; flex: 0 0 auto; width: 58px; height: 58px; padding: 0 !important;
    border-radius: 50%; overflow: hidden; background: #0e1726; border: 2px solid #fff;
    box-shadow: 0 2px 10px rgba(0,0,0,.3); transition: box-shadow .2s ease, transform .2s ease;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
}
.header .navbar-brand:hover { transform: scale(1.06); box-shadow: 0 4px 14px rgba(0,0,0,.4); }
.logo-badge img, .header .navbar-brand img {
    position: absolute !important; width: 233% !important; height: auto !important; max-width: none !important; max-height: none !important;
    left: -68.5% !important; top: -31.5% !important; transform: none !important; margin: 0 !important; padding: 0 !important;
    border-radius: 0 !important; box-shadow: none !important; object-fit: fill !important;
}
.header .navbar-brand:hover img { transform: none !important; }

/* ===== Sidebar collapse/expand toggle (all dashboards) ===== */
.sidebar-toggle-btn {
    background: transparent; border: none; color: #fff; font-size: 1.15rem;
    width: 40px; height: 40px; min-width: 40px; border-radius: 8px; margin-right: .75rem;
    display: inline-flex; align-items: center; justify-content: center; cursor: pointer;
    flex: 0 0 auto; order: -1;
}
.sidebar-toggle-btn:hover { background: rgba(255,255,255,.15); }
.sidebar-toggle-btn:focus-visible { outline: 2px solid rgba(255,255,255,.6); outline-offset: 2px; }

.sidebar, .main-content { transition: width .2s ease, margin-left .2s ease; }

body.sidebar-collapsed .sidebar { width: 76px !important; overflow-x: hidden; }
body.sidebar-collapsed .sidebar .nav-link {
    font-size: 0 !important;
    text-align: center;
    display: flex !important;
    justify-content: center;
    padding-left: .5rem !important;
    padding-right: .5rem !important;
}
body.sidebar-collapsed .sidebar .nav-link i { font-size: 1.15rem !important; }
body.sidebar-collapsed .main-content { margin-left: 76px !important; }
@media (max-width: 992px) {
    body.sidebar-collapsed .sidebar { width: 0 !important; overflow: hidden; }
    body.sidebar-collapsed .main-content { margin-left: 0 !important; }
}
