/* =========================================
   BASE / LIGHT THEME
   ========================================= */
:root {
    color-scheme: light;
    scroll-behavior: smooth;
    --base-font-size: 16px;
    --font-roma: 'HelveticaNeueW0255Roma', Arial, sans-serif;
    --font-bold: 'HelveticaNeueW0275Bold', Arial, sans-serif;

    --border-radius: 6px;
    --hero-width: 1728px;
    --container-width: 1696px;

    --p-64: 64px;
    --p-32: 32px;
    --p-24: 24px;
    --p-16: 16px;

    /* Brand */
    --brand: #c30000;
    /*--brand: rgba(175, 0, 0, 1);*/
    --basalt-grey: #3c3c3c;
    --signal-grey: #878787;
    --medium-grey: #c8c8c8;
    --light-grey: #e1e1e1;

    /* Backgrounds */
    --backgrounds-page: #f6f6f6;
    --backgrounds-card-primary: #ffffff;
    --backgrounds-card-secondary: var(--light-grey);
    --backgrounds-card-footer: #111111;
    --backgrounds-brand: var(--brand);

    /* Text */
    --text-primary: var(--basalt-grey);
    --text-secondary: var(--signal-grey);
    --text-secondary-dark: rgba(60, 60, 60, 0.80);
    --text-secondary-light: var(--medium-grey);
    --text-brand: var(--brand);
    --text-primary-inverted: rgba(255, 255, 255, 0.9);

    /* Links */
    --text-link-primary: var(--brand);
    --text-link-primary-hover: #9c0000;
    --text-link-inverted: #ffffff;

    /* Button */
    --basalt-grey-button: #3c3c3c;

    /* Forms */
    --forms-input-bg: #ffffff;
    --forms-input-bg-active: #ffffff;
    --forms-input-border: var(--medium-grey);
    --forms-input-border-hover: var(--signal-grey);
    --forms-input-border-active: var(--basalt-grey);

    --text-link-primary-checkbox: #c30000;

    --text-breadcrumb: #616465;

    --pagination-red: #c30000;
    --pagination-active: #c30000;
    --pagination-hover: #ffffff;
    --pagination-disabled: #c6c5c5;
}

/* =========================================
   DARK THEME
   ========================================= */
:root.dark {
    color-scheme: dark;

    /*--basalt-grey: rgba(255, 255, 255, 0.9);*/

    --backgrounds-page: #111111;
    --backgrounds-card-primary: #252728;
    --backgrounds-card-secondary: #1f1f1f;
    --backgrounds-card-footer: #252728;
    --backgrounds-brand: rgba(175, 0, 0, 1);

    --text-primary: rgba(255, 255, 255, 0.90);
    --text-secondary: rgba(255, 255, 255, 0.70);
    --text-secondary-dark: rgba(255, 255, 255, 0.70);
    --text-secondary-light: rgba(255, 255, 255, 0.50);

    --text-brand: #ff4d4d;
    --text-link-primary: #ffffff;
    --text-link-primary-hover: rgba(255, 255, 255, 0.90);
    --text-link-inverted: var(--brand);

    --text-primary-inverted: var(--basalt-grey);

    /* Button */
    --basalt-grey-button: #3c3c3c;

    --forms-input-bg: var(--backgrounds-card-secondary);
    --forms-input-bg-active: var(--backgrounds-page);
    --forms-input-border: var(--basalt-grey);
    --forms-input-border-hover: #50504e;
    --forms-input-border-active: rgba(255, 255, 255, 0.70);

    --text-link-primary-checkbox: #c30000;

    --text-breadcrumb: #616465;

    --pagination-red: #c30000;
    --pagination-active: #ffffff;
    --pagination-hover: #ffffff;
    --pagination-disabled: rgba(255, 255, 255, 0.5);
}

.container {
    max-width: 1600px;
}

.content-spacing {
    padding: 32px 32px;
}

.p-64 {
    padding: 64px;
}