/* ==========================================================================
   IPDS — Info Plus Design System
   File:    material-symbols.css
   Version: 1.0.0
   --------------------------------------------------------------------------
   Substitui o material-icons.css por Material Symbols Outlined (variable font).
   Self-hosted — não depende de CDN do Google (compatível com rede de prefeitura).

   ARQUIVO DE FONTE NECESSÁRIO:
     css/fonts/material-symbols-outlined.woff2   (~430 KB, variable font)

   COMO BAIXAR O .WOFF2:
     1. Acesse: https://github.com/google/material-design-icons
     2. Pasta: variablefont/
     3. Baixe: MaterialSymbolsOutlined[FILL,GRAD,opsz,wght].woff2
     4. Renomeie para: material-symbols-outlined.woff2
     5. Coloque em: css/fonts/material-symbols-outlined.woff2

   ORDEM DE CARGA NO JSP (substitui o material-icons.css na linha 16):
     <link rel="stylesheet" href="css/material-symbols.css">
   ========================================================================== */

@font-face {
	font-family: 'Material Symbols Outlined';
	font-style: normal;
	font-weight: 100 700;
	font-display: block;
	src: url('fonts/material-symbols-outlined.woff2') format('woff2-variations');
}

/* ==========================================================================
   CLASSE BASE
   --------------------------------------------------------------------------
   Sintaxe HTML:  <span class="material-symbols-outlined">person</span>
   ========================================================================== */
.material-symbols-outlined {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	font-size: 20px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	vertical-align: middle;
	-webkit-font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
	font-feature-settings: 'liga';
	font-variation-settings:
		'FILL' var(--ipds-icon-fill, 0),
		'wght' var(--ipds-icon-weight, 400),
		'GRAD' var(--ipds-icon-grade, 0),
		'opsz' var(--ipds-icon-opsz, 24);
	user-select: none;
}

/* ==========================================================================
   VARIANTES DE ESTILO
   --------------------------------------------------------------------------
   Combine com a classe base. Exemplos:
     <span class="material-symbols-outlined icon-filled">favorite</span>
     <span class="material-symbols-outlined icon-bold icon-lg">edit</span>
   ========================================================================== */

/* Preenchimento (outline → filled) */
.material-symbols-outlined.icon-filled        { --ipds-icon-fill: 1; }

/* Peso da linha */
.material-symbols-outlined.icon-thin          { --ipds-icon-weight: 100; }
.material-symbols-outlined.icon-light         { --ipds-icon-weight: 300; }
.material-symbols-outlined.icon-medium        { --ipds-icon-weight: 500; }
.material-symbols-outlined.icon-bold          { --ipds-icon-weight: 700; }

/* ==========================================================================
   VARIANTES DE TAMANHO
   ========================================================================== */
.material-symbols-outlined.icon-xs            { font-size: 14px; --ipds-icon-opsz: 20; }
.material-symbols-outlined.icon-sm            { font-size: 16px; --ipds-icon-opsz: 20; }
.material-symbols-outlined.icon-md            { font-size: 20px; --ipds-icon-opsz: 24; }
.material-symbols-outlined.icon-lg            { font-size: 24px; --ipds-icon-opsz: 24; }
.material-symbols-outlined.icon-xl            { font-size: 32px; --ipds-icon-opsz: 40; }
.material-symbols-outlined.icon-2xl           { font-size: 40px; --ipds-icon-opsz: 40; }
.material-symbols-outlined.icon-3xl           { font-size: 48px; --ipds-icon-opsz: 48; }

/* ==========================================================================
   CORES SEMÂNTICAS (consomem tokens IPDS)
   --------------------------------------------------------------------------
   Quando o ícone precisar de cor diferente da herdada do parent.
   Exemplo: <span class="material-symbols-outlined icon-danger">delete</span>
   ========================================================================== */
.material-symbols-outlined.icon-primary       { color: var(--ipds-text-primary); }
.material-symbols-outlined.icon-secondary     { color: var(--ipds-text-secondary); }
.material-symbols-outlined.icon-muted         { color: var(--ipds-text-muted); }
.material-symbols-outlined.icon-on-dark       { color: var(--ipds-text-on-dark); }

.material-symbols-outlined.icon-accent        { color: var(--ipds-color-gold-500); }
.material-symbols-outlined.icon-navy          { color: var(--ipds-color-navy-900); }

.material-symbols-outlined.icon-info          { color: var(--ipds-color-blue-500); }
.material-symbols-outlined.icon-success       { color: var(--ipds-color-green-500); }
.material-symbols-outlined.icon-warning       { color: var(--ipds-color-amber-500); }
.material-symbols-outlined.icon-danger        { color: var(--ipds-color-red-500); }

/* ==========================================================================
   ALIAS DE COMPATIBILIDADE COM material-icons CLÁSSICO
   --------------------------------------------------------------------------
   Se durante a migração algum HTML antigo ainda tiver class="material-icons"
   que não foi atualizado, ele continua funcionando (fallback de segurança).
   REMOVER esta seção depois que o find-and-replace estiver 100% concluído.
   ========================================================================== */
.material-icons {
	font-family: 'Material Symbols Outlined';
	font-weight: normal;
	font-style: normal;
	font-size: 20px;
	line-height: 1;
	letter-spacing: normal;
	text-transform: none;
	display: inline-block;
	white-space: nowrap;
	word-wrap: normal;
	direction: ltr;
	vertical-align: middle;
	-webkit-font-feature-settings: 'liga';
	-webkit-font-smoothing: antialiased;
	font-feature-settings: 'liga';
	font-variation-settings:
		'FILL' var(--ipds-icon-fill, 0),
		'wght' var(--ipds-icon-weight, 400),
		'GRAD' var(--ipds-icon-grade, 0),
		'opsz' var(--ipds-icon-opsz, 24);
	user-select: none;
}