/* ==========================================================================
   Monbari Psychiatric Care — Refinement Layer
   --------------------------------------------------------------------------
   Loaded AFTER style.css. Additive only: interaction states, micro-polish
   and small ergonomic fixes.

   Rules for this file:
     - No redefinition of :root tokens (style.css owns the palette).
     - No structural layout rules (style.css owns layout).
     - Keep it short. If a rule belongs to a component, it belongs upstream.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Interaction feedback
   -------------------------------------------------------------------------- */
.btn:active:not(:disabled):not(.disabled) { transform: translateY(.5px); }

.card { transition: border-color .15s ease, box-shadow .15s ease; }
.card:hover { border-color: var(--border-strong); }

/* Cards that are actually links/actions get a clearer affordance */
a > .card:hover,
.card.card-clickable:hover {
    border-color: var(--primary);
    box-shadow: var(--shadow-sm);
}

/* Consistent keyboard focus across every interactive element */
.btn:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible,
.page-link:focus-visible,
.dropdown-item:focus-visible,
.nav-link:focus-visible,
a:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 1px;
    box-shadow: none;
}
.sidebar a:focus-visible {
    outline: 2px solid var(--nav-accent);
    outline-offset: -2px;
}

/* --------------------------------------------------------------------------
   2. Table ergonomics
   -------------------------------------------------------------------------- */
/* Sticky header for long scrolling reports */
.table-responsive.sticky-head thead th {
    position: sticky;
    top: 0;
    z-index: 2;
}

/* Right-align money/number columns when marked up as such */
.table td.num,
.table th.num,
.table td.amount,
.table th.amount,
.table td.text-end,
.table th.text-end { text-align: right; }

/* Row action buttons stay tight together */
.table td .btn-sm + .btn-sm { margin-left: 3px; }

/* Zero/empty cells read as secondary, not as data */
.table td .text-muted { color: var(--text-faint) !important; }

/* --------------------------------------------------------------------------
   3. Form ergonomics
   -------------------------------------------------------------------------- */
/* Date inputs: consistent height + clickable picker icon */
input[type="date"].form-control,
input[type="time"].form-control,
input[type="datetime-local"].form-control { padding-right: 8px; }
input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: .55; }
input[type="date"]::-webkit-calendar-picker-indicator:hover { opacity: 1; }

/* Numeric inputs read better right-aligned in line-item tables */
table input[type="number"].form-control,
table input[type="number"].form-control-sm { text-align: right; }

/* Remove spinner arrows — they misfire on qty/rate fields */
input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }
input[type="number"] { -moz-appearance: textfield; }

/* Validation states on-palette */
.was-validated .form-control:invalid,
.form-control.is-invalid { border-color: var(--danger); }
.was-validated .form-control:invalid:focus,
.form-control.is-invalid:focus { box-shadow: 0 0 0 3px rgba(185, 28, 28, .14); }
.invalid-feedback { font-size: 11.5px; color: var(--danger); }

/* --------------------------------------------------------------------------
   4. Sub-navigation polish
   -------------------------------------------------------------------------- */
/* Fade hint that the module menu scrolls sideways on small screens */
@media (max-width: 991.98px) {
    .module-menu {
        -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 20px), transparent 100%);
                mask-image: linear-gradient(to right, #000 calc(100% - 20px), transparent 100%);
    }
}

/* --------------------------------------------------------------------------
   5. Navigation shell refinements
   -------------------------------------------------------------------------- */
/* A hairline rail ties a submenu back to its parent item */
.sidebar-menu .submenu { position: relative; }
.sidebar-menu .submenu::before {
    content: "";
    position: absolute;
    left: 18px;
    top: 2px;
    bottom: 2px;
    width: 1px;
    background: rgba(255, 255, 255, .10);
}
.sidebar-menu .submenu li > a { position: relative; }
/* The active child lights its own segment of the rail */
.sidebar-menu .submenu li > a.active::after {
    content: "";
    position: absolute;
    left: -12px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 15px;
    background: var(--nav-accent);
}

/* Open parent stays visually connected to its children */
.sidebar-menu .menu-toggle[aria-expanded="true"] {
    color: var(--nav-text-bright);
    background: rgba(255, 255, 255, .04);
}

/* Sidebar scrollbar recedes into the dark panel */
.sidebar::-webkit-scrollbar { width: 6px; }
.sidebar::-webkit-scrollbar-track { background: transparent; }
.sidebar::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, .13);
    border-radius: 999px;
}
.sidebar::-webkit-scrollbar-thumb:hover { background: rgba(255, 255, 255, .24); }

/* Module menu: quieter idle state so the solid green active tab leads */
.module-menu .btn-light {
    background: var(--surface);
    color: var(--text-body);
}
.module-menu .btn-light:hover {
    background: var(--primary-light);
    border-color: rgba(15, 118, 110, .3);
    color: var(--primary-dark);
}

/* --------------------------------------------------------------------------
   6. Print refinements
   -------------------------------------------------------------------------- */
@media print {
    /* Keep signature blocks and totals from splitting across pages */
    .signatures, .sig, .summary-table, .invoice-header, .meta-box { break-inside: avoid; }
    .footer-note { font-size: 9.5px; color: #666; }
}
