/* ==========================================================================
   Dynamique design system
   Every page uses these variables. Do not hard-code colours, radii, shadows
   or fonts elsewhere; add a variable here instead. See CLAUDE.md "Design system".
   Loaded after AdminLTE/Bootstrap so it overrides them.
   ========================================================================== */

:root {
    /* Colours (from the logo) */
    --dy-primary: #04545E;          /* dark teal: sidebar, headers, primary buttons */
    --dy-primary-700: #03434B;      /* hover / pressed */
    --dy-primary-900: #022E33;      /* deepest teal, gradient start */
    --dy-accent: #2C9EAC;           /* light teal: links, highlights, charts */
    --dy-accent-100: #DDF1F3;       /* accent tint: hovers, badges */
    --dy-green: #00553E;            /* titles, company name, success */
    --dy-green-100: #DCEFE8;
    --dy-mist: #D5E3E3;             /* borders, dividers, table stripes */
    --dy-bg: #EEF4F4;               /* admin page background */
    --dy-surface: #FFFFFF;          /* cards */
    --dy-text: #12343A;
    --dy-muted: #5E7A7E;
    --dy-danger: #C0392B;
    --dy-danger-100: #F8E1DE;
    --dy-warning: #D99A00;
    --dy-warning-100: #FBF0D2;

    /* Gradients */
    --dy-gradient: radial-gradient(1200px 600px at 85% -10%, rgba(44, 158, 172, .45), transparent 60%),
                   linear-gradient(160deg, var(--dy-primary-900) 0%, var(--dy-primary) 55%, #0B6A75 100%);
    --dy-gradient-sidebar: linear-gradient(180deg, var(--dy-primary) 0%, var(--dy-primary-900) 100%);
    --dy-gradient-kpi: linear-gradient(135deg, var(--dy-primary) 0%, var(--dy-accent) 100%);

    /* Typography */
    --dy-font: "Nunito", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
    --dy-fs-xs: .75rem;
    --dy-fs-sm: .875rem;
    --dy-fs-base: 1rem;
    --dy-fs-lg: 1.125rem;
    --dy-fs-xl: 1.5rem;
    --dy-fs-2xl: 2rem;
    --dy-fs-3xl: 2.5rem;
    --dy-fw-normal: 400;
    --dy-fw-semibold: 600;
    --dy-fw-bold: 800;
    --dy-tracking-title: .04em;

    /* Shape */
    --dy-radius-sm: 8px;
    --dy-radius: 14px;
    --dy-radius-lg: 22px;
    --dy-radius-pill: 999px;          /* buttons, badges */
    --dy-radius-input: 6px;           /* text fields and selects */

    /* Elevation */
    --dy-shadow-sm: 0 1px 2px rgba(2, 46, 51, .06), 0 1px 3px rgba(2, 46, 51, .08);
    --dy-shadow: 0 4px 14px rgba(2, 46, 51, .08), 0 2px 4px rgba(2, 46, 51, .05);
    --dy-shadow-lg: 0 18px 40px rgba(2, 46, 51, .18), 0 6px 12px rgba(2, 46, 51, .08);
    --dy-shadow-logo: 0 10px 30px rgba(0, 0, 0, .25), 0 0 0 6px rgba(255, 255, 255, .12);

    /* Motion */
    --dy-ease: cubic-bezier(.2, .7, .2, 1);
    --dy-duration: 180ms;
    --dy-duration-page: 260ms;

    /* Bootstrap mapping */
    --bs-body-font-family: var(--dy-font);
    --bs-body-color: var(--dy-text);
    --bs-body-bg: var(--dy-bg);
    --bs-primary: var(--dy-primary);
    --bs-primary-rgb: 4, 84, 94;
    --bs-success: var(--dy-green);
    --bs-success-rgb: 0, 85, 62;
    --bs-info: var(--dy-accent);
    --bs-info-rgb: 44, 158, 172;
    --bs-danger: var(--dy-danger);
    --bs-danger-rgb: 192, 57, 43;
    --bs-secondary-color: var(--dy-muted);
    --bs-border-color: var(--dy-mist);
    --bs-border-radius: var(--dy-radius-sm);
    --bs-border-radius-lg: var(--dy-radius);
    --bs-link-color: var(--dy-accent);
    --bs-link-color-rgb: 44, 158, 172;
    --bs-link-hover-color: var(--dy-primary);
    --bs-link-hover-color-rgb: 4, 84, 94;
    --bs-focus-ring-color: rgba(44, 158, 172, .35);
}

/* --------------------------------------------------------------------------
   Base
   -------------------------------------------------------------------------- */

body {
    font-family: var(--dy-font);
    color: var(--dy-text);
    -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6, .dy-title {
    font-weight: var(--dy-fw-bold);
    color: var(--dy-green);
}

.dy-title {
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
}

.text-muted, .text-body-secondary { color: var(--dy-muted) !important; }
code { color: var(--dy-primary); }
.text-dy-green { color: var(--dy-green) !important; }
.text-dy-accent { color: var(--dy-accent) !important; }
.text-dy-primary { color: var(--dy-primary) !important; }

/* Page transitions: same-document fade, plus cross-page fade where supported. */
@view-transition { navigation: auto; }

.dy-page {
    animation: dy-fade-up var(--dy-duration-page) var(--dy-ease) both;
}

@keyframes dy-fade-up {
    from { opacity: 0; transform: translateY(6px); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 1ms !important;
        transition-duration: 1ms !important;
    }
    @view-transition { navigation: none; }
}

/* --------------------------------------------------------------------------
   Gradient surfaces (home, login, public pages)
   -------------------------------------------------------------------------- */

.dy-gradient-bg {
    min-height: 100vh;
    min-height: 100dvh;
    background: var(--dy-gradient);
    background-attachment: fixed;
    color: #fff;
}

.dy-gradient-bg h1,
.dy-gradient-bg h2 { color: #fff; }

.dy-gradient-bg .dy-auth-card h1,
.dy-gradient-bg .dy-auth-card h2 { color: var(--dy-green); }

/* Logo in a white circle with soft shadow */
.dy-logo-circle {
    --dy-logo-size: 140px;
    width: var(--dy-logo-size);
    height: var(--dy-logo-size);
    border-radius: 50%;
    background: var(--dy-surface);
    box-shadow: var(--dy-shadow-logo);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    flex-shrink: 0;
}

.dy-logo-circle img {
    width: 84%;
    height: 84%;
    object-fit: contain;
}

.dy-logo-circle--sm { --dy-logo-size: 42px; box-shadow: 0 2px 8px rgba(0, 0, 0, .25); }
.dy-logo-circle--md { --dy-logo-size: 96px; }
.dy-logo-circle--lg { --dy-logo-size: 160px; }

/* --------------------------------------------------------------------------
   Buttons: pills everywhere
   -------------------------------------------------------------------------- */

.btn {
    --bs-btn-border-radius: var(--dy-radius-pill);
    --bs-btn-font-weight: var(--dy-fw-semibold);
    --bs-btn-padding-x: 1.25rem;
    border-radius: var(--dy-radius-pill);
    transition: transform var(--dy-duration) var(--dy-ease),
                box-shadow var(--dy-duration) var(--dy-ease),
                background-color var(--dy-duration) var(--dy-ease),
                color var(--dy-duration) var(--dy-ease);
}

.btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: var(--dy-shadow); }
.btn:active:not(:disabled) { transform: translateY(0); box-shadow: none; }

.btn-lg { --bs-btn-padding-x: 2rem; --bs-btn-padding-y: .8rem; --bs-btn-font-size: var(--dy-fs-lg); }

.btn-primary {
    --bs-btn-bg: var(--dy-primary);
    --bs-btn-border-color: var(--dy-primary);
    --bs-btn-hover-bg: var(--dy-primary-700);
    --bs-btn-hover-border-color: var(--dy-primary-700);
    --bs-btn-active-bg: var(--dy-primary-900);
    --bs-btn-active-border-color: var(--dy-primary-900);
    --bs-btn-disabled-bg: var(--dy-primary);
    --bs-btn-disabled-border-color: var(--dy-primary);
}

.btn-accent {
    --bs-btn-color: #fff;
    --bs-btn-bg: var(--dy-accent);
    --bs-btn-border-color: var(--dy-accent);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--dy-primary);
    --bs-btn-hover-border-color: var(--dy-primary);
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--dy-primary-700);
}

.btn-success {
    --bs-btn-bg: var(--dy-green);
    --bs-btn-border-color: var(--dy-green);
    --bs-btn-hover-bg: #00412F;
    --bs-btn-hover-border-color: #00412F;
}

.btn-outline-primary {
    --bs-btn-color: var(--dy-primary);
    --bs-btn-border-color: var(--dy-primary);
    --bs-btn-hover-bg: var(--dy-primary);
    --bs-btn-hover-border-color: var(--dy-primary);
    --bs-btn-active-bg: var(--dy-primary-700);
}

/* On the gradient: white pill and glass outline pill */
.btn-on-dark {
    --bs-btn-color: var(--dy-primary);
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-hover-color: var(--dy-primary-900);
    --bs-btn-hover-bg: var(--dy-accent-100);
    --bs-btn-hover-border-color: var(--dy-accent-100);
    --bs-btn-active-color: var(--dy-primary-900);
    --bs-btn-active-bg: var(--dy-accent-100);
}

.btn-outline-on-dark {
    --bs-btn-color: #fff;
    --bs-btn-bg: rgba(255, 255, 255, .08);
    --bs-btn-border-color: rgba(255, 255, 255, .7);
    --bs-btn-hover-color: var(--dy-primary);
    --bs-btn-hover-bg: #fff;
    --bs-btn-hover-border-color: #fff;
    --bs-btn-active-color: var(--dy-primary);
    --bs-btn-active-bg: #fff;
    backdrop-filter: blur(4px);
}

/* Loading state: <button data-loading-text="Connexion…"> gets .is-loading on submit */
.btn.is-loading { pointer-events: none; opacity: .9; }
.btn .dy-spinner {
    width: 1em; height: 1em;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    display: inline-block;
    vertical-align: -.125em;
    animation: dy-spin .7s linear infinite;
}

@keyframes dy-spin { to { transform: rotate(360deg); } }

/* --------------------------------------------------------------------------
   Forms
   -------------------------------------------------------------------------- */

/* Text fields and selects: plain, small radius (buttons stay pills). */
.form-control, .form-select, .input-group > .form-control, .input-group > .form-select {
    border-radius: var(--dy-radius-input);
    border-color: var(--dy-mist);
}

.form-control:focus, .form-select:focus, .form-check-input:focus {
    border-color: var(--dy-accent);
    box-shadow: 0 0 0 .25rem var(--bs-focus-ring-color);
}

.form-check-input:checked { background-color: var(--dy-primary); border-color: var(--dy-primary); }
.form-label { font-weight: var(--dy-fw-semibold); color: var(--dy-text); }

/* Field with an icon on the left and an optional button on the right (show/hide password) */
.dy-field { position: relative; }
.dy-field > .bi:first-child {
    position: absolute; left: 1rem; top: 50%; transform: translateY(-50%);
    color: var(--dy-muted); pointer-events: none;
}
.dy-field .form-control { padding-left: 2.75rem; height: 3.1rem; border-radius: var(--dy-radius-input); }
.dy-field .form-control::placeholder { font-size: var(--dy-fs-sm); }
.dy-field .dy-field-action {
    position: absolute; right: .4rem; top: 50%; transform: translateY(-50%);
    border: 0; background: transparent; color: var(--dy-muted);
    width: 2.4rem; height: 2.4rem; border-radius: var(--dy-radius-input);
    transition: background-color var(--dy-duration) var(--dy-ease), color var(--dy-duration) var(--dy-ease);
}
.dy-field .dy-field-action:hover { background: var(--dy-accent-100); color: var(--dy-primary); }
.dy-field:has(.dy-field-action) .form-control { padding-right: 3.2rem; }

/* --------------------------------------------------------------------------
   Cards
   -------------------------------------------------------------------------- */

.card, .dy-card {
    background: var(--dy-surface);
    border: 0;
    border-radius: var(--dy-radius);
    box-shadow: var(--dy-shadow-sm);
    transition: transform var(--dy-duration) var(--dy-ease), box-shadow var(--dy-duration) var(--dy-ease);
}

.card > .card-header {
    background: transparent;
    border-bottom: 1px solid var(--dy-mist);
    padding: 1rem 1.25rem;
    border-radius: var(--dy-radius) var(--dy-radius) 0 0;
}

.card .card-title {
    font-size: var(--dy-fs-base);
    font-weight: var(--dy-fw-bold);
    color: var(--dy-green);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    margin: 0;
}

.dy-card-hover:hover { transform: translateY(-3px); box-shadow: var(--dy-shadow); }

/* White card on the gradient (login) */
.dy-auth-card {
    background: var(--dy-surface);
    color: var(--dy-text);
    border-radius: var(--dy-radius-lg);
    box-shadow: var(--dy-shadow-lg);
}

.dy-auth-wrap { width: 100%; max-width: 420px; margin-inline: auto; }
.dy-auth-card--logo { margin-top: 70px; }
.dy-auth-card--logo > .dy-logo-circle:first-child { margin-top: -48px; position: relative; }

/* Neutral notice inside a card (e.g. "Si ce compte existe…") */
.dy-notice {
    display: flex;
    gap: .75rem;
    align-items: flex-start;
    padding: .85rem 1rem;
    border-radius: var(--dy-radius);
    background: var(--dy-accent-100);
    color: var(--dy-primary);
    font-size: var(--dy-fs-sm);
    font-weight: var(--dy-fw-semibold);
}

.dy-notice .bi { font-size: var(--dy-fs-lg); line-height: 1.2; }

/* 6-digit code input */
.dy-code-input {
    letter-spacing: .6em;
    font-size: var(--dy-fs-xl) !important;
    font-weight: var(--dy-fw-bold);
    text-align: center;
    font-variant-numeric: tabular-nums;
    padding-left: 1rem !important;
}

/* KPI cards */
.dy-kpi {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1.15rem 1.25rem;
    height: 100%;
}

.dy-kpi-icon {
    width: 3.25rem; height: 3.25rem;
    border-radius: var(--dy-radius);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 1.5rem;
    flex-shrink: 0;
    color: #fff;
    background: var(--dy-gradient-kpi);
    box-shadow: 0 6px 14px rgba(4, 84, 94, .25);
}

.dy-kpi-icon--green { background: linear-gradient(135deg, var(--dy-green) 0%, #1F8A64 100%); }
.dy-kpi-icon--accent { background: linear-gradient(135deg, var(--dy-accent) 0%, #5CC2CE 100%); }
.dy-kpi-icon--deep { background: linear-gradient(135deg, var(--dy-primary-900) 0%, var(--dy-primary) 100%); }

.dy-kpi-body { min-width: 0; }

.dy-kpi-label {
    overflow-wrap: anywhere;
    font-size: var(--dy-fs-xs);
    font-weight: var(--dy-fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    color: var(--dy-muted);
}

.dy-kpi-value {
    font-size: var(--dy-fs-xl);
    font-weight: var(--dy-fw-bold);
    color: var(--dy-primary);
    line-height: 1.15;
    font-variant-numeric: tabular-nums;
}

.dy-kpi-unit { font-size: var(--dy-fs-sm); color: var(--dy-muted); font-weight: var(--dy-fw-semibold); }
.dy-kpi-hint { font-size: var(--dy-fs-xs); color: var(--dy-muted); }

/* --------------------------------------------------------------------------
   Tables: teal headers
   -------------------------------------------------------------------------- */

.table { --bs-table-hover-bg: var(--dy-accent-100); margin-bottom: 0; }

.table > thead th {
    background: var(--dy-primary);
    color: #fff;
    font-size: var(--dy-fs-xs);
    font-weight: var(--dy-fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    border: 0;
    padding: .8rem 1rem;
    white-space: nowrap;
}

.table > thead th:first-child { border-top-left-radius: var(--dy-radius-sm); }
.table > thead th:last-child { border-top-right-radius: var(--dy-radius-sm); }
.table > tbody td { padding: .75rem 1rem; border-color: var(--dy-mist); vertical-align: middle; }
.card .table > thead th:first-child, .card .table > thead th:last-child { border-radius: 0; }

/* Skeleton loaders */
.dy-skeleton {
    display: block;
    border-radius: var(--dy-radius-sm);
    background: linear-gradient(90deg, var(--dy-mist) 0%, #E8F0F0 40%, var(--dy-mist) 80%);
    background-size: 300% 100%;
    animation: dy-shimmer 1.2s ease-in-out infinite;
    min-height: 1rem;
}

.dy-skeleton--chart { height: 260px; border-radius: var(--dy-radius); }

@keyframes dy-shimmer {
    from { background-position: 100% 0; }
    to { background-position: 0 0; }
}

/* --------------------------------------------------------------------------
   Badges
   -------------------------------------------------------------------------- */

.badge { border-radius: var(--dy-radius-pill); font-weight: var(--dy-fw-semibold); padding: .4em .8em; }
.badge-dy-success { background: var(--dy-green-100); color: var(--dy-green); }
.badge-dy-info { background: var(--dy-accent-100); color: var(--dy-primary); }
.badge-dy-warning { background: var(--dy-warning-100); color: #7A5600; }
.badge-dy-danger { background: var(--dy-danger-100); color: var(--dy-danger); }

/* --------------------------------------------------------------------------
   Public receipt check (/v/{receipt_no})
   -------------------------------------------------------------------------- */

.dy-verdict {
    display: flex; flex-direction: column; align-items: center; gap: .35rem;
    padding: 1rem; margin-bottom: 1.25rem;
    border-radius: var(--dy-radius);
    font-weight: var(--dy-fw-bold); text-transform: uppercase; letter-spacing: var(--dy-tracking-title);
}
.dy-verdict-icon { font-size: var(--dy-fs-3xl); line-height: 1; }
.dy-verdict--valid { background: var(--dy-green-100); color: var(--dy-green); }
.dy-verdict--fake { background: var(--dy-danger-100); color: var(--dy-danger); }
.dy-verdict--cancelled { background: var(--dy-warning-100); color: #7A5600; }
.dy-verdict--unsynced,
.dy-verdict--unverifiable { background: var(--dy-accent-100); color: var(--dy-primary); }
.dy-verdict-label { font-size: var(--dy-fs-xl); }
.dy-receipt-facts { text-align: left; margin: 0; }
/* Two columns from small tablets up; one column on phones. */
@media (min-width: 576px) {
    .dy-receipt-facts { display: grid; grid-template-columns: max-content 1fr; column-gap: 1rem; align-items: baseline; }
}
.dy-receipt-facts dt { color: var(--dy-muted); font-weight: var(--dy-fw-semibold); font-size: var(--dy-fs-xs); text-transform: uppercase; }
.dy-receipt-facts dd { margin-bottom: .6rem; font-weight: var(--dy-fw-semibold); overflow-wrap: anywhere; }

/* --------------------------------------------------------------------------
   Admin layout (AdminLTE 4)
   -------------------------------------------------------------------------- */

body.dy-admin { background: var(--dy-bg); }
.dy-admin .app-main { background: var(--dy-bg); }

.dy-admin .app-header {
    background: var(--dy-surface);
    border-bottom: 0;
    box-shadow: var(--dy-shadow-sm);
}

.dy-admin .app-sidebar {
    background: var(--dy-gradient-sidebar) !important;
    border: 0;
    box-shadow: var(--dy-shadow);
}

.dy-admin .sidebar-brand {
    height: auto;
    padding: 1rem .75rem;
    border-bottom: 1px solid rgba(255, 255, 255, .12);
}

.dy-admin .sidebar-brand .brand-link {
    display: flex;
    align-items: center;
    gap: .75rem;
    text-decoration: none;
}

.dy-admin .brand-text {
    color: #fff;
    font-weight: var(--dy-fw-bold) !important;
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    line-height: 1.1;
}

/* Short brand name beside the logo: one line, never cut. The legal name stays in footers and receipts. */
.dy-brand-name {
    font-size: var(--dy-fs-lg);
    font-weight: var(--dy-fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    white-space: nowrap;
}

.dy-auth-brand {
    display: block;
    margin-top: .5rem;
    color: var(--dy-green);
}

.dy-admin .sidebar-menu .nav-header {
    color: rgba(255, 255, 255, .5);
    font-size: var(--dy-fs-xs);
    font-weight: var(--dy-fw-bold);
    letter-spacing: var(--dy-tracking-title);
    text-transform: uppercase;
}

.dy-admin .sidebar-menu .nav-link {
    color: rgba(255, 255, 255, .82);
    border-radius: var(--dy-radius-pill);
    margin: 2px .5rem;
    font-weight: var(--dy-fw-semibold);
    transition: background-color var(--dy-duration) var(--dy-ease), color var(--dy-duration) var(--dy-ease);
}

.dy-admin .sidebar-menu .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .1); }

.dy-admin .sidebar-menu .nav-link.active {
    color: var(--dy-primary) !important;
    background: #fff !important;
    box-shadow: var(--dy-shadow-sm);
}

.dy-admin .sidebar-menu .nav-link.active .nav-icon { color: var(--dy-accent); }

.dy-admin .app-content-header { padding-top: 1.5rem; }

.dy-page-title {
    font-size: var(--dy-fs-xl);
    font-weight: var(--dy-fw-bold);
    color: var(--dy-green);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    margin: 0;
}

.dy-admin .app-footer {
    background: transparent;
    border-top: 1px solid var(--dy-mist);
    color: var(--dy-muted);
    font-size: var(--dy-fs-sm);
}

.dy-user-chip {
    display: inline-flex; align-items: center; gap: .5rem;
    padding: .25rem .75rem .25rem .25rem;
    border-radius: var(--dy-radius-pill);
    background: var(--dy-bg);
    color: var(--dy-text);
    font-weight: var(--dy-fw-semibold);
}

.dy-user-chip .dy-avatar {
    width: 2rem; height: 2rem; border-radius: 50%;
    background: var(--dy-gradient-kpi); color: #fff;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: var(--dy-fs-sm); font-weight: var(--dy-fw-bold);
}

.dropdown-menu {
    border: 0;
    border-radius: var(--dy-radius);
    box-shadow: var(--dy-shadow-lg);
    padding: .5rem;
}

.dropdown-item { border-radius: var(--dy-radius-sm); }
.dropdown-item:active { background: var(--dy-primary); }

/* --------------------------------------------------------------------------
   Toasts and SweetAlert2
   -------------------------------------------------------------------------- */

.dy-toasts { z-index: 1090; }

.dy-toast {
    border: 0;
    border-radius: var(--dy-radius);
    box-shadow: var(--dy-shadow-lg);
    overflow: hidden;
    border-left: 5px solid var(--dy-accent);
}

.dy-toast--success { border-left-color: var(--dy-green); }
.dy-toast--error { border-left-color: var(--dy-danger); }
.dy-toast--warning { border-left-color: var(--dy-warning); }
.dy-toast .toast-body { display: flex; gap: .75rem; align-items: flex-start; font-weight: var(--dy-fw-semibold); }
.dy-toast--success .bi { color: var(--dy-green); }
.dy-toast--error .bi { color: var(--dy-danger); }
.dy-toast--warning .bi { color: var(--dy-warning); }
.dy-toast--info .bi { color: var(--dy-accent); }

.swal2-popup { font-family: var(--dy-font) !important; border-radius: var(--dy-radius-lg) !important; }
.swal2-title { color: var(--dy-green) !important; }
.swal2-actions .btn { margin: 0 .35rem; }

/* --------------------------------------------------------------------------
   Gradient pages (login, password reset, public receipt check)
   -------------------------------------------------------------------------- */

.dy-hero {
    min-height: 100vh;
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
}

.dy-hero-main {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 3rem 1rem;
}

.dy-hero-footer {
    text-align: center;
    padding: 1.25rem 1rem;
    color: rgba(255, 255, 255, .7);
    font-size: var(--dy-fs-sm);
}

.dy-gradient-bg a:not(.btn) { color: #fff; }
.dy-gradient-bg .dy-auth-card a:not(.btn) { color: var(--dy-accent); }
.dy-gradient-bg .dy-auth-card a:not(.btn):hover { color: var(--dy-primary); }

/* --------------------------------------------------------------------------
   List pages: filter bar, empty state, details, import preview
   -------------------------------------------------------------------------- */

/* Search and filters above a table: <form class="dy-filters"> */
.dy-filters {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    align-items: center;
    padding: .9rem 1.25rem;
    border-bottom: 1px solid var(--dy-mist);
}

.dy-filters > .dy-field, .dy-filters > .dy-filters-search { flex: 1 1 220px; min-width: 0; }
.dy-filters > .form-select { flex: 0 1 180px; width: auto; }
.dy-filters > .form-check { margin: 0 .25rem; }
.dy-filters .btn { flex-shrink: 0; }

/* "Nothing here yet" inside a card */
.dy-empty {
    text-align: center;
    padding: 2.5rem 1rem;
    color: var(--dy-muted);
}

.dy-empty .bi {
    display: block;
    font-size: var(--dy-fs-3xl);
    color: var(--dy-accent);
    margin-bottom: .5rem;
}

.dy-empty-title { font-weight: var(--dy-fw-bold); color: var(--dy-text); }

/* Label / value list on detail pages (client card) */
.dy-details { display: grid; grid-template-columns: minmax(8rem, 40%) 1fr; gap: .55rem 1rem; margin: 0; }
.dy-details dt { font-size: var(--dy-fs-xs); font-weight: var(--dy-fw-bold); text-transform: uppercase; letter-spacing: var(--dy-tracking-title); color: var(--dy-muted); padding-top: .15rem; }
.dy-details dd { margin: 0; font-weight: var(--dy-fw-semibold); overflow-wrap: anywhere; }

/* Monospace code (client code, serial) */
.dy-code { font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: var(--dy-fs-sm); font-weight: var(--dy-fw-semibold); color: var(--dy-primary); white-space: nowrap; }
a.dy-code { text-decoration: none; }
a.dy-code:hover { color: var(--dy-accent); }

/* Rôles & permissions matrix: module rows as group headers, first column stays visible when scrolling sideways. */
.dy-perm-matrix .dy-perm-module th {
    background: var(--dy-bg);
    color: var(--dy-green);
    font-weight: var(--dy-fw-bold);
    text-transform: uppercase;
    letter-spacing: var(--dy-tracking-title);
    font-size: var(--dy-fs-xs);
    padding: .5rem 1rem;
}
.dy-perm-matrix tbody td:first-child,
.dy-perm-matrix thead th:first-child {
    position: sticky;
    left: 0;
    z-index: 1;
    min-width: 11rem;
}
.dy-perm-matrix tbody td:first-child { background: var(--dy-surface); }
.dy-perm-matrix .form-check-input { width: 1.25rem; height: 1.25rem; margin: 0; }

/* Import preview: rows with errors */
.table > tbody > tr.dy-row--error > td { background: var(--dy-danger-100); }
.dy-row-errors { margin: 0; padding-left: 1rem; color: var(--dy-danger); font-size: var(--dy-fs-sm); font-weight: var(--dy-fw-semibold); }

/* Several small action buttons/forms in one table cell */
.dy-actions { display: inline-flex; flex-wrap: nowrap; gap: .35rem; justify-content: flex-end; }
.dy-actions form { display: inline; }

/* Inline select + button in a table cell (assign a prospecteur) */
.dy-inline-form { display: flex; gap: .35rem; align-items: center; }
.dy-inline-form .form-select { min-width: 10rem; }

/* Date fields in a filter bar */
.dy-filters > .dy-filter-date { flex: 0 1 160px; width: auto; }

/* --------------------------------------------------------------------------
   Finance screens: tabs, totals strip, receipt, dashboard bits
   -------------------------------------------------------------------------- */

/* Sub-pages of one screen (Caisse, Factures, Encaissements) */
.dy-tabs { display: flex; flex-wrap: wrap; gap: .4rem; margin-bottom: 1rem; }
.dy-tabs .btn { --bs-btn-padding-y: .4rem; --bs-btn-font-size: var(--dy-fs-sm); background: var(--dy-surface); color: var(--dy-primary); border: 1px solid var(--dy-mist); }
.dy-tabs .btn.active { background: var(--dy-primary); color: #fff; border-color: var(--dy-primary); }
.dy-tabs .badge { margin-left: .35rem; }

/* Totals of a filtered list, one figure per currency */
.dy-totals { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; padding: .75rem 1.25rem; border-bottom: 1px solid var(--dy-mist); background: var(--dy-accent-100); font-size: var(--dy-fs-sm); }
.dy-totals strong { color: var(--dy-primary); font-size: var(--dy-fs-base); }

/* Money cells: right-aligned, no wrapping; an écart is red (short) or orange (surplus) */
.dy-num { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.dy-gap-short { color: var(--dy-danger); font-weight: var(--dy-fw-bold); }
.dy-gap-over { color: #7A5600; font-weight: var(--dy-fw-bold); }

/* Receipt QR on the detail page */
.dy-qr { width: 100%; max-width: 220px; aspect-ratio: 1; border: 1px solid var(--dy-mist); border-radius: var(--dy-radius-sm); padding: .5rem; background: var(--dy-surface); }
.dy-qr-link { font-size: var(--dy-fs-xs); overflow-wrap: anywhere; color: var(--dy-muted); }

/* Small forms inside a table row (count cash, confirm) */
.dy-row-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(7.5rem, 1fr)); gap: .5rem; align-items: end; }
.dy-row-form .form-label { font-size: var(--dy-fs-xs); margin-bottom: .2rem; }

/* Control photo thumbnail */
.dy-thumb { width: 56px; height: 56px; object-fit: cover; border-radius: var(--dy-radius-sm); border: 1px solid var(--dy-mist); }

/* Dashboard: chart box, inline skeleton for figures */
.dy-chart { position: relative; height: 260px; width: 100%; min-width: 0; }
.dy-chart canvas { max-width: 100%; } /* lets Chart.js shrink when the window narrows */
.dy-skeleton--inline { display: inline-block; width: 5rem; height: 1.2rem; vertical-align: middle; }

/* SuperAdmin company filter in the header */
.dy-company-filter { display: flex; align-items: center; gap: .4rem; color: var(--dy-green); }
.dy-company-filter .form-select { min-width: 12rem; font-weight: var(--dy-fw-semibold); }

/* Count badge on a menu entry */
.dy-admin .sidebar-menu .nav-badge { float: right; margin-top: .1rem; }

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 575.98px) {
    .dy-kpi { padding: 1rem; gap: .6rem; flex-direction: column; align-items: flex-start; }
    .dy-kpi-label { letter-spacing: 0; }
    .dy-kpi-icon { width: 2.75rem; height: 2.75rem; font-size: 1.25rem; }
    .dy-kpi-value { font-size: var(--dy-fs-lg); }
    .dy-page-title { font-size: var(--dy-fs-lg); }
    .dy-logo-circle--lg { --dy-logo-size: 128px; }
    .dy-filters > .form-select { flex: 1 1 45%; }
    .dy-details { grid-template-columns: 1fr; gap: .1rem; }
    .dy-details dd { margin-bottom: .5rem; }
}
