/*
 * FichIAndo 3.4 - Tema Oscuro
 * Fondos oscuros con poca transparencia, textos blancos
 */

/* Fuente Inter local */
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('/Scripts/Fuentes/Inter/web/Inter-Regular.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('/Scripts/Fuentes/Inter/web/Inter-Medium.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('/Scripts/Fuentes/Inter/web/Inter-SemiBold.woff2') format('woff2');
}
@font-face {
	font-family: 'Inter';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('/Scripts/Fuentes/Inter/web/Inter-Bold.woff2') format('woff2');
}

:root {
	/* Tipografia */
	--font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;

	/* Espaciado */
	--spacing-xs: 0.25rem;
	--spacing-sm: 0.5rem;
	--spacing-md: 1rem;
	--spacing-lg: 1.5rem;
	--spacing-xl: 2rem;

	/* Bordes */
	--radius-sm: 8px;
	--radius-md: 12px;
	--radius-lg: 16px;
	--radius-xl: 24px;

	/* Colores semanticos */
	--primary: #3b82f6;
	--primary-dark: #2563eb;
	--success: #22c55e;
	--success-dark: #16a34a;
	--warning: #f59e0b;
	--warning-dark: #d97706;
	--danger: #ff0000;
	--danger-dark: #cc0000;
	--info: #42A5F5;
	--info-dark: #1e88e5;

	/* Botones - colores unificados */
	--btn-primary-bg: #3b82f6;
	--btn-primary-hover: #2563eb;
	--btn-primary-text: #ffffff;
	--btn-success-bg: #22c55e;
	--btn-success-hover: #16a34a;
	--btn-success-text: #ffffff;
	--btn-danger-bg: #ef4444;
	--btn-danger-hover: #dc2626;
	--btn-danger-text: #ffffff;
	--btn-secondary-bg: rgba(100, 116, 139, 0.3);
	--btn-secondary-hover: rgba(100, 116, 139, 0.5);
	--btn-secondary-text: #cbd5e1;

	/* Colores FichAndo */
	--fichando-verde: #70c400;
	--fichando-rojo: #f60808;
	--fichando-azul: #6caee0;
	--fichando-naranja: #ff7500;

	/* Accent */
	--accent-color: #60a5fa;
	--accent-hover: #3b82f6;

	/* TEMA OSCURO: Textos claros */
	--color-texto: #f1f5f9;
	--text-primary: #f1f5f9;
	--text-secondary: #cbd5e1;
	--text-muted: #94a3b8;
	--text-light: #ffffff;
	--text-dark: #1f2937;
	--text-inverse: #1e293b;

	/* TEMA OSCURO: Glassmorphism oscuro igual que #Horas de Fichar */
	--glass-bg: rgba(0, 0, 0, 0.60);
	--glass-bg-hover: rgba(0, 0, 0, 0.65);
	--glass-bg-solid: rgba(0, 0, 0, 0.70);
	--glass-bg-subtle: rgba(0, 0, 0, 0.40);
	--glass-border: rgba(255, 255, 255, 0.18);
	--glass-border-light: rgba(255, 255, 255, 0.08);
	--glass-shadow: 0 8px 32px rgba(0, 0, 0, 0.2), 0 2px 8px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255, 255, 255, 0.1);
	--glass-text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
	--shadow-color: rgba(0, 0, 0, 0.2);

	/* Estados - colores para fichajes (oscuros, legibles) */
	--state-success-bg: rgba(20, 83, 45, 0.95);
	--state-success-bg-light: rgba(20, 83, 45, 0.90);
	--state-danger-bg: rgba(127, 29, 29, 0.95);
	--state-danger-bg-light: rgba(127, 29, 29, 0.90);
	--state-warning-bg: rgba(120, 80, 20, 0.92);

	/* Overlay */
	--overlay-bg: rgba(0, 0, 0, 0.5);

	/* Inputs */
	--input-bg: rgba(255, 255, 255, 0.08);
	--input-bg-focus: rgba(255, 255, 255, 0.12);
	--input-border: rgba(255, 255, 255, 0.15);
	--input-border-focus: rgba(96, 165, 250, 0.5);
	--input-placeholder: rgba(255, 255, 255, 0.4);

	/* Botones secundarios */
	--btn-secondary-bg: rgba(255, 255, 255, 0.1);
	--btn-secondary-bg-hover: rgba(255, 255, 255, 0.15);
	--btn-secondary-border: rgba(255, 255, 255, 0.2);
	--btn-secondary-text: #f1f5f9;

	/* Scrollbar */
	--scrollbar-track: rgba(255, 255, 255, 0.05);
	--scrollbar-thumb: rgba(255, 255, 255, 0.2);
	--scrollbar-thumb-hover: rgba(255, 255, 255, 0.3);

	/* Menu y contexto */
	--menu-bg: rgba(30, 41, 59, 0.95);
	--menu-border: rgba(255, 255, 255, 0.1);
	--menu-item-hover: rgba(59, 130, 246, 0.2);
	--menu-separator: rgba(255, 255, 255, 0.1);

	/* Variables para spop */
	--spop-bg: rgba(30, 41, 59, 0.92);
	--spop-border: rgba(255, 255, 255, 0.15);
	--spop-text: #f1f5f9;
	--spop-shadow: 0 8px 32px rgba(0, 0, 0, 0.4);

	/* Dropdowns, selects, desplegables */
	--dropdown-bg: #1e293b;
	--dropdown-bg-hover: rgba(255, 255, 255, 0.08);
	--dropdown-border: rgba(255, 255, 255, 0.12);
	--dropdown-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
	--dropdown-text: #f1f5f9;
	--dropdown-text-muted: #94a3b8;
}
