/* app-overrides.css
 * Project-specific styles layered on top of AdminLTE.
 *
 * ASSET MANIFEST / load order (see header.php):
 *   1. fonts/noto-sans-thai/fonts.css   -> local Noto Sans Thai (no Google Fonts)
 *   2. adminlte/css/adminlte.min.css    -> AdminLTE v4.0.2; BUNDLES Bootstrap 5.3.8 CSS
 *                                          (so no separate Bootstrap CSS file is needed/shipped).
 *   3. bootstrap-icons/bootstrap-icons.min.css
 *   4. css/app-overrides.css            -> THIS FILE, loads LAST.
 * JS (footer): bootstrap/js/bootstrap.bundle.min.js (Popper incl.) THEN adminlte/js/adminlte.min.js.
 *
 * NOTE: Tailwind was fully removed (every page uses AdminLTE/Bootstrap markup).
 */

/* Keep the original Thai typography everywhere. */
body {
    font-family: 'Noto Sans Thai', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* File upload dropzone (tax_payments, add, edit, invoices) */
.upload-dropzone {
    border: 2px dashed var(--bs-border-color);
    border-radius: var(--bs-border-radius);
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}
.upload-dropzone:hover,
.upload-dropzone.drag-over {
    border-color: var(--bs-primary);
    background-color: var(--bs-primary-bg-subtle);
}

/* Hoverable list rows (e.g. top-users links, account cards) */
.list-hover {
    transition: background-color .12s ease;
}
.list-hover:hover {
    background-color: var(--bs-tertiary-bg);
}

/* ---------------------------------------------------------------------------
 * KPI cards (dashboard summary metrics) — replaces AdminLTE .small-box whose
 * oversized corner icon overflowed and whose heights were uneven.
 * Clean, equal-height card: contained icon chip + value + label.
 * ------------------------------------------------------------------------- */
.min-w-0 { min-width: 0; }

.kpi-card { transition: box-shadow .15s ease; }
.kpi-card:hover { box-shadow: 0 .35rem 1rem rgba(0,0,0,.08); }
.kpi-card .card-body { padding: .9rem 1rem; }
.kpi-icon {
    width: 2.1rem;
    height: 2.1rem;
    border-radius: .55rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
}
.kpi-label {
    font-size: .8rem;
    font-weight: 500;
    color: var(--bs-secondary-color);
    line-height: 1.2;
}
.kpi-value {
    font-size: 1.25rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -.02em;
    overflow-wrap: anywhere;
    white-space: nowrap;
}
/* money values are long; use a smaller fixed size so 6-up KPI columns don't wrap */
.kpi-value.money-value { font-size: .98rem; white-space: normal; }
.kpi-sub { font-size: .74rem; line-height: 1.25; }