/*
 * ANGELUS custom styles — tweaks layered on top of daisyUI.
 * Brand colours, icons and print behaviour live here; everything else
 * comes from daisyUI utility/component classes in the templates.
 */

/* ── Typography: Inter (vendored, see vendor/fonts.css) ────────────────── */
body {
    font-family: 'Inter', ui-sans-serif, system-ui, -apple-system, 'Segoe UI',
        Roboto, 'Helvetica Neue', Arial, sans-serif;
    /* Ambient wash built ONLY from daisyUI theme variables (oklch), so it
       follows data-theme automatically. color-mix(in oklab, ...) keeps the
       tint low-contrast; on unsupported browsers the image simply drops out
       and background-color remains. */
    background-color: var(--color-base-200);
    background-image:
        radial-gradient(60rem 40rem at 12% -8%,
            color-mix(in oklab, var(--color-primary) 16%, transparent), transparent 65%),
        radial-gradient(50rem 35rem at 105% 110%,
            color-mix(in oklab, var(--color-secondary) 12%, transparent), transparent 65%);
    background-attachment: fixed; /* iOS Safari ignores this and scrolls — acceptable */
}

/* ── Material Symbols (variable font, vendored locally) ─────────────────
   Adjust icon weight/fill globally here; per-icon overrides inline:
   style="font-variation-settings:'FILL' 1"                                */
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
    -webkit-font-smoothing: antialiased;
}

/* Slightly smaller icons inside menus, buttons and badges */
.menu .material-symbols-outlined,
.btn .material-symbols-outlined,
.alert .material-symbols-outlined {
    font-size: 20px;
}

/* ── Sidebar niceties ─────────────────────────────────────────────────── */
.menu .menu-active {
    font-weight: 600;
}

/* ── Receipt paper: a hairline border on screen, invisible when printed ─ */
.receipt-paper {
    border: 1px dashed var(--color-base-300, oklch(0.9 0 0));
}

/* ── Print styles: only the receipt sheet should come out of the printer ─ */
@media print {
    .navbar,
    .drawer-side,
    .no-print,
    footer,
    #modal-root {
        display: none !important;
    }
    body,
    .drawer {
        background: white !important;
        background-image: none !important;
        background-attachment: initial !important;
    }
    .drawer-content {
        padding: 0 !important;
        margin: 0 !important;
    }
    .receipt-paper {
        border: none !important;
        box-shadow: none !important;
    }
}