/* ==========================================================================
   Website APRI Sultra — Tema EMBOSSED (timbul), selaras dengan aplikasi juri
   Dimuat SETELAH assets/css/style.css di semua halaman (publik & admin).
   Berlaku untuk Mode Malam dan Mode Siang. Untuk mematikan: hapus baris
   <link ... emboss.css> di includes/header.php dan admin/includes/admin_header.php.
   ========================================================================== */
:root {
    --em-face-1: #1b2a44;
    --em-face-2: #121d33;
    --em-face-3: #0b1426;
    --em-well: #070d1a;
    --em-edge-hi: rgba(180, 210, 255, .16);
    --em-edge-lo: rgba(0, 0, 0, .62);
    --em-raised:
        -4px -4px 10px rgba(110, 150, 220, .06),
        7px 9px 20px rgba(0, 0, 0, .5),
        inset 2px 2px 0 rgba(180, 210, 255, .14),
        inset -2px -2px 0 rgba(0, 0, 0, .45),
        inset 0 18px 30px -18px rgba(180, 210, 255, .08);
    --em-raised-sm:
        -2px -2px 6px rgba(110, 150, 220, .06),
        4px 5px 12px rgba(0, 0, 0, .45),
        inset 1px 1px 0 rgba(180, 210, 255, .16),
        inset -1px -1px 0 rgba(0, 0, 0, .45);
    --em-pressed:
        inset 3px 3px 8px rgba(0, 0, 0, .6),
        inset -2px -2px 6px rgba(110, 150, 220, .08);
    --em-btn:
        inset 0 1px 0 rgba(255, 255, 255, .30),
        inset 0 -2px 0 rgba(0, 0, 0, .25),
        3px 4px 10px rgba(0, 0, 0, .40);
    --em-btn-down:
        inset 2px 3px 6px rgba(0, 0, 0, .45),
        inset -1px -1px 2px rgba(255, 255, 255, .12);
    --em-text: 0 -1px 0 rgba(0, 0, 0, .7), 0 1px 0 rgba(255, 255, 255, .12);
}
[data-theme="light"] {
    --em-face-1: #ffffff;
    --em-face-2: #f3f6fb;
    --em-face-3: #e6ecf5;
    --em-well: #e9eef5;
    --em-edge-hi: rgba(255, 255, 255, .95);
    --em-edge-lo: rgba(15, 23, 42, .16);
    --em-raised:
        -5px -5px 12px rgba(255, 255, 255, .9),
        7px 8px 18px rgba(15, 23, 42, .14),
        inset 1px 1px 0 rgba(255, 255, 255, .9),
        inset -1px -1px 0 rgba(15, 23, 42, .06);
    --em-raised-sm:
        -3px -3px 8px rgba(255, 255, 255, .9),
        4px 5px 10px rgba(15, 23, 42, .12),
        inset 1px 1px 0 rgba(255, 255, 255, .9);
    --em-pressed:
        inset 3px 3px 7px rgba(15, 23, 42, .14),
        inset -3px -3px 7px rgba(255, 255, 255, .95);
    --em-btn:
        inset 0 1px 0 rgba(255, 255, 255, .45),
        inset 0 -2px 0 rgba(0, 0, 0, .14),
        3px 4px 10px rgba(15, 23, 42, .18);
    --em-btn-down:
        inset 2px 3px 6px rgba(15, 23, 42, .25),
        inset -1px -1px 2px rgba(255, 255, 255, .5);
    --em-text: 0 1px 0 rgba(255, 255, 255, .9), 0 -1px 0 rgba(15, 23, 42, .10);
}

/* ---------- permukaan timbul ---------- */
.program-card,
.news-card,
.event-card,
.org-card,
.contact-item,
.contact-form,
.apri-member-card,
.apri-admin-member-card,
.live-match-card,
.modal-content,
.login-form,
.admin-section,
.admin-stat-card,
.toast {
    background-image: linear-gradient(155deg, var(--em-face-1) 0%, var(--em-face-2) 55%, var(--em-face-3) 100%) !important;
    border: 1px solid transparent !important;
    border-top-color: var(--em-edge-hi) !important;
    border-left-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
    border-right-color: var(--em-edge-lo) !important;
    box-shadow: var(--em-raised) !important;
}
.program-card:hover,
.news-card:hover,
.event-card:hover,
.org-card:hover { transform: translateY(-3px); }

/* ---------- pil label & lencana ---------- */
.section-label,
.hero-badge,
.status-badge,
.admin-menu-badge,
.match-status {
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .22), inset -1px -1px 0 rgba(0, 0, 0, .35), 2px 3px 7px rgba(0, 0, 0, .3) !important;
}

/* ikon kartu */
.program-icon,
.admin-stat-icon,
.org-avatar,
.contact-item > i,
.contact-icon {
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .45), inset -1px -2px 0 rgba(0, 0, 0, .3), 3px 4px 8px rgba(0, 0, 0, .35) !important;
}

/* ---------- tombol ---------- */
.btn,
.admin-action-btn,
.theme-toggle,
.mobile-menu-btn,
.footer-social a,
.tab-btn,
.leaderboard-tabs button {
    box-shadow: var(--em-btn) !important;
    transition: transform .08s ease, box-shadow .08s ease, filter .12s ease !important;
}
.btn-primary, .btn-gold, .btn-danger { text-shadow: 0 1px 0 rgba(0, 0, 0, .3); }
.btn-outline,
.admin-action-btn,
.theme-toggle,
.footer-social a,
.tab-btn,
.leaderboard-tabs button {
    background-image: linear-gradient(155deg, var(--em-face-1), var(--em-face-3)) !important;
    border-top-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
}
.btn:hover, .admin-action-btn:hover, .footer-social a:hover { filter: brightness(1.08); }
.btn:active,
.admin-action-btn:active,
.theme-toggle:active,
.footer-social a:active,
.tab-btn:active,
.tab-btn.active,
.leaderboard-tabs button.active {
    transform: translateY(1px);
    box-shadow: var(--em-btn-down) !important;
}

/* ---------- kolom isian: tertekan ---------- */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=color]):not([type=file]):not([type=hidden]),
select,
textarea {
    background-color: var(--em-well) !important;
    border: 1px solid var(--em-edge-lo) !important;
    border-bottom-color: var(--em-edge-hi) !important;
    border-right-color: var(--em-edge-hi) !important;
    box-shadow: var(--em-pressed) !important;
}
input:not([type=checkbox]):not([type=radio]):focus,
select:focus,
textarea:focus {
    border-color: var(--accent) !important;
    box-shadow: var(--em-pressed), 0 0 0 3px rgba(14, 165, 233, .25) !important;
}

/* ---------- formulir pendaftaran anggota: tab timbul, tab aktif tertekan ---------- */
.apri-tab {
    box-shadow: var(--em-raised-sm) !important;
}
.apri-tab.active {
    box-shadow: var(--em-pressed), 0 -3px 0 0 #c9973e !important;
    transform: none;
}

/* ---------- panel admin ---------- */
.admin-sidebar {
    box-shadow: inset -1px 0 0 var(--em-edge-lo), inset -2px 0 0 var(--em-edge-hi), 6px 0 18px rgba(0, 0, 0, .25) !important;
}
.admin-menu-group-toggle,
.admin-menu a {
    border: 1px solid transparent !important;
    transition: box-shadow .12s ease, transform .12s ease !important;
}
.admin-menu-group-toggle {
    background-image: linear-gradient(155deg, var(--em-face-1), var(--em-face-3)) !important;
    border-top-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
    box-shadow: var(--em-raised-sm) !important;
    border-radius: 10px;
}
.admin-menu a:hover { box-shadow: var(--em-raised-sm) !important; }
.admin-menu a.active {
    box-shadow: var(--em-pressed) !important;
    border-left: 3px solid var(--accent) !important;
}
.admin-user {
    border-radius: 12px;
    box-shadow: var(--em-pressed) !important;
}
.admin-table {
    border-collapse: separate !important;
    border-spacing: 0 6px !important;
}
.admin-table thead th {
    background-image: linear-gradient(180deg, rgba(255, 255, 255, .06), rgba(0, 0, 0, .15)) !important;
    text-shadow: var(--em-text);
}
.admin-table tbody tr { box-shadow: var(--em-raised-sm); }

/* ---------- huruf timbul ---------- */
.section-title,
.admin-header h1,
.admin-section-header h3,
.admin-stat-value,
.stat-number,
.program-card h3,
.news-card h3,
.contact-form h3 {
    text-shadow: var(--em-text);
}
.hero-title {
    /* huruf timbul: sisi terang kiri-atas, sisi gelap kanan-bawah, bayangan jatuh lembut */
    filter:
        drop-shadow(-1.5px -1.5px 0 rgba(255, 255, 255, .55))
        drop-shadow(2px 2.5px 0 rgba(2, 8, 20, .85))
        drop-shadow(3px 5px 3px rgba(0, 0, 0, .5))
        drop-shadow(0 10px 14px rgba(0, 0, 0, .35));
}
[data-theme="light"] .hero-title {
    filter:
        drop-shadow(-1.5px -1.5px 0 rgba(255, 255, 255, .95))
        drop-shadow(2px 2.5px 0 rgba(15, 23, 42, .45))
        drop-shadow(3px 5px 4px rgba(15, 23, 42, .25));
}


/* galeri: foto tetap tampil, hanya bingkai yang dibuat timbul (jangan timpa background-image) */
.gallery-item {
    border: 1px solid transparent;
    border-top-color: var(--em-edge-hi);
    border-left-color: var(--em-edge-hi);
    border-bottom-color: var(--em-edge-lo);
    border-right-color: var(--em-edge-lo);
    box-shadow: var(--em-raised);
}
.gallery-item::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 1;
    box-shadow: inset 2px 2px 0 rgba(255, 255, 255, .18), inset -2px -2px 0 rgba(0, 0, 0, .35);
}

/* ---------- menu navigasi atas (Beranda, Tentang, Lomba, ...) ---------- */
.navbar { border-bottom: 1px solid var(--em-edge-lo); box-shadow: 0 1px 0 var(--em-edge-hi), 0 8px 24px rgba(0, 0, 0, .28); }
.nav-links {
    gap: .3rem !important;
    padding: .3rem;
    border-radius: 14px;
    background: var(--em-well);
    box-shadow: var(--em-pressed);
}
.nav-links > li > a {
    display: inline-flex;
    align-items: center;
    padding: .5rem .95rem;
    border-radius: 10px;
    background-image: linear-gradient(155deg, var(--em-face-1), var(--em-face-3));
    border: 1px solid transparent;
    border-top-color: var(--em-edge-hi);
    border-bottom-color: var(--em-edge-lo);
    box-shadow: var(--em-raised-sm);
    text-shadow: var(--em-text);
    transition: transform .12s ease, box-shadow .12s ease, color .2s ease !important;
}
.nav-links > li > a::after { display: none !important; }
.nav-links > li > a:hover { transform: translateY(-1px); }
.nav-links > li > a.active,
.nav-links > li > a:active,
.nav-links li.has-dropdown:hover > a {
    transform: none;
    background-image: none;
    background-color: var(--em-well);
    border-top-color: var(--em-edge-lo);
    border-bottom-color: var(--em-edge-hi);
    box-shadow: var(--em-pressed);
}
.nav-links > li > a.active { box-shadow: var(--em-pressed), inset 0 -2px 0 var(--accent); }
.nav-links .dropdown-menu {
    background-image: linear-gradient(155deg, var(--em-face-1), var(--em-face-2) 55%, var(--em-face-3)) !important;
    border-top-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
    box-shadow: var(--em-raised) !important;
}
.nav-links .dropdown-menu a { text-shadow: var(--em-text); }
.nav-links .dropdown-menu a:hover,
.nav-links .dropdown-menu a.active { background: var(--em-well) !important; box-shadow: var(--em-pressed); }
.logo-icon { box-shadow: var(--em-raised-sm) !important; }
.mobile-menu-overlay a:not(.btn) {
    padding: .45rem 1.4rem;
    border-radius: 12px;
    background-image: linear-gradient(155deg, var(--em-face-1), var(--em-face-3));
    box-shadow: var(--em-raised-sm);
    text-shadow: var(--em-text);
}
.mobile-menu-overlay a:not(.btn):active,
.mobile-menu-overlay a.active { box-shadow: var(--em-pressed); background-image: none; background-color: var(--em-well); }
@media (max-width: 1200px) {
    .nav-links > li > a { padding: .45rem .7rem; font-size: .85rem; }
}

/* ---------- halaman Live Score (live-score-lomba.php) ---------- */
.ls-board,
.ls-pod {
    border-top-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
    box-shadow: var(--em-raised) !important;
}
.ls-row,
.ls-cd div,
.ls-meta span,
.ls-note {
    border-top-color: var(--em-edge-hi) !important;
    border-bottom-color: var(--em-edge-lo) !important;
    box-shadow: var(--em-raised-sm) !important;
}
.ls-tabs a { box-shadow: var(--em-btn) !important; }
.ls-tabs a:active, .ls-tabs a.on, .ls-tabs a.active { box-shadow: var(--em-btn-down) !important; }
.ls-badge, .ls-medal, .ls-rk, .ls-bi, .ls-live, .ls-tie {
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, .3), inset -1px -1px 0 rgba(0, 0, 0, .35), 2px 3px 7px rgba(0, 0, 0, .3) !important;
}
.ls-bar { box-shadow: var(--em-pressed); }
.ls-pw, .ls-hero h1 { filter: drop-shadow(0 -1px 0 rgba(0, 0, 0, .55)) drop-shadow(0 1px 0 rgba(255, 255, 255, .14)); }

/* ---------- halaman ANTAM Fishing Tournament (tournament.php, body.aft-emboss) ---------- */
body.aft-emboss .card,
body.aft-emboss fieldset,
body.aft-emboss .prize,
body.aft-emboss .fee,
body.aft-emboss .agree,
body.aft-emboss .loc,
body.aft-emboss .agrp,
body.aft-emboss .prep,
body.aft-emboss .done,
body.aft-emboss .vid {
    background-image: linear-gradient(155deg, rgba(120, 170, 210, .10), rgba(0, 0, 0, .18)) !important;
    border-top-color: rgba(190, 220, 255, .18) !important;
    border-left-color: rgba(190, 220, 255, .12) !important;
    border-bottom-color: rgba(0, 0, 0, .6) !important;
    border-right-color: rgba(0, 0, 0, .45) !important;
    box-shadow:
        -4px -4px 10px rgba(110, 160, 210, .05),
        7px 9px 20px rgba(0, 0, 0, .5),
        inset 2px 2px 0 rgba(190, 220, 255, .12),
        inset -2px -2px 0 rgba(0, 0, 0, .4) !important;
}
body.aft-emboss .step,
body.aft-emboss .cat,
body.aft-emboss .rd-day,
body.aft-emboss .ct,
body.aft-emboss .hcd .u,
body.aft-emboss .cd div,
body.aft-emboss .tech span,
body.aft-emboss .sp-card,
body.aft-emboss .logo {
    border-top-color: rgba(190, 220, 255, .16) !important;
    border-bottom-color: rgba(0, 0, 0, .55) !important;
    box-shadow:
        -2px -2px 6px rgba(110, 160, 210, .05),
        4px 5px 12px rgba(0, 0, 0, .45),
        inset 1px 1px 0 rgba(190, 220, 255, .16),
        inset -1px -1px 0 rgba(0, 0, 0, .4) !important;
}
body.aft-emboss .cat:has(input:checked) {
    box-shadow: inset 3px 3px 8px rgba(0, 0, 0, .55), inset -2px -2px 6px rgba(110, 160, 210, .08), 0 0 0 1px var(--gold-2) !important;
}
body.aft-emboss input:not([type=checkbox]):not([type=radio]):not([type=file]),
body.aft-emboss select,
body.aft-emboss textarea,
body.aft-emboss .bank,
body.aft-emboss .ticket,
body.aft-emboss .drop,
body.aft-emboss .bar,
body.aft-emboss .quota .qbar {
    background-color: rgba(3, 10, 18, .75) !important;
    border-color: rgba(0, 0, 0, .6) !important;
    border-bottom-color: rgba(190, 220, 255, .14) !important;
    box-shadow: inset 3px 3px 8px rgba(0, 0, 0, .6), inset -2px -2px 6px rgba(110, 160, 210, .07) !important;
}
body.aft-emboss .cta,
body.aft-emboss .copy,
body.aft-emboss .add,
body.aft-emboss .icon-btn,
body.aft-emboss .del {
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, .35),
        inset 0 -2px 0 rgba(0, 0, 0, .25),
        3px 4px 10px rgba(0, 0, 0, .45) !important;
    text-shadow: 0 1px 0 rgba(255, 255, 255, .25);
    transition: transform .08s ease, box-shadow .08s ease !important;
}
body.aft-emboss .cta.ghost,
body.aft-emboss .copy,
body.aft-emboss .add,
body.aft-emboss .icon-btn { text-shadow: 0 -1px 0 rgba(0, 0, 0, .6); }
body.aft-emboss .cta:active,
body.aft-emboss .copy:active,
body.aft-emboss .add:active,
body.aft-emboss .icon-btn:active {
    transform: translateY(1px);
    box-shadow: inset 2px 3px 6px rgba(0, 0, 0, .5), inset -1px -1px 2px rgba(255, 255, 255, .12) !important;
}
body.aft-emboss .sec-title,
body.aft-emboss .sec-no,
body.aft-emboss .step .amt,
body.aft-emboss .hcd b {
    filter: drop-shadow(0 -1px 0 rgba(0, 0, 0, .7)) drop-shadow(0 1px 0 rgba(255, 255, 255, .14));
}

@media (prefers-reduced-motion: reduce) {
    .btn, .admin-menu a, .program-card, .news-card { transition: none !important; }
}