/* ==========================================================================
   ESPECIALES.CSS — Estilos compartidos para páginas de contenido individual
   Usado por: especiales, radio, historias cortas de Gosho, películas
   ========================================================================== */

/* Hero Section */
.especial-hero { background: linear-gradient(135deg, #1a1d21 0%, #2c3e50 100%); padding: 2.5rem 0; text-align: center; color: #fff; }
.especial-hero h2 { font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: #fff; }
.especial-hero p { color: #adb5bd; margin: 0.5rem 0 0; font-size: 0.9rem; }

/* Info Card */
.info-card { border: none; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,0.08); margin-bottom: 1.5rem; }
.info-card .card-header { background: #f8f9fa; font-weight: 600; border-bottom: 2px solid #28a745; padding: 12px 16px; }
.info-card .card-body { padding: 1.2rem; font-size: 0.9rem; line-height: 1.7; }

/* Player Card */
.player-card { border: none; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,0.08); margin-bottom: 1.5rem; }
.player-card .card-header { background: #f8f9fa; font-weight: 600; font-size: 1rem; border-bottom: 2px solid #28a745; padding: 12px 16px; }
.player-card .card-body { padding: 1rem; }
.player-card .source-btns { display: flex; gap: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.player-card .source-btns .btn { font-size: 0.8rem; padding: 5px 12px; }
.player-card .source-btns .btn.active-src { opacity: 1; }
.player-card .source-btns .btn:not(.active-src) { opacity: 0.6; }
.player-card .player-frame { position: relative; width: 100%; padding-bottom: 56.25%; border-radius: 8px; overflow: hidden; background: #000; }
.player-card .player-frame iframe,
.player-card .player-frame video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; }

/* Download Card */
.download-card { border: none; border-radius: 12px; overflow: hidden; box-shadow: 0 2px 12px rgba(0,0,0,0.08); text-align: center; margin-bottom: 1.5rem; }
.download-card .card-header { background: #f8f9fa; font-weight: 600; border-bottom: 2px solid #28a745; padding: 12px 16px; }
.download-card .card-body { padding: 1.5rem; }
.download-card .card-body a { margin: 4px; display: inline-block; transition: transform 0.2s; }
.download-card .card-body a:hover { transform: scale(1.1); }
.download-card .card-footer { background: #f8f9fa; font-size: 0.85rem; }

/* Credits Card */
.credits-card { border-radius: 12px; }

/* Base */
body { background: #f5f5f5; }

/* Dark Mode */
[data-bs-theme="dark"] body { background: #12151a; }
[data-bs-theme="dark"] .info-card,
[data-bs-theme="dark"] .player-card,
[data-bs-theme="dark"] .download-card { background: #1e2228; box-shadow: 0 2px 12px rgba(0,0,0,0.3); }
[data-bs-theme="dark"] .info-card .card-header,
[data-bs-theme="dark"] .player-card .card-header,
[data-bs-theme="dark"] .download-card .card-header { background: #252a30; color: #fff; }
[data-bs-theme="dark"] .info-card .card-body { color: #ccc; }
[data-bs-theme="dark"] .download-card .card-footer { background: #1a1d21; }