/*
 * FichIAndo 3.1 - Tema Cristal
 * Fondos muy transparentes (glassmorphism), textos blancos/claros
 */

/* 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;

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

	/* Accent - mas brillante para destacar sobre transparencia */
	--accent-color: #60a5fa;
	--accent-hover: #3b82f6;

	/* TEMA CRISTAL: Textos claros/blancos */
	--color-texto: #ffffff;
	--text-primary: #ffffff;
	--text-secondary: #e2e8f0;
	--text-muted: #cbd5e1;
	--text-light: #ffffff;
	--text-dark: #f8fafc;
	--text-inverse: #1e293b;

	/* TEMA CRISTAL: Glassmorphism MUY transparente */
	--glass-bg: rgba(255, 255, 255, 0.08);
	--glass-bg-hover: rgba(255, 255, 255, 0.12);
	--glass-bg-solid: rgba(255, 255, 255, 0.15);
	--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.25);
	--shadow-color: rgba(0, 0, 0, 0.25);

	/* Overlay - mas sutil */
	--overlay-bg: rgba(0, 0, 0, 0.2);

	/* Inputs - muy transparentes */
	--input-bg: rgba(255, 255, 255, 0.08);
	--input-bg-focus: rgba(255, 255, 255, 0.15);
	--input-border: rgba(255, 255, 255, 0.2);
	--input-border-focus: rgba(255, 255, 255, 0.4);
	--input-placeholder: rgba(255, 255, 255, 0.5);

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

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

	/* Menu y contexto */
	--menu-bg: rgba(255, 255, 255, 0.08);
	--menu-border: rgba(255, 255, 255, 0.18);
	--menu-item-hover: rgba(255, 255, 255, 0.12);
	--menu-separator: rgba(255, 255, 255, 0.1);

	/* Variables para spop */
	--spop-bg: rgba(255, 255, 255, 0.08);
	--spop-border: rgba(255, 255, 255, 0.18);
	--spop-text: #ffffff;
	--spop-shadow: 0 8px 32px rgba(0, 0, 0, 0.25);
}