/* ============================================================
   ScriptWise — CAYMAN chrome (light only)
   ------------------------------------------------------------
   Structural companion to cayman-base.css: the things a palette alone cannot
   express — the standard of colour across the top, the weight of the header,
   how a page announces itself.

   Kept in a separate file on purpose. Removing the <link> in App.razor drops
   every structural change and leaves the plain re-coloured theme behind, so
   the two halves of the experiment can be judged independently.

   Scoped to the authenticated shell (.rz-layout / .rz-header / .rz-sidebar).
   The account pages use their own LoginLayout.razor.css and are deliberately
   left alone.
   ============================================================ */

/* ── The standard ──────────────────────────────────────────────
   A four-pixel band of the arms across the top of the application: sea navy,
   gold, star green. The one overtly heraldic gesture in the interface — every
   other reference is carried quietly by the palette. */
.rz-header {
    border-top: 4px solid transparent;
    border-image: linear-gradient(
        to right,
        var(--cy-navy)  0%,   var(--cy-navy)  55%,
        var(--cy-gold)  55%,  var(--cy-gold)  78%,
        var(--cy-green) 78%,  var(--cy-green) 100%
    ) 1;
    border-bottom: 1px solid var(--rz-border-color);
    box-shadow: 0 1px 2px rgba(6, 29, 51, 0.06);
}

/* ── Sidebar ──────────────────────────────────────────────────
   Navy comes from --rz-base-800 in the theme file. What is added here is the
   gold hairline separating navigation from the body, echoing the standard. */
.rz-sidebar {
    border-right: 1px solid var(--cy-navy-deep);
    box-shadow: inset -3px 0 0 -2px var(--cy-gold);
}

/* Nav items: quieter by default, with the gold reserved for where you are. */
.rz-navigation-item-link {
    letter-spacing: 0.01em;
}

.rz-navigation-item-link:hover {
    background-color: rgba(255, 255, 255, 0.08);
}

/* ── Page headings ────────────────────────────────────────────
   A short gold rule under the page title. Gives each screen a masthead
   without adding a heavier header band. */
.rz-body .rz-text-h4 {
    position: relative;
    padding-bottom: 0.5rem;
    letter-spacing: -0.01em;
}

.rz-body .rz-text-h4::after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 44px;
    height: 3px;
    background: var(--cy-gold);
    border-radius: 2px;
}

/* ── Cards and panels ─────────────────────────────────────────
   Flat, bordered, minimal shadow. Records should look filed, not floating. */
.rz-body .rz-card {
    border: 1px solid var(--rz-border-color);
    box-shadow: 0 1px 2px rgba(6, 29, 51, 0.05);
}

/* ── Data grid ────────────────────────────────────────────────
   The register is the heart of the product, so the grid gets the most
   deliberate treatment: a navy-washed header with a strong rule beneath it,
   and a navy tint — not grey — for the selected row. */
.rz-body .rz-data-grid .rz-grid-table thead th {
    background-color: var(--cy-navy-wash);
    border-bottom: 2px solid var(--cy-navy);
    color: var(--cy-navy-ink);
    font-weight: 600;
    letter-spacing: 0.02em;
}

.rz-body .rz-data-grid tbody tr.rz-data-row:hover > td {
    background-color: var(--cy-navy-wash);
}

.rz-body .rz-data-grid tbody tr.rz-state-highlight > td {
    background-color: var(--cy-navy-tint);
    color: var(--cy-navy-ink);
}

/* ── Buttons ──────────────────────────────────────────────────
   Radzen's default is 8px/16px. A little more horizontal room lets the label
   breathe inside the fill and gives the row of actions a steadier rhythm now
   that the buttons are properly separated. Vertical padding is left alone so
   the 36px control height — and its alignment with inputs — is unchanged.

   Icon buttons are excluded: they are square by design and extra inline
   padding would stretch them into lozenges. */
.rz-body .rz-button.rz-button-md:not(.rz-button-icon-only) {
    padding-inline: 18px;
}

.rz-body .rz-button.rz-button-sm:not(.rz-button-icon-only) {
    padding-inline: 14px;
}

/* Breathing room between a button's icon and its label. */
.rz-body .rz-button .rz-button-box {
    gap: 0.4rem;
}

/* ── Primary action ───────────────────────────────────────────
   Solid navy, square-ish, with a gold focus ring so keyboard focus is
   unmistakable against a page of navy controls. */
.rz-body .rz-button.rz-primary:focus-visible,
.rz-body .rz-button.rz-secondary:focus-visible {
    outline: 3px solid var(--cy-gold-bright);
    outline-offset: 2px;
}

/* ── Footer ───────────────────────────────────────────────────
   Thin navy rule above the footer text, closing the frame the standard opens. */
.rz-footer {
    border-top: 1px solid var(--rz-border-color);
    box-shadow: inset 0 3px 0 -2px var(--cy-navy);
}