/**
 * ROMA - Estilos Comuns
 * Padrão de Tipografia e Componentes
 * Versão: 1.0.0
 */

/* ============================================
   VARIÁVEIS CSS
   ============================================ */
:root {
    /* Cores Primárias */
    --color-primary: #5555FF;
    --color-primary-dark: #03005C;
    --color-success: #00CA35;
    --color-danger: #ef4444;
    --color-warning: #f59e0b;
    --color-info: #5555FF;

    /* Cores Neutras */
    --color-bg: #EEEEEE;
    --color-white: #FFFFFF;
    --color-text: #1a1a2e;
    --color-text-secondary: #757575;
    --color-border: #EEEEEE;

    /* Tipografia - Tamanhos Padronizados (MÍNIMO 14px para legibilidade) */
    --font-size-xs: 0.8125rem;     /* 13px - MÍNIMO */
    --font-size-sm: 0.875rem;      /* 14px */
    --font-size-base: 1rem;        /* 16px */
    --font-size-lg: 1.125rem;      /* 18px */
    --font-size-xl: 1.25rem;       /* 20px */
    --font-size-2xl: 1.5rem;       /* 24px */
    --font-size-3xl: 2rem;         /* 32px */

    /* Pesos de Fonte */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-black: 800;
}

/* ============================================
   BASE - GARANTIR LEGIBILIDADE
   ============================================ */

html {
    font-size: 16px;
}

body {
    font-size: 16px !important;
    line-height: 1.6 !important;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* ============================================
   TIPOGRAFIA PADRÃO
   ============================================ */

/* Título Principal da Página */
.page-title,
.titulo-pagina,
h1.page-title {
    font-size: var(--font-size-3xl) !important;      /* 2rem / 32px */
    font-weight: var(--font-weight-black) !important;
    line-height: 1.2 !important;
}

/* Subtítulo da Página */
.page-subtitle,
.subtitulo-pagina {
    font-size: var(--font-size-lg) !important;       /* 1.125rem / 18px */
    font-weight: var(--font-weight-normal) !important;
    line-height: 1.5 !important;
    opacity: 0.9;
}

/* Título de Seção */
.section-title,
.table-header h3,
.card-title,
h2.section-title {
    font-size: var(--font-size-xl) !important;       /* 1.25rem / 20px */
    font-weight: var(--font-weight-bold) !important;
    line-height: 1.3 !important;
}

/* Título de Card/Box */
.box-title,
.panel-title,
h3.card-title {
    font-size: var(--font-size-lg) !important;       /* 1.125rem / 18px */
    font-weight: var(--font-weight-bold) !important;
    line-height: 1.4 !important;
}

/* Texto Normal / Corpo */
body,
.text-normal,
p, li {
    font-size: var(--font-size-base) !important;     /* 1rem / 16px */
    font-weight: var(--font-weight-normal) !important;
    line-height: 1.6 !important;
}

/* Texto em Tabelas - MÍNIMO 14px */
table td,
table th,
.table-text {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
}

/* Labels - MÍNIMO 14px */
label,
.form-label,
.filter-group label {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
    font-weight: var(--font-weight-semibold) !important;
}

/* Texto Secundário */
.text-secondary,
.summary-label,
.text-muted {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
    font-weight: var(--font-weight-normal) !important;
    color: var(--color-text-secondary) !important;
}

/* Texto Pequeno - MÍNIMO 13px */
.text-small,
.small-text,
.text-xs {
    font-size: var(--font-size-xs) !important;       /* 0.8125rem / 13px */
    font-weight: var(--font-weight-normal) !important;
}

/* Valores Monetários */
.valor,
.currency,
.col-valor {
    font-size: var(--font-size-base) !important;     /* 1rem / 16px */
    font-weight: var(--font-weight-bold) !important;
    font-variant-numeric: tabular-nums !important;
}

/* Valores Grandes em Cards */
.summary-value,
.valor-destaque {
    font-size: var(--font-size-2xl) !important;      /* 1.5rem / 24px */
    font-weight: var(--font-weight-black) !important;
}

/* ============================================
   FORMULÁRIOS - TAMANHOS PADRONIZADOS
   ============================================ */

/* Inputs e Selects - MÍNIMO 16px para evitar zoom no mobile */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="date"],
input[type="search"],
select,
textarea {
    font-size: var(--font-size-base) !important;     /* 1rem / 16px */
    padding: 12px 15px !important;
}

/* Botões */
.btn,
button {
    font-size: var(--font-size-base) !important;     /* 1rem / 16px */
    font-weight: var(--font-weight-semibold) !important;
    padding: 12px 24px !important;
}

/* Botões Pequenos - MÍNIMO 14px */
.btn-sm,
button.btn-sm {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
    padding: 8px 16px !important;
}

/* ============================================
   TABELAS - TAMANHOS PADRONIZADOS
   ============================================ */

table thead th {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
    font-weight: var(--font-weight-semibold) !important;
}

table tbody td {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
}

/* Cabeçalhos de Tabela Especiais */
.table-header h3 {
    font-size: var(--font-size-xl) !important;       /* 1.25rem / 20px */
}

/* ============================================
   CARDS DE RESUMO - TAMANHOS PADRONIZADOS
   ============================================ */

.summary-title,
.card-label {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
    font-weight: var(--font-weight-bold) !important;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.summary-value {
    font-size: var(--font-size-2xl) !important;      /* 1.5rem / 24px */
    font-weight: var(--font-weight-black) !important;
}

.summary-label {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
}

/* ============================================
   COMPONENTES ESPECÍFICOS
   ============================================ */

/* Select de Categoria */
.categoria-select {
    font-size: var(--font-size-sm) !important;       /* 0.875rem / 14px */
}

/* Select de Filtro */
.filter-group select {
    font-size: var(--font-size-base) !important;     /* 1rem / 16px */
}

/* ============================================
   RESPONSIVIDADE
   ============================================ */

@media (max-width: 768px) {
    .page-title {
        font-size: var(--font-size-2xl) !important;  /* 1.5rem / 24px */
    }

    .page-subtitle {
        font-size: var(--font-size-base) !important; /* 1rem / 16px */
    }

    .summary-value {
        font-size: var(--font-size-xl) !important;   /* 1.25rem / 20px */
    }

    .section-title,
    .table-header h3 {
        font-size: var(--font-size-lg) !important;   /* 1.125rem / 18px */
    }

    /* Manter tamanho mínimo de 14px em mobile */
    table td,
    table th {
        font-size: var(--font-size-sm) !important;   /* 0.875rem / 14px */
    }
}

/* ============================================
   CLASSES UTILITÁRIAS
   ============================================ */

.text-xs { font-size: var(--font-size-xs) !important; }
.text-sm { font-size: var(--font-size-sm) !important; }
.text-base { font-size: var(--font-size-base) !important; }
.text-lg { font-size: var(--font-size-lg) !important; }
.text-xl { font-size: var(--font-size-xl) !important; }
.text-2xl { font-size: var(--font-size-2xl) !important; }
.text-3xl { font-size: var(--font-size-3xl) !important; }

.font-normal { font-weight: var(--font-weight-normal) !important; }
.font-medium { font-weight: var(--font-weight-medium) !important; }
.font-semibold { font-weight: var(--font-weight-semibold) !important; }
.font-bold { font-weight: var(--font-weight-bold) !important; }
.font-black { font-weight: var(--font-weight-black) !important; }