@font-face {
    font-family: 'Hanken Grotesk';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url("../fonts/hanken-grotesk/hanken-grotesk-latin-400-normal-S8a3DSU.woff2") format('woff2');
}
@font-face {
    font-family: 'Hanken Grotesk';
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    src: url("../fonts/hanken-grotesk/hanken-grotesk-latin-500-normal-o7JQj4V.woff2") format('woff2');
}
@font-face {
    font-family: 'Hanken Grotesk';
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    src: url("../fonts/hanken-grotesk/hanken-grotesk-latin-600-normal-E9aAr-L.woff2") format('woff2');
}
@font-face {
    font-family: 'Hanken Grotesk';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url("../fonts/hanken-grotesk/hanken-grotesk-latin-700-normal-CdaWVAJ.woff2") format('woff2');
}

/* ── no radius, no shadows anywhere ── */
*, *::before, *::after {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* ════════════════════════════════════
   LIGHT MODE
════════════════════════════════════ */
:root {
    /* primary color → black */
    --bs-primary: #000;
    --bs-primary-rgb: 0, 0, 0;
    --bs-link-color: #000;
    --bs-link-color-rgb: 0, 0, 0;
    --bs-link-hover-color: #333;

    /* font */
    --bs-body-font-family: 'Hanken Grotesk', sans-serif;
    --bs-font-sans-serif: 'Hanken Grotesk', sans-serif;

    /* radius */
    --border-radius: 0;
    --border-radius-sm: 0;
    --border-radius-lg: 0;
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-border-radius-xl: 0;
    --bs-border-radius-2xl: 0;
    --bs-border-radius-pill: 0;
    --bs-btn-border-radius: 0;
    --bs-modal-border-radius: 0;
    --bs-modal-inner-border-radius: 0;
    --bs-popover-border-radius: 0;
    --bs-tooltip-border-radius: 0;
    --bs-nav-tabs-border-radius: 0;

    /* shadows */
    --shadow-md: none;
    --shadow-lg: none;
    --shadow-xl: none;
    --box-shadow-lg: none;
    --bs-box-shadow-sm: none;
    --form-input-shadow: none;
    --form-input-hover-shadow: none;
    --form-input-error-shadow: none;
    --sidebar-menu-compact-hover-box-shadow: none;
    --bs-modal-box-shadow: none;
    --bs-pagination-focus-box-shadow: none;
    --dropdown-settings-active-item-shadow: none;
    --popover-shadow: none;

    /* backgrounds */
    --body-bg: #fff;
    --bs-body-bg: #fff;
    --content-bg: #fff;
    --content-panel-bg: #fff;
    --secondary-bg: #fff;
    --tertiary-bg: #f5f5f5;
    --primary-bg: #fff;
    --bs-tertiary-bg: #f5f5f5;
    --bs-secondary-bg: #fff;
    --fieldset-bg: #fff;
    --modal-bg: #fff;
    --modal-header-bg: #fff;
    --modal-footer-bg: #fff;
    --bs-modal-bg: #fff;
    --dropdown-bg: #fff;
    --dropdown-toggle-bg: #fff;
    --form-control-bg: #fff;
    --form-input-group-text-bg: #fff;
    --bs-table-bg: #fff;

    /* borders → black */
    --border-color: #000;
    --border-primary-color: #000;
    --border-secondary-color: #000;
    --border-tertiary-color: #000;
    --bs-border-color: #000;
    --content-section-border-color: #000;
    --content-top-border-color: #000;
    --sidebar-border-color: #000;
    --table-cell-border-color: #000;
    --bs-table-border-color: #000;
    --modal-border-color: #000;
    --modal-header-border-color: #000;
    --bs-modal-border-color: #000;
    --bs-modal-footer-border-color: #000;
    --bs-modal-header-border-color: #000;
    --dropdown-border-color: #000;
    --dropdown-toggle-border-color: #000;
    --dropdown-toggle-hover-border-color: #000;
    --form-input-border-color: #000;
    --form-input-hover-border-color: #000;
    --form-fieldset-border-color: #000;
    --form-fieldset-header-border-color: #000;
    --form-tabs-border-color: #000;
    --bs-nav-tabs-border-color: #000;
    --bs-nav-tabs-link-hover-border-color: #000;
    --datalist-border-color: #000;
    --responsive-header-border-color: #000;
    --responsive-table-row-border-color: #000;
    --bs-pagination-border-color: #000;
    --bs-pagination-hover-border-color: #000;
    --bs-pagination-disabled-border-color: #000;
    --button-border-color: #000;
    --button-hover-border-color: #000;
    --button-active-border-color: #000;
    --button-secondary-border-color: #000;
    --button-secondary-hover-border-color: #000;
    --button-secondary-active-border-color: #000;
    --button-invisible-border-color: #000;
    --button-invisible-hover-border-color: #000;
    --button-invisible-active-border-color: #000;
    --form-switch-border-color: #000;
    --form-type-check-input-border-color: #000;

    /* text → black (keep alert/status colors untouched) */
    --text-color: #000;
    --text-color-dark: #000;
    --text-color-light: #000;
    --text-muted: #000;
    --text-secondary-color: #000;
    --text-tertiary-color: #000;
    --bs-body-color: #000;
    --bs-secondary-color: #000;
    --bs-tertiary-color: #000;
    --bs-emphasis-color: #000;
    --bs-heading-color: #000;
    --table-cell-color: #000;
    --table-thead-color: #000;
    --datalist-label-color: #000;
    --datalist-value-color: #000;
    --form-label-color: #000;
    --form-fieldset-header-color: #000;
    --form-column-header-color: #000;
    --form-help-color: #000;
    --form-help-active-color: #000;
    --form-column-help-color: #000;
    --form-input-text-color: #000;
    --form-fieldset-help-color: #000;
    --form-fieldset-collapse-marker-color: #000;
    --form-column-icon-color: #000;
    --form-fieldset-icon-color: #000;
    --dropdown-color: #000;
    --dropdown-link-color: #000;
    --dropdown-icon-color: #000;
    --responsive-table-label-color: #000;
    --user-name-color: #000;
    --link-color: #000;
    --link-hover-color: #000;
    --bs-link-color-rgb: 0, 0, 0;
    --bs-link-hover-color-rgb: 0, 0, 0;

    /* sidebar → white bg, black text */
    --sidebar-bg: #fff;
    --sidebar-logo-color: #000;
    --sidebar-menu-color: #000;
    --sidebar-menu-icon-color: #000;
    --sidebar-menu-header-color: #000;
    --sidebar-menu-submenu-color: #000;
    --sidebar-menu-active-item-bg: #000;
    --sidebar-menu-active-item-color: #fff;
    --responsive-header-bg: #fff;
    --responsive-header-logo-color: #000;

    /* buttons → keep default bg but square */
    --button-bg: #fff;
    --button-color: #000;
    --button-icon-color: #000;
    --button-hover-bg: #f0f0f0;
    --button-hover-color: #000;
    --button-active-bg: #e0e0e0;
    --button-active-color: #000;
    --button-secondary-bg: #fff;
    --button-secondary-color: #000;
    --button-secondary-icon-color: #000;
    --button-invisible-bg: transparent;
    --button-invisible-color: #000;
    --button-invisible-icon-color: #000;
    --button-invisible-hover-bg: #f0f0f0;
    --button-invisible-hover-color: #000;
    --button-primary-bg: #000;
    --button-primary-color: #fff;
    --button-primary-border-color: #000;
    --button-primary-hover-bg: #333;
    --button-primary-hover-color: #fff;
    --button-primary-icon-color: #fff;

    /* misc */
    --content-search-icon-color: #000;
    --user-avatar-icon-color: #000;
    --user-avatar-icon-bg: #e0e0e0;
    --pagination-color: #000;
    --bs-pagination-color: #000;
    --bs-pagination-bg: #fff;
    --bs-pagination-hover-bg: #f0f0f0;
    --bs-pagination-hover-color: #000;
    --bs-pagination-disabled-bg: #fff;
    --bs-pagination-disabled-color: #999;
    --table-hover-cell-bg: #f5f5f5;
}

body {
    background-color: #fff;
    color: #000;
    font-family: 'Hanken Grotesk', sans-serif;
}

/* cards — light */
:root {
    --bs-card-border-color: #000;
    --bs-card-cap-bg: #fff;
    --bs-card-cap-color: #000;
    --bs-card-bg: #fff;
    --bs-card-color: #000;
    --bs-card-title-color: #000;
    --bs-card-subtitle-color: #000;
    --bs-card-box-shadow: none;
    --bs-card-border-radius: 0;
    --bs-card-inner-border-radius: 0;
}

.card {
    border: 1px solid #000 !important;
    background-color: #fff !important;
}

.card-header,
.card-footer {
    background-color: #fff !important;
    border-color: #000 !important;
    color: #000 !important;
}

/* cards — dark */
[data-bs-theme="dark"] {
    --bs-card-border-color: #fff;
    --bs-card-cap-bg: #000;
    --bs-card-cap-color: #fff;
    --bs-card-bg: #000;
    --bs-card-color: #fff;
    --bs-card-title-color: #fff;
    --bs-card-subtitle-color: #fff;
}

[data-bs-theme="dark"] .card {
    border: 1px solid #fff !important;
    background-color: #000 !important;
}

[data-bs-theme="dark"] .card-header,
[data-bs-theme="dark"] .card-footer {
    background-color: #000 !important;
    border-color: #fff !important;
    color: #fff !important;
}

* {
    font-family: 'Hanken Grotesk', sans-serif;
}

/* btn-primary — light */
.btn-primary {
    --bs-btn-bg: #000;
    --bs-btn-border-color: #000;
    --bs-btn-color: #fff;
    --bs-btn-hover-bg: #333;
    --bs-btn-hover-border-color: #333;
    --bs-btn-hover-color: #fff;
    --bs-btn-active-bg: #333;
    --bs-btn-active-border-color: #333;
    --bs-btn-active-color: #fff;
}

/* btn-primary — dark */
[data-bs-theme="dark"] .btn-primary {
    --bs-btn-bg: #fff;
    --bs-btn-border-color: #fff;
    --bs-btn-color: #000;
    --bs-btn-hover-bg: #ccc;
    --bs-btn-hover-border-color: #ccc;
    --bs-btn-hover-color: #000;
    --bs-btn-active-bg: #ccc;
    --bs-btn-active-border-color: #ccc;
    --bs-btn-active-color: #000;
}

/* ════════════════════════════════════
   DARK MODE
════════════════════════════════════ */
[data-bs-theme="dark"] {
    /* backgrounds → black */
    --body-bg: #000;
    --bs-body-bg: #000;
    --content-bg: #000;
    --content-panel-bg: #000;
    --secondary-bg: #000;
    --tertiary-bg: #111;
    --primary-bg: #000;
    --bs-tertiary-bg: #111;
    --bs-secondary-bg: #000;
    --fieldset-bg: #000;
    --modal-bg: #000;
    --modal-header-bg: #000;
    --modal-footer-bg: #000;
    --bs-modal-bg: #000;
    --dropdown-bg: #000;
    --dropdown-toggle-bg: #000;
    --form-control-bg: #000;
    --form-control-disabled-bg: #111;
    --form-input-group-text-bg: #000;
    --bs-table-bg: #000;
    --sidebar-bg: #000;
    --responsive-header-bg: #000;
    --table-hover-cell-bg: #111;
    --button-bg: #000;
    --button-hover-bg: #222;
    --button-active-bg: #333;
    --button-secondary-bg: #000;
    --button-invisible-hover-bg: #222;
    --user-avatar-icon-bg: #333;

    /* borders → white */
    --border-color: #fff;
    --border-primary-color: #fff;
    --border-secondary-color: #fff;
    --border-tertiary-color: #fff;
    --bs-border-color: #fff;
    --content-section-border-color: #fff;
    --content-top-border-color: #fff;
    --sidebar-border-color: #fff;
    --table-cell-border-color: #fff;
    --bs-table-border-color: #fff;
    --modal-border-color: #fff;
    --modal-header-border-color: #fff;
    --bs-modal-border-color: #fff;
    --bs-modal-footer-border-color: #fff;
    --bs-modal-header-border-color: #fff;
    --dropdown-border-color: #fff;
    --dropdown-toggle-border-color: #fff;
    --dropdown-toggle-hover-border-color: #fff;
    --form-input-border-color: #fff;
    --form-input-hover-border-color: #fff;
    --form-fieldset-border-color: #fff;
    --form-fieldset-header-border-color: #fff;
    --form-tabs-border-color: #fff;
    --bs-nav-tabs-border-color: #fff;
    --datalist-border-color: #fff;
    --responsive-header-border-color: #fff;
    --responsive-table-row-border-color: #fff;
    --bs-pagination-border-color: #fff;
    --bs-pagination-hover-border-color: #fff;
    --button-border-color: #fff;
    --button-hover-border-color: #fff;
    --button-active-border-color: #fff;
    --button-secondary-border-color: #fff;
    --button-secondary-hover-border-color: #fff;
    --button-invisible-border-color: transparent;
    --button-invisible-hover-border-color: #fff;
    --form-switch-border-color: #fff;
    --form-type-check-input-border-color: #fff;

    /* text → white */
    --text-color: #fff;
    --text-color-dark: #fff;
    --text-color-light: #fff;
    --text-muted: #fff;
    --text-secondary-color: #fff;
    --text-tertiary-color: #fff;
    --bs-body-color: #fff;
    --bs-secondary-color: #fff;
    --bs-tertiary-color: #fff;
    --bs-emphasis-color: #fff;
    --bs-heading-color: #fff;
    --table-cell-color: #fff;
    --table-thead-color: #fff;
    --datalist-label-color: #fff;
    --datalist-value-color: #fff;
    --form-label-color: #fff;
    --form-fieldset-header-color: #fff;
    --form-column-header-color: #fff;
    --form-help-color: #fff;
    --form-help-active-color: #fff;
    --form-column-help-color: #fff;
    --form-input-text-color: #fff;
    --form-fieldset-help-color: #fff;
    --form-fieldset-collapse-marker-color: #fff;
    --form-column-icon-color: #fff;
    --form-fieldset-icon-color: #fff;
    --dropdown-color: #fff;
    --dropdown-link-color: #fff;
    --dropdown-icon-color: #fff;
    --responsive-table-label-color: #fff;
    --user-name-color: #fff;
    --link-color: #fff;
    --link-hover-color: #ccc;
    --bs-link-color-rgb: 255, 255, 255;
    --bs-link-hover-color-rgb: 204, 204, 204;
    --sidebar-logo-color: #fff;
    --sidebar-menu-color: #fff;
    --sidebar-menu-icon-color: #fff;
    --sidebar-menu-header-color: #fff;
    --sidebar-menu-submenu-color: #fff;
    --sidebar-menu-active-item-bg: #fff;
    --sidebar-menu-active-item-color: #000;
    --responsive-header-logo-color: #fff;
    --content-search-icon-color: #fff;
    --user-avatar-icon-color: #fff;
    --button-color: #fff;
    --button-icon-color: #fff;
    --button-hover-color: #fff;
    --button-active-color: #fff;
    --button-secondary-color: #fff;
    --button-secondary-icon-color: #fff;
    --button-invisible-color: #fff;
    --button-invisible-icon-color: #fff;
    --button-invisible-hover-color: #fff;
    --button-primary-bg: #fff;
    --button-primary-color: #000;
    --button-primary-border-color: #fff;
    --button-primary-hover-bg: #ccc;
    --button-primary-hover-color: #000;
    --button-primary-icon-color: #000;
    --pagination-color: #fff;
    --bs-pagination-color: #fff;
    --bs-pagination-bg: #000;
    --bs-pagination-hover-bg: #222;
    --bs-pagination-hover-color: #fff;
    --bs-pagination-disabled-bg: #000;
    --bs-pagination-disabled-color: #666;
    --table-hover-cell-bg: #111;
}

[data-bs-theme="dark"] body {
    background-color: #000;
    color: #fff;
}