/* Estou a definir todas as variáveis globais na root para que possam ser usadas em qualquer lado */
:root {
    /* Estou a definir a cor principal da Aksanti (Gold/Amber) para usar em destaque e botões */
    --aksanti-gold: #E58A13;
    /* Estou a definir uma variação mais escura do Gold para usar quando passo o rato por cima (hover) */
    --aksanti-gold-hover: #D07A0F;
    /* Estou a definir a cor escura (Charcoal) para a barra lateral e o cabeçalho, dando o tom Premium */
    --aksanti-dark: #1A1A1A;
    /* Estou a definir uma variação do escuro para quando passo o rato por cima de itens na barra lateral */
    --aksanti-dark-hover: #2A2A2A;
    /* Estou a definir a cor de fundo principal (Off-white) para não cansar a vista e criar contraste */
    --bg-principal: #F4F4F4;
    /* Estou a definir a cor de fundo dos cartões (Branco puro) para destacar do fundo cinza claro */
    --bg-card: #FFFFFF;
    /* Estou a definir a cor do texto principal para ter bom contraste e alta legibilidade */
    --texto-principal: #1A1A1A;
    /* Estou a definir a cor do texto secundário para descrições menos importantes ou subtítulos */
    --texto-secundario: #666666;
    
    /* Estou a definir a cor verde para estados positivos do pedido (como Aceite ou Fechado) */
    --cor-sucesso: #10B981;
    /* Estou a definir a cor laranja/amarela para estados de aviso do pedido (como Rascunho ou Enviado) */
    --cor-aviso: #F59E0B;
    /* Estou a definir a cor vermelha para estados de perigo do pedido (como Rejeitado) */
    --cor-perigo: #EF4444;
    /* Estou a definir a cor azul para estados de informação do pedido (como Recebido ou Cliente Respondeu) */
    --cor-info: #3B82F6;

    /* Estou a definir a fonte principal (Inter) para o corpo do texto porque é muito limpa e legível */
    --fonte-corpo: 'Segoe UI', Inter, Arial, sans-serif;
    /* Estou a definir a fonte de destaque (Outfit) para os títulos, para dar um ar mais moderno, premium e corporativo */
    --fonte-display: 'Segoe UI', Outfit, Arial, sans-serif;

    /* Estou a definir o arredondamento padrão das bordas para dar um aspecto mais suave, atual e amigável */
    --raio-borda: 12px;
    /* Estou a definir a sombra padrão dos cartões para criar uma sensação de profundidade e elevação (efeito Premium) */
    --sombra-card: 0 2px 12px rgba(0,0,0,0.08);
    /* Estou a definir a transição padrão para que todas as animações (como passar o rato num botão) sejam suaves */
    --transicao: 0.3s ease;
}