@import url("/static/theme.css");

:root {
    --base-gutter-x: 2rem;
    --base-gutter-y: 0.86rem;

    /* 📐 RADII CONFIGURATION (Sorted) */
    --button-radius-sm: var(--radius-sm);
    --button-radius-md: var(--radius-sm);
    --button-radius-lg: var(--radius-sm);

    /* 🎯 THE EQUAL HEIGHT FIXED ENGINE: Shared structural rules */
    --button-line-height: 1.2;

    /* 📏 SIZING CONFIGURATION (Manages how big/small things are) */
    /* Small elements scaling */
    --button-padding-y-sm: var(--spacing-xxs);
    --button-padding-x-sm: var(--spacing-xs);
    --button-font-size-sm: var(--font-size-xs);

    /* Medium/Default elements scaling */
    --button-padding-y-md: var(--spacing-xs);
    --button-padding-x-md: var(--spacing-sm);
    --button-font-size-md: var(--font-size-sm);

    /* Large elements scaling */
    --button-padding-y-lg: var(--spacing-sm);
    --button-padding-x-lg: var(--spacing-md);
    --button-font-size-lg: var(--font-size-md);

    --color-brand-primary: #336791;
    --color-brand-primary-hover: #274e6f;
    --color-brand-primary-subtle: #475569;
    --color-brand-primary-container: #e1edf4;
    --color-on-primary: #ffffff;

    --color-inverse-primary: #4fa3e3;
    --color-on-inverse-primary: #002331;

    --color-brand-secondary: #002331;
    --color-brand-secondary-hover: #00141c;
    --color-brand-secondary-container: #e1edf4;
    --color-on-secondary: #ffffff;

    --color-bg-light: #f4f7fa;
    --color-bg-dark: #0f172a;
    --color-bg-disabled: #f1f5f9;

    --color-text-main: #1e293b;
    --color-text-muted: #475569;
    --color-text-disabled: #94a3b8;
    --color-text-white: #ffffff;
    --color-text-light: #e1edf4;

    --color-border-light: #cbd5e1;
    --color-border-gray: #e2e8f0;
    --color-border-dark: #475569;

    --color-success: #16a34a;
    --color-success-container: #f0fdf4;
    --color-on-success-container: #14532d;
    --color-on-success: #ffffff;

    --color-info: #0059b3;
    --color-info-container: #e1edf4;
    --color-on-info-container: #004080;
    --color-on-info: #ffffff;

    --color-error: #dc2626;
    --color-error-container: #fef2f2;
    --color-on-error-container: #7f1d1d;
    --color-on-error: #ffffff;
}
