/* ============================================================
   Diárias — Base / Reset
   Reset de elementos + estrutura de layout. SEM classes de componente.

   TODO: Após aposentadoria de globals.css, verificar cobertura total de utilities.
   TODO: Extrair .app-shell e .content-shell de sidebar.css para cá (fase de migração).
   ============================================================ */

/* === Fontes institucionais === */
@font-face {
	font-family: 'Gildeon';
	src: url('/static/assets/fonts/Gildeon.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Quicksilver';
	src: url('/static/assets/fonts/Quicksilver.otf') format('opentype');
	font-weight: normal;
	font-style: normal;
	font-display: swap;
}

/* === Reset === */
*,
*::before,
*::after {
	box-sizing: border-box;
	border-color: var(--color-border);
}

html {
	overflow: hidden;
}

html,
body {
	height: 100%;
}

body {
	margin: 0;
	background: var(--color-background);
	color: var(--color-foreground);
	font-family: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
	font-size: var(--text-base);
	line-height: 1.5;
}

/* === Tipografia base === */
h1 {
	font-size: var(--text-2xl);
	font-weight: var(--font-weight-medium);
	line-height: 1.5;
	margin: 0;
}

h2 {
	font-size: var(--text-xl);
	font-weight: var(--font-weight-medium);
	line-height: 1.5;
	margin: 0;
}

h3 {
	font-size: var(--text-lg);
	font-weight: var(--font-weight-medium);
	line-height: 1.5;
	margin: 0;
}

h4 {
	font-size: var(--text-base);
	font-weight: var(--font-weight-medium);
	line-height: 1.5;
	margin: 0;
}

p {
	font-size: var(--text-base);
	font-weight: var(--font-weight-normal);
	line-height: 1.5;
	margin: 0;
}

a {
	color: inherit;
	text-decoration: none;
}

/* === Estrutura de layout (app shell) ===
   Nota: sidebar.css define estas classes também e carrega depois,
   portanto prevalece. Estas definições são a base canônica futura.
   TODO: Remover duplicata de sidebar.css quando migração for concluída.
*/
.app-shell {
	display: flex;
	height: 100vh;
	overflow: hidden;
	background: var(--color-background);
	color: var(--color-foreground);
}

.content-shell {
	flex: 1;
	display: flex;
	flex-direction: column;
	background: var(--gray-1, #f8f8f8);
	min-width: 0;
	min-height: 0;
	overflow: auto;
}

/* === Utilidades mínimas === */
.w-full { width: 100%; }
.text-center { text-align: center; }
.text-start { text-align: left; }
.text-muted { color: var(--color-muted-foreground); }
.text-xs { font-size: var(--text-xs); }
.text-sm { font-size: var(--text-sm); }

/* === Ícones === */
.icon {
	width: 16px;
	height: 16px;
	display: inline-block;
	vertical-align: middle;
}

.icon--sm { width: 14px; height: 14px; }
.icon--md { width: 18px; height: 18px; }
.icon--lg { width: 20px; height: 20px; }

/* === Skeleton loader === */
@keyframes shimmer {
	100% { transform: translateX(100%); }
}

.skeleton {
	position: relative;
	overflow: hidden;
	background: var(--gray-3, #dedede);
	border-radius: var(--r-md, 4px);
}

.skeleton::after {
	content: "";
	position: absolute;
	inset: 0;
	transform: translateX(-100%);
	background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.5), transparent);
	animation: shimmer 1.2s infinite;
}