/* ARIM admin theme: light sidebar, neutral page background, a single emerald accent.
   Mostly overrides of the EasyAdmin CSS variables (see easyadmin-theme/variables-theme.css),
   plus a few targeted rules where no variable exists. */

:root {
    /* Fills and decorations (no text on top, or large icons only) */
    --arim-accent: #059669;
    /* Text, links and backgrounds carrying white text (AA contrast on white) */
    --arim-accent-strong: #047857;
    --arim-accent-stronger: #065f46;
    --arim-accent-soft: #ecfdf5;
    --arim-accent-ring: rgba(5, 150, 105, 0.22);
    --arim-page: #f6f7f9;
    --arim-surface: #fff;
    --arim-surface-muted: #f9fafb;
    --arim-card-shadow: 0 0 0 1px var(--gray-200), 0 1px 2px rgba(15, 23, 42, 0.05);

    --border-radius: 8px;

    --color-primary: var(--arim-accent-strong);
    --link-color: var(--arim-accent-strong);
    --link-color-rgb: 4, 120, 87;
    --link-hover-color: var(--arim-accent-stronger);
    --link-hover-color-rgb: 6, 95, 70;

    --body-bg: var(--arim-page);
    --responsive-header-bg: var(--arim-surface);
    --sidebar-bg: var(--arim-surface);
    --sidebar-menu-active-item-bg: var(--arim-accent-soft);
    --sidebar-menu-active-item-color: var(--arim-accent-strong);
    --sidebar-menu-badge-bg: var(--emerald-100);
    --resize-handler-hover-bg: var(--arim-accent);
    --content-search-input-bg: var(--arim-surface);
    --dropdown-settings-active-item-shadow: inset 0 0 0 1px var(--arim-accent-ring);

    --table-hover-cell-bg: var(--arim-accent-soft);
    --table-selected-cell-bg: var(--emerald-100);

    --modal-header-bg: var(--arim-surface);
    --form-switch-bg: var(--arim-surface);
    --form-switch-checked-bg: var(--arim-accent);
    --form-type-check-input-checked-bg: var(--arim-accent);

    --badge-primary-bg: var(--emerald-100);
    --badge-primary-color: var(--emerald-800);
    --alert-primary-bg: var(--emerald-50);
    --alert-primary-color: var(--emerald-900);
    --alert-primary-border-color: var(--emerald-200);

    --button-focus-outline-color: var(--arim-accent);
    --button-primary-bg: var(--arim-accent-strong);
    --button-primary-hover-bg: var(--arim-accent-stronger);
    --button-primary-active-bg: var(--emerald-900);

    --page-login-bg: var(--arim-page);
}

.ea-dark-scheme {
    --arim-accent: #10b981;
    --arim-accent-strong: #34d399;
    --arim-accent-stronger: #6ee7b7;
    --arim-accent-soft: rgba(52, 211, 153, 0.12);
    --arim-accent-ring: rgba(52, 211, 153, 0.3);
    --arim-page: var(--true-gray-950);
    --arim-surface: var(--true-gray-900);
    --arim-surface-muted: var(--true-gray-900);
    --arim-card-shadow: 0 0 0 1px var(--true-gray-800);

    --color-primary: var(--arim-accent-strong);
    --link-color: var(--arim-accent-strong);
    --link-color-rgb: 52, 211, 153;
    --link-hover-color: var(--arim-accent-stronger);
    --link-hover-color-rgb: 110, 231, 183;

    --sidebar-menu-active-item-bg: var(--arim-accent-soft);
    --sidebar-menu-active-item-color: var(--arim-accent-strong);
    --sidebar-menu-badge-bg: var(--arim-accent-soft);
    --sidebar-menu-badge-active-bg: var(--emerald-700);
    --resize-handler-hover-bg: var(--arim-accent);
    --dropdown-settings-active-item-shadow: inset 0 0 0 1px var(--arim-accent-ring);

    --table-hover-cell-bg: var(--true-gray-800);
    --table-selected-cell-bg: rgba(52, 211, 153, 0.18);
    --pagination-active-bg: var(--emerald-700);

    --form-switch-checked-bg: var(--emerald-600);
    --form-type-check-input-checked-bg: var(--emerald-600);

    --badge-boolean-true-bg: var(--emerald-700);
    --badge-primary-bg: var(--arim-accent-soft);
    --badge-primary-box-shadow: inset 0 0 0 1px var(--arim-accent-ring);
    --badge-primary-color: var(--arim-accent-strong);
    --alert-primary-bg: var(--arim-accent-soft);
    --alert-primary-color: var(--emerald-200);
    --alert-primary-border-color: var(--arim-accent-ring);

    --button-focus-outline-color: var(--arim-accent);
    --button-primary-bg: var(--emerald-700);
    --button-primary-hover-bg: var(--emerald-600);
    --button-primary-active-bg: var(--emerald-800);
    --page-login-form-control-button-bg: var(--emerald-700);
}

/* Sidebar: white on a gray page, so it needs its own edge */
@media (min-width: 992px) {
    .sidebar {
        border-inline-end: 1px solid var(--sidebar-border-color);
    }
}

.main-header #header-logo .logo {
    font-weight: 700;
    letter-spacing: 0.02em;
}

/* Mosquito pictogram (Font Awesome "mosquito") in front of the application name */
.main-header #header-logo .logo::before {
    color: var(--arim-accent);
    content: "\e52b";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    margin-inline-end: 0.4rem;
}

/* Index page: the datagrid sits in a white card */
@media (min-width: 768px) {
    table.datagrid {
        --bs-table-bg: transparent;
        background: var(--arim-surface);
        border-collapse: separate;
        border-radius: var(--border-radius);
        box-shadow: var(--arim-card-shadow);
    }

    .datagrid thead th {
        background: var(--arim-surface-muted);
    }

    .datagrid thead th:first-child {
        border-start-start-radius: var(--border-radius);
    }

    .datagrid thead th:last-child {
        border-start-end-radius: var(--border-radius);
    }

    .datagrid tbody tr:last-child td:first-child {
        border-end-start-radius: var(--border-radius);
    }

    .datagrid tbody tr:last-child td:last-child {
        border-end-end-radius: var(--border-radius);
    }

    .datagrid thead th:first-child > *,
    .datagrid td:first-child {
        padding-inline-start: 14px;
    }
}

/* Forms: fieldsets as white cards, emerald focus ring */
.form-fieldset {
    background: var(--arim-surface);
    border-radius: var(--border-radius);
    box-shadow: var(--arim-card-shadow);
    padding: 20px 20px 5px;
}

.form-column .form-fieldset {
    padding: 0;
}

.form-widget input.form-control:focus,
.form-widget textarea.form-control:focus,
.form-widget .form-select:focus,
.form-widget input.form-check-input:focus,
.content-search-input:focus {
    border-color: var(--arim-accent);
    box-shadow: 0 0 0 3px var(--arim-accent-ring);
}

/* Login page */
.login-wrapper .content {
    border-radius: 12px;
    box-shadow: var(--arim-card-shadow), var(--shadow-lg);
}

.login-wrapper .main-header #header-logo .logo {
    color: var(--text-color);
    font-size: var(--font-size-xxl);
}