@theme {
    /** Typography */
    --color-typography: var( --color-gray-800 );
    --color-fontcolor: var( --color-gray-300 );
    --color-fontcolor-soft: var( --color-gray-400 );
    --color-fontcolor-hard: rgb( 107 114 128 );

    /** Surfaces */
    --color-surface: var( --color-gray-900 );
    --color-aside-background: var( --color-gray-900 );
    --color-aside-color: var( --color-fontcolor );
    --color-aside-menu-background: var( --color-gray-900 );
    --color-aside-menu-background-hover: var( --color-gray-900 );
    --color-aside-submenu-background: var( --color-gray-800 );
    --color-aside-submenu-background-hover: var( --color-gray-700 );
    --color-soft-primary: rgb( 75 85 99 );
    --color-soft-secondary: rgb( 107 114 128 );
    --color-soft-tertiary: rgb( 156 163 175 );
    --color-surface-soft: rgb( 229 231 235 );
    --color-surface-hard: rgb( 250 250 250 );
    --color-popup-surface: var( --color-gray-700 );
    
    /** Button */
    --color-button-hover: rgb( 203 213 225 );
    --color-button-active: rgb( 203 213 225 );
    
    /** Input */
    --color-input-background: var( --color-gray-800 );
    --color-input-disabled: var( --color-gray-700 );
    --color-input-button: var( --color-gray-700 );
    --color-input-button-hover: var( --color-gray-600 );
    --color-input-button-active: var( --color-gray-600 );
    --color-input-option-hover: rgb( 107 114 128 );
    --color-input-edge: var( --color-gray-900 );

    /** Box */
    --color-box-edge: var(--color-gray-800 );
    --color-box-background: var( --color-gray-700 );
    --color-box-elevation-background: var( --color-gray-600 );
    --color-box-elevation-edge: var( --color-gray-700 );
    --color-box-elevation-hover: var( --color-gray-500 );

    /** CRUD */
    --color-crud-button-edge: var( --color-gray-800 );
    --color-crud-input-background: rgb( 209 213 219 );

    /** POS */
    --color-pos-button-edge: var( --color-gray-800 );

    /** Numpad */
    --color-numpad-background: var( --color-gray-300 );
    --color-numpad-typography: rgb( 55 65 81 );
    --color-numpad-edge: var( --color-gray-800 );
    --color-numpad-hover: var( --color-gray-200 );
    --color-numpad-hover-edge: rgb( 209 213 219 );

    /** Option */
    --color-option-hover: rgb( 107 114 128 );

    /** Scroll */
    --color-scroll-thumb: rgb( 55 65 81 );
    --color-scroll-track: rgb( 0 0 0 );
    --color-scroll-popup-thumb: rgb( 55 65 81 );

    /** Pre */
    --color-pre: rgb( 107 114 128 );

    /** Tabs */
    --color-tab-active: var( --color-gray-700 );
    --color-tab-active-border: var( --color-gray-700 );
    --color-tab-inactive: var( --color-gray-800 );
    --color-tab-table-th: var( --color-gray-800 );
    --color-tab-table-th-edge: var( --color-gray-800 );

    /** Table */
    --color-table-th: var( --color-gray-600 );
    --color-table-th-edge: var( --color-gray-800 );

    /** Floating Menu */
    --color-floating-menu: var( --color-gray-600 );
    --color-floating-menu-hover: var( --color-gray-500 );
    --color-floating-menu-selected: var( --color-gray-600 );
    --color-floating-menu-edge: var( --color-gray-600 );

    /** Base Accent */
    --color-primary: var( --color-teal-500 );
    --color-secondary: var( --color-teal-600 );
    --color-tertiary: var( --color-teal-700 );

    /** Error */
    --color-error-primary: var( --color-red-400 );
    --color-error-secondary: var( --color-red-500 );
    --color-error-tertiary: var( --color-red-600 );

    /** Info */
    --color-info-primary: var( --color-blue-400 );
    --color-info-secondary: var( --color-blue-500 );
    --color-info-tertiary: var( --color-blue-600 );

    /** Success */
    --color-success-primary: var( --color-green-400 );
    --color-success-secondary: var( --color-green-500);
    --color-success-tertiary: var( --color-green-600 );

    /** Warning */
    --color-warning-primary: var( --color-orange-200);
    --color-warning-secondary: var( --color-orange-400);
    --color-warning-tertiary: var( --color-orange-600);

    /** Default **/
    --color-default-primary: var( --color-gray-200 );
    --color-default-secondary: var( --color-gray-300 );
    --color-default-tertiary: var( --color-gray-400 );
}