:root[theme='escuro'] {
    /* --- Globais e Tipografia --- */
    --font-size: 13px;
    --font-family: 'Inter', 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Paleta (Dark Estilo Otimizado) */
    --main-color: #fd9203; /* laranja principal */

    --text-color-strong: #e2e8f0;   /* texto forte */
    --text-color: #cbd5e1;          /* texto normal */
    --text-color-light: #94a3b8;    /* texto secundário */

    /* Estrutura */
    --template-border-color: #2d3648;   /* borda azul grafite */
    --scrollbar-color: #334155;

    /* Fundos */
    --live-background-color: #0f172a;   /* fundo global */

    /* Header */
    --header-height: 56px;
    --header-background-color: #0f172a;
    --header-border-bottom: var(--template-border-color);
    --header-logo-background: #0f172a;
    --header-logo-border-right: var(--template-border-color);
    --header-logo-border-bottom: var(--template-border-color);
    --header-track-border-right: var(--template-border-color);
    --header-logo-font-size: 18px;
    --header-text-color: #94a3b8;

    --header-box-display: none;
    --header-box-width: 56px;
    --header-box-background: transparent;
    --header-box-shadow: none;

    /* Buttons - MELHORADO */
    --button-height: 36px;
    --button-border: #334155;
    --button-text-color: #cbd5e1;
    --button-text-color-hover: #fd9203;
    --button-background: #2d3748; /* mais destacado que antes */
    --button-border-radius: 6px;
    --button-padding: 12px;
    --button-box-shadow: none;

    /* Menu */
    --menu-width: 250px;
    --menu-background-color: #0f172a;
    --menu-master-color-strong: #e2e8f0;
    --menu-border-right: #2d3648;
    --menu-icon-font-size: 15px;

    --menu-background-check: #fd9203;
    --menu-check-color: #0f172a;
    --menu-button-border-color: #2d3648;
    --menu-box-shadow: none;

    --menu-user-splash-background: #0f172a;
    --menu-background-button-circle: #0f172a;

    /* Submenu */
    --submenu-background-color: #0f172a;
    --submenu-border-right: #2d3648;
    --submenu-text-color: #e2e8f0;
    --submenu-sub-text-color: #64748b;
    --submenu-text-hover: #fd9203;
    --submenu-background-check: #fd9203;
    --submenu-check-color: #fff;

    --submenu-font-size: 13px;
    --submenu-padding-horizontal: 0px;
    --submenu-item-padding-horizontal: 16px;
    --submenu-item-padding-vertical: 8px;

    /* Top Menu */
    --top-menu-border: #2d3648;
    --top-menu-background-color: #0f172a;
    --top-menu-background-button-circle: #0f172a;
    --top-menu-background-check: #fd9203;
    --top-menu-check-color: #fff;
    --top-menu-hover-color: #fd9203;
    --top-menu-color: #cbd5e1;

    /* Top Submenu */
    --top-submenu-background-color: #0f172a;
    --top-submenu-text-color: #cbd5e1;
    --top-submenu-text-hover: #fd9203;
    --top-submenu-background-check: #fd9203;
    --top-submenu-check-color: #fff;

    /* Login */
    --login-background-color: #0f172a;
    --login-panel-header-background: transparent;
    --login-panel-left-background-color: #1e293b;
    --login-panel-right-background-color: #0f172a;

    --login-button-background: #2d3748; /* melhorado */
    --login-button-text-color: #cbd5e1;

    --login-panel-left-text-header-color: #cbd5e1;
    --login-panel-left-text-header-align: left;
    --login-panel-left-text-header-font-size: 28px;
    --login-panel-left-text-header-font-weight: 700;

    --login-panel-left-text-footer-color: #cbd5e1;
    --login-panel-left-text-footer-align: left;
    --login-panel-left-text-footer-font-size: 20px;
    --login-panel-left-text-footer-font-weight: 600;

    --login-title-font-size: 24px;
    --login-title-align: center;
    --login-title-font-weight: 700;
    --login-title-color: #cbd5e1;

    --login-header-font-size: 13px;
    --login-header-align: left;
    --login-header-color: #cbd5e1;
    --login-border-color: #2d3648;

    --login-panel-detail-display: flex;
    --login-panel-detail-display-image: flex;
    --login-panel-detail-display-details: flex;

    --login-panel-detail-image-size: contain;
    --login-panel-detail-image-position: center;
    --login-panel-detail-direction: row;
    --login-panel-max-width: 1000px;
    --login-panel-border-radius: 8px;
    --login-panel-box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.4);

    --login-link-color: #cbd5e1;

    /* Fields - MELHORADO */
    --field-height: 36px;
    --field-border-color: #334155;
    --field-border-radius: 6px;

    --field-placeholder-color: #64748b;
    --field-padding-horizontal: 12px;
    --field-padding-vertical: 0px;

    --field-color: #e2e8f0;
    --field-background: #1f2937; /* mais claro para melhor diferenciação */
    --field-focus-border-color: #4a7bd8; /* azul mais suave e profissional */

    --field-check-color: #4a7bd8; /* harmonizado com o foco */
    --field-disabled-background: #0f172a;
    --field-disabled-border: #334155;
    --field-disabled-text-color: #64748b;

    --field-padding: var(--field-padding-vertical) var(--field-padding-horizontal) var(--field-padding-vertical) var(--field-padding-horizontal);


    /* Content */
    --content-border-color: #2d3648;
    --content-border-radius: 8px;
    --content-background: #1e293b;

    /* Colors */
    --color-overlay: rgba(0, 0, 0, 0.3);

    --color-green: #10B981;
    --color-red: #EF4444;
    --color-blue: #4a7bd8;      /* harmonizado */
    --color-orange: #fd9203;
    --color-sea: #06B6D4;
    --color-purple: #8B5CF6;

    /* Modal */
    --modal-background: #1e293b;
    --modal-footer-background: #131a25;
    --modal-header-background: #fd9203;
    --modal-header-color: #FFFFFF;

    --preloader-color: #fd9203;

    /* Panel */
    --panel-background: transparent;
    --panel-header-background: transparent;
    --panel-footer-background: transparent;
    --panel-header-color: #e2e8f0;

    --panel-body-padding: 16px;
    --panel-border-radius: 8px;
    --panel-box-shadow: none;
    --panel-border-color: #2d3648;

    --panel-header-padding-vertical: 12px;
    --panel-header-padding-horizontal: 16px;

    --panel-padding: 0;
    --panel-footer-align-buttons: right;

    /* Table - MELHORADO */
    --tr-hover-background: #293548; /* transição mais suave */
    --tr-hover-color: #ffffff;
    --tr-even-background: #1e293b;
    --tr-odd-background: #0f172a;

    --table-body-color: #cbd5e1;
    --table-header-color: #e2e8f0;

    --table-header-border-color: #2d3648;
    --table-header-background: #1e293b;
    --table-header-font-weight: 600;
    --table-header-font-size: 13px;
    --table-header-padding-vertical: 12px;

    /* Tabs */
    --tab-active-color: #fd9203;
    --tab-active-background: #1e293b;
    --tab-active-border-color: #2d3648;

    --tab-font-size: 13px;
    --tab-font-weight: 500;
    --tab-color: #cbd5e1;
    --tab-background: transparent;
    --tab-border-color: #2d3648;
    --tab-border-radius: 6px;

    /* Sombras */
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.4);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.55);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.6);

    /* Espaçamentos */
    --spacing-1: 4px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 20px;
    --spacing-6: 24px;
    --spacing-8: 32px;

    /* Bordas */
    --border-width: 1px;
    --border-width-thick: 2px;
    --border-radius-sm: 4px;
    --border-radius-md: 6px;
    --border-radius-lg: 8px;
    --border-radius-xl: 12px;
    --border-radius-full: 9999px;

    /* Transições */
    --transition-fast: 0ms ease;
    --transition-base: 0ms ease;
    --transition-slow: 0ms ease;

    /* Animação Focus - MELHORADO */
    --focus-ring-color: rgba(74, 123, 216, 0.25); /* harmonizado com novo azul */
    --focus-ring-width: 3px;

    /* Componentes específicos */
    --card-border-radius: var(--panel-border-radius);
    --card-shadow: none;

    --input-group-addon-bg: #1f2937; /* harmonizado com fields */

    --dropdown-bg: #1e293b;
    --dropdown-border: #2d3648;
    --dropdown-shadow: var(--shadow-md);

    /* Z-index */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal: 1040;
    --z-popover: 1050;
    --z-tooltip: 1060;

    --name: escuro;
    --modules-button-radius: 6px;
    --login-panel-left-header-image-position: center;
    --login-text-center-align: center;
    --login-text-center-size: 18px;
    --login-text-center-weight: 600px;
    --login-text-center-color: #afb5b8;
    --panel-row-margin-bottom: 12px;
    --top-menu-color-button-circle: #afb5b8;
    --panel-header-border-color: transparent;
    --header-logo-text-color: #8694B0;
    --panel-header-font-size: 15px;
    --panel-header-font-weight: 500px;
    --live-area-width: 100%;
    --field-border-top: 1px;
    --field-border-bottom: 1px;
    --field-border-right: 1px;
    --field-border-left: 1px;


    .tab-pane {
        border: 1px solid var(--tab-active-border-color) !important;
    }

    .input-group-addon {
        background: var(--field-background) !important;
        margin-left: -3px !important;
    }

    .select2-container--default .select2-results__option--highlighted[aria-selected]{
        background-color: var(--field-check-color) !important;
    }
    /* === MELHORIAS ADICIONAIS === */

    /* Transição suave em botões */
    button, .btn {
        transition: all 150ms ease-in-out;
    }

    /* Melhor feedback visual em campos com foco */
    input:focus, 
    select:focus, 
    textarea:focus {
        outline: none;
        border-color: var(--field-focus-border-color);
        box-shadow: 0 0 0 var(--focus-ring-width) var(--focus-ring-color);
    }

    /* Hover nos botões mais suave */
    button:hover:not(:disabled), 
    .btn:hover:not(:disabled) {
        transform: translateY(-1px);
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
    }

    /* Estado ativo de botões */
    button:active:not(:disabled), 
    .btn:active:not(:disabled) {
        transform: translateY(0);
    }

    /* Melhoria no scrollbar customizado */
    ::-webkit-scrollbar {
        width: 8px;
        height: 8px;
    }

    ::-webkit-scrollbar-track {
        background: var(--live-background-color);
    }

    ::-webkit-scrollbar-thumb {
        background: var(--scrollbar-color);
        border-radius: 4px;
    }

    ::-webkit-scrollbar-thumb:hover {
        background: #3d4f66;
    }

}