@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: #514064;
    --color-brand-primary-hover: #634F75;
    --color-brand-primary-subtle: #8B7B99;
    --color-brand-primary-container: #F3F2F5;
    --color-on-primary: #FFFFFF;

    --color-inverse-primary: #D4779D;
    --color-on-inverse-primary: #FFFFFF;

    /* --color-secondary: #F3F2F5; */
    /* --color-on-secondary: #514064;; */
    --color-brand-secondary: #514064;
    --color-brand-secondary-hover: #E9E6EC;
    --color-brand-secondary-container: #EAE6ED;
    --color-on-secondary: #F3F2F5;

    --color-brand-accent: #D4779D;
    --color-brand-accent-hover: #C7658D;
    --color-brand-accent-container: #F4E4EB;
    --color-on-accent: #FFFFFF;

    --color-bg-light: #FFFFFF;
    --color-bg-dark: #392D47;
    --color-bg-disabled: #E3E1E7;

    --color-text-main: #29272D;
    --color-text-muted: #6F6B74;
    --color-text-disabled: #99969F;
    --color-text-white: #FFFFFF;
    --color-text-light: #F5F3F6;

    --color-border-light: #E3E1E7;
    --color-border-gray: #D4D1D7;
    --color-border-dark: #514064;
    --color-border-subtle: #E8E6EB;

    --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-warning: #B9823B;
    --color-warning-container: #FBF2E3;
    --color-on-warning-container: #805A25;
    --color-on-warning: #FFFFFF;

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

    --color-shadow-default: #29272D;
}