Preview de mixed.css
/* MIXED CSS PACK */
/* Template: roñacastropasiondebox.com/index.html */
/* Template mtime: 2026-03-03 19:19:34 */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css */
/* external link (no embedded): https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.0.0/css/all.min.css */
/* external link (no embedded): https://fonts.googleapis.com/css2?family=Oswald:wght@400;500;600;700&family=Inter:wght@400;500;600;700;800&display=swap */
/* external link (no embedded): https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.css */
/* ===== INLINE <style> BLOCK #1 ===== */
/* --------------------------------
RESET Y VARIABLES (PALETA ORIGINAL RESPETADA)
----------------------------------- */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
:root {
--rojo-box: #8B0000;
--negro-box: #0A0A0A;
--gris-lona: #2A2A2A;
--blanco: #FFFFFF;
--dorado: #B8860B;
--shadow-fuerte: 0 10px 25px -5px rgba(0,0,0,0.5);
--border-ring: 3px solid var(--rojo-box);
/* Mejoras visuales */
--transition-smooth: all 0.3s ease;
--glass-bg: rgba(10, 10, 10, 0.7);
--glass-border: 1px solid rgba(255, 255, 255, 0.1);
/* Tema */
--text-main: var(--blanco);
--text-muted: rgba(255,255,255,0.80);
--text-soft: rgba(255,255,255,0.72);
--panel-bg: rgba(0,0,0,0.30);
--panel-bg-2: rgba(0,0,0,0.40);
--panel-border: rgba(255,255,255,0.10);
--input-border: rgba(255,255,255,0.25);
--input-border-2: rgba(255,255,255,0.20);
--iframe-scale: 1;
}
/* --------------------------------
LIGHT MODE (toggle con body.light-mode)
----------------------------------- */
body.light-mode {
/* Invertimos superficies manteniendo acentos */
--negro-box: #F6F6F7;
--blanco: #0A0A0A;
--gris-lona: #E7E7E9;
--glass-bg: rgba(255, 255, 255, 0.78);
--glass-border: 1px solid rgba(10, 10, 10, 0.08);
--shadow-fuerte: 0 10px 25px -5px rgba(0,0,0,0.18);
--text-muted: rgba(10,10,10,0.78);
--text-soft: rgba(10,10,10,0.68);
--panel-bg: rgba(255,255,255,0.62);
--panel-bg-2: rgba(255,255,255,0.70);
--panel-border: rgba(10,10,10,0.10);
--input-border: rgba(10,10,10,0.22);
--input-border-2: rgba(10,10,10,0.18);
}
/* Overlay global: en claro aclaramos (no oscurecemos) */
body.light-mode::before {
background: rgba(255,255,255,0.72);
}
/* Text utilities de bootstrap que quedaron "white" en modo oscuro */
body.light-mode .text-white,
body.light-mode .text-white-50,
body.light-mode .text-white-75,
body.light-mode .text-white-25 {
color: rgba(10,10,10,0.92) !important;
}
body.light-mode .text-white-50 { color: rgba(10,10,10,0.62) !important; }
body.light-mode .text-muted { color: rgba(10,10,10,0.62) !important; }
/* Inputs transparentes */
body.light-mode .form-control.bg-transparent,
body.light-mode .form-select.bg-transparent,
body.light-mode .input-group-text.bg-transparent {
color: rgba(10,10,10,0.92) !important;
}
body.light-mode .form-control::placeholder { color: rgba(10,10,10,0.52) !important; }
/* Accordion "dark" pasa a claro */
body.light-mode .accordion-dark .accordion-button {
background: rgba(255,255,255,0.75);
color: rgba(10,10,10,0.92);
border-color: rgba(10,10,10,0.08);
}
body.light-mode .accordion-dark .accordion-button:not(.collapsed){
background: rgba(255,255,255,0.92);
color: rgba(10,10,10,0.92);
}
body.light-mode .accordion-dark .accordion-body {
background: rgba(255,255,255,0.68);
color: rgba(10,10,10,0.72);
}
/* Footer */
body.light-mode .footer-rona {
background: rgba(255,255,255,0.80);
}
body.light-mode .footer-links a { color: rgba(10,10,10,.72); }
body.light-mode .footer-links a:hover { color: var(--rojo-box); }
body.light-mode .social-btn { color: rgba(10,10,10,.72); border-color: rgba(10,10,10,.12); }
body.light-mode .social-btn:hover { color: var /* ...cortado... agregá ?full=1 para ver todo ... */