/* ===== FiDiGames — tema propio sobre Bootstrap 5 (dark) ===== */

:root {
    --fidi-accent: #f46523;
    --fidi-accent-dark: #7a2e0e;
    --fidi-bg: #170b05;
    --fidi-surface: #241207;
}

body {
    background: var(--fidi-bg);
}

/* Navbar */
.navbar-fidi {
    background: rgba(23, 11, 5, 0.92);
    backdrop-filter: blur(8px);
    border-bottom: 1px solid rgba(244, 101, 35, 0.18);
}
.navbar-fidi .nav-link.active {
    background: rgba(244, 101, 35, 0.16);
    color: var(--fidi-accent) !important;
}

/* Hero */
.hero-fidi {
    background:
        radial-gradient(ellipse at 20% -20%, rgba(244, 101, 35, 0.25), transparent 55%),
        radial-gradient(ellipse at 90% 110%, rgba(122, 46, 14, 0.4), transparent 55%),
        var(--fidi-surface);
    border-bottom: 1px solid rgba(244, 101, 35, 0.14);
}
.hero-fidi h1 {
    font-weight: 800;
    letter-spacing: -0.02em;
}
.text-fidi {
    color: var(--fidi-accent);
}

/* Cards */
.card-game {
    background: var(--fidi-surface);
    border: 1px solid rgba(244, 101, 35, 0.12);
    overflow: hidden;
    transition: transform 0.18s ease, border-color 0.18s ease;
    height: 100%;
}
.card-game:hover {
    transform: translateY(-4px);
    border-color: rgba(244, 101, 35, 0.45);
}
.card-game .cover-wrap {
    aspect-ratio: 1280 / 743;
    overflow: hidden;
}
.card-game .cover-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.badge-status {
    font-weight: 600;
}
.badge-published {
    background: linear-gradient(135deg, #f46523, #7a2e0e);
    color: #fff;
}

/* Section headings */
.section-title {
    font-weight: 800;
    letter-spacing: -0.01em;
}
.section-title::after {
    content: "";
    display: block;
    width: 64px;
    height: 4px;
    border-radius: 2px;
    margin-top: 0.5rem;
    background: linear-gradient(90deg, var(--fidi-accent), transparent);
}

/* Footer */
.footer-fidi {
    background: #120701;
    border-top: 1px solid rgba(244, 101, 35, 0.12);
}
.link-footer {
    color: #c9a08a;
    text-decoration: none;
    font-size: 0.9rem;
}
.link-footer:hover {
    color: var(--fidi-accent);
}

/* Forms */
.form-control, .form-label {
    background: #1e0f06;
    border-color: rgba(244, 101, 35, 0.22);
    color: #f5e6dc;
}
.form-control:focus {
    background: #1e0f06;
    border-color: var(--fidi-accent);
    box-shadow: 0 0 0 0.2rem rgba(244, 101, 35, 0.18);
    color: #fff;
}

/* Buttons */
.btn-fidi {
    background: linear-gradient(135deg, var(--fidi-accent), var(--fidi-accent-dark));
    border: 1px solid transparent;
    color: #fff;
    font-weight: 700;
}
.btn-fidi:hover {
    filter: brightness(1.1);
    color: #fff;
}
.btn-itch {
    background: #fa5c5c;
    border: 1px solid transparent;
    color: #fff;
    font-weight: 700;
}
.btn-itch:hover {
    filter: brightness(1.1);
    color: #fff;
}
/* El SVG de itch.io no trae width/height nativos: fijarlos a 1em para
   que el botón mida igual que los de iconos de fuente (bi-*). */
.itch-icon {
    width: 1em;
    height: 1em;
    display: inline-block;
    vertical-align: -0.125em;
}

/* Banner de consentimiento de cookies */
.fidi-cookie-banner {
    position: fixed;
    inset-inline: 0;
    bottom: 0;
    z-index: 1080;
    background: rgba(23, 11, 5, 0.97);
    backdrop-filter: blur(8px);
    border-top: 1px solid rgba(244, 101, 35, 0.35);
    padding: 0.9rem 0;
    color: #f5e6dc;
}
.fidi-cookie-banner[hidden] {
    display: none;
}

/* Partners */
.partner-link {
    background: #1e0f06;
    border: 1px solid rgba(244, 101, 35, 0.18);
    transition: border-color 0.18s ease, transform 0.18s ease;
}
.partner-link:hover {
    border-color: rgba(244, 101, 35, 0.5);
    transform: translateY(-2px);
}
.partner-logo {
    object-fit: contain;
    filter: brightness(0.95);
}

/* Misc */
.bg-fidi-surface {
    background: var(--fidi-surface);
}
.avatar-fidi {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    font-weight: 800;
    color: #fff;
    background: linear-gradient(135deg, var(--fidi-accent), var(--fidi-accent-dark));
}