/* ────────────────────────────────────────────────────────────────────────
   Expenses app-specific overrides.

   Kept out of styles.css on purpose: styles.css is the shared Cuttle theme
   (synced with batsense) and must stay identical. Everything here is the
   app's own rhythm: no decorative shadows, compact form controls, floating
   flash toasts. Cards keep their border everywhere, so the search section
   reads the same as every other screen.
   ──────────────────────────────────────────────────────────────────────── */

/* Reclaim the fixed-sidenav space on pages without a left menu. */
.nav-fixed.no-sidenav #layoutSidenav #layoutSidenav_content { padding-left: 0; }

/* Breathing room above the first item in the left sidenav — reads as a
   blank first line, so the menu doesn't butt up against the identity bar. */
#layoutSidenav_nav .sidenav-menu .nav { padding-top: 1.5rem; }

/* ── Form controls — tighter than the theme default ──────────────────────
   The shared theme renders inputs ~48px tall, which eats screen space on
   data-entry pages. App-wide override to a compact rhythm. */
.form-control,
.form-select {
    padding-top: 0.35rem;
    padding-bottom: 0.35rem;
    line-height: 1.4;
    min-height: 0;
}
.form-label {
    margin-bottom: 0.25rem;
}

/* Drop shadows app-wide (decorative only — focus rings are untouched). */
.shadow,
.shadow-sm,
.shadow-lg,
.shadow-right,
.shadow-left,
.card,
.topnav {
    box-shadow: none !important;
}

/* ── Full-width identity bar, directly under the top menu ──────────────────
   Sits below the fixed top nav and spans the whole width, covering the top
   strip of the left sidenav too. Pages opt in by defining @section('subheader')
   which adds .has-subheader to <body>. */
.app-subheader {
    position: fixed;
    top: 3.625rem;            /* height of the fixed topnav */
    left: 0;
    right: 0;
    height: 2.75rem;
    z-index: 1039;            /* above the sidenav (1038), level with topnav */
    display: flex;
    align-items: center;
    padding: 0 1.5rem;
    background-color: #e6e7f3; /* light tint of the primary (#55588b) */
    border-bottom: 1px solid #d4d5e6;
    color: #3b3e5c;
}

/* ── Flash messages as floating toasts ─────────────────────────────────────
   Top right, under the fixed topnav (3.625rem). The wrapper class comes from
   index.php's layout config ('flashes'); success/info auto-dismiss via the
   script configured there. */
.app-flashes {
    top: 4rem;
    z-index: 1080;
    width: min(26rem, calc(100vw - 2rem));
}
.app-flashes .alert {
    box-shadow: 0 0.5rem 1.5rem rgba(33, 36, 61, 0.25);
    margin-bottom: 0.5rem;
}

/* Drag & drop upload zone (see js/app.js, [data-dropzone]). */
.dropzone {
    border: 2px dashed #c7c9da;
    border-radius: 0.35rem;
    cursor: pointer;
    transition: background-color 0.1s ease-in-out, border-color 0.1s ease-in-out;
}
.dropzone.dropzone-over {
    border-color: #55588b;
    background-color: #eceef7;
}

/* Push the sidenav menu and the content down to clear the identity bar. */
.has-subheader.nav-fixed #layoutSidenav #layoutSidenav_content {
    top: 6.375rem;            /* 3.625rem topnav + 2.75rem bar */
}
.has-subheader.nav-fixed #layoutSidenav #layoutSidenav_nav .sidenav {
    padding-top: 6.375rem;
}