@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap');

:root {
    --primary-red: #8B0000;
    --accent-gold: #D4AF37;
    --bg-glass: rgba(255, 255, 255, .12);
    --border-glass: rgba(255, 255, 255, .20);
    --text-main: #fff;
    --text-muted: rgba(255, 255, 255, .80);
}
* { margin:0; padding:0; box-sizing:border-box; }
html { min-height:100%; }
body {
    min-height:100vh;
    min-height:100dvh;
    padding:24px 16px;
    display:flex;
    justify-content:center;
    align-items:center;
    background:linear-gradient(135deg,#4A0000 0%,#8B0000 50%,#1a0000 100%);
    color:var(--text-main);
    font-family:'Plus Jakarta Sans',Arial,sans-serif;
    -webkit-font-smoothing:antialiased;
}
a { color:inherit; text-decoration:none; }
button { font:inherit; }
.wrapper {
    width:100%;
    max-width:520px;
    padding:36px 24px 28px;
    background:var(--bg-glass);
    -webkit-backdrop-filter:blur(16px);
    backdrop-filter:blur(16px);
    border:1px solid var(--border-glass);
    border-radius:28px;
    box-shadow:0 20px 40px rgba(0,0,0,.4);
}
.header { text-align:center; margin-bottom:28px; }
.logo-container {
    width:90px; height:90px; margin:0 auto 16px;
    display:flex; align-items:center; justify-content:center;
    overflow:hidden; border-radius:50%; background:#fff;
    border:3px solid var(--accent-gold);
    box-shadow:0 8px 24px rgba(0,0,0,.25);
}
.logo-container img { width:75%; height:75%; object-fit:contain; }
.logo-fallback {
    width:70%; height:70%; display:grid; place-items:center;
    background:var(--primary-red); color:#fff; font-size:16px; font-weight:800;
}
.header h1 { font-size:clamp(16px,3.8vw,20px); line-height:1.35; font-weight:800; text-transform:uppercase; margin-bottom:4px; }
.header p { font-size:13px; line-height:1.5; color:var(--text-muted); font-weight:500; }
.nav-tabs {
    display:flex; gap:6px; background:rgba(0,0,0,.20);
    padding:4px; border-radius:14px; margin-bottom:24px;
}
.tab-btn {
    flex:1; min-width:0; background:transparent; border:0;
    color:var(--text-muted); padding:11px 5px; font-size:clamp(10px,2.5vw,13px);
    line-height:1.25; font-weight:700; border-radius:10px; cursor:pointer;
    transition:background .2s,color .2s,box-shadow .2s;
}
.tab-btn.active { background:#fff; color:var(--primary-red); box-shadow:0 4px 12px rgba(0,0,0,.15); }
.tab-btn:focus-visible { outline:2px solid var(--accent-gold); outline-offset:2px; }
.tab-content { display:none; }
.tab-content.active { display:block; }
.links-list,.card-list { display:flex; flex-direction:column; gap:12px; }
.card-list { max-height:350px; overflow-y:auto; padding-right:3px; }
.social-btn {
    display:flex; align-items:center; justify-content:space-between; gap:12px;
    background:rgba(255,255,255,.96); color:#1a1a1a;
    padding:13px 17px; border-radius:16px; font-size:14px; font-weight:600;
    box-shadow:0 4px 15px rgba(0,0,0,.10);
    transition:transform .2s,background .2s,box-shadow .2s;
}
.social-btn:hover { background:#fff; transform:translateY(-2px); box-shadow:0 6px 20px rgba(0,0,0,.2); }
.left-content { display:flex; align-items:center; gap:14px; min-width:0; }
.left-content > i { flex:0 0 24px; width:24px; text-align:center; font-size:20px; color:var(--primary-red); }
.link-label { display:flex; flex-direction:column; gap:2px; min-width:0; }
.link-label strong { font-size:14px; }
.link-label small { color:#686868; font-size:11px; font-weight:500; overflow-wrap:anywhere; }
.link-chevron { flex:0 0 auto; color:#888; font-size:12px; }
.info-card {
    background:rgba(255,255,255,.10);
    border:1px solid rgba(255,255,255,.15);
    padding:14px 18px; border-radius:14px;
}
.card-date { display:block; color:var(--accent-gold); font-size:11px; font-weight:800; text-transform:uppercase; margin-bottom:5px; }
.info-card h4 { color:#fff; font-size:14px; font-weight:700; line-height:1.45; margin-bottom:5px; }
.info-card p { color:var(--text-muted); font-size:12px; line-height:1.55; overflow-wrap:anywhere; }
.footer { text-align:center; margin-top:28px; font-size:11px; line-height:1.5; color:rgba(255,255,255,.65); }
[hidden] { display:none !important; }

@media (max-width:480px) {
    body { padding:18px 12px; }
    .wrapper { padding:30px 16px 24px; border-radius:24px; }
    .header { margin-bottom:24px; }
    .logo-container { width:84px; height:84px; margin-bottom:14px; }
    .header h1 { font-size:16px; }
    .header p { font-size:12px; }
    .nav-tabs { gap:3px; margin-bottom:20px; }
    .tab-btn { padding:11px 3px; font-size:10px; }
    .social-btn { padding:13px 14px; }
    .footer { margin-top:24px; font-size:10px; }
}
@media (max-width:360px) {
    .wrapper { padding-left:12px; padding-right:12px; }
    .tab-btn { font-size:9px; }
}

/* FIX: Restore admin dashboard styles without changing the public page */
body.admin-body {
    display: block !important;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    background: #f6f7fb !important;
    color: #171923 !important;
    font-family: 'DM Sans', Arial, sans-serif;
    align-items: initial;
    justify-content: initial;
}

.admin-body * {
    box-sizing: border-box;
}

.admin-wrap {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    padding: 28px 22px;
}

.admin-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
    color: #171923;
}

.admin-top h1 {
    margin: 0;
    color: #171923;
    font: 800 25px/1.3 'Manrope', Arial, sans-serif;
}

.admin-top p {
    margin: 5px 0 0;
    color: #777b88;
    font-size: 13px;
}

.admin-body a {
    text-decoration: none;
}

.admin-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 22px;
}

.admin-nav a,
.admin-body .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 13px;
    border: 1px solid #e6e7ee;
    border-radius: 9px;
    background: #fff;
    color: #393b46;
    font: 600 12px 'DM Sans', Arial, sans-serif;
    cursor: pointer;
}

.admin-nav a.active,
.admin-body .btn-primary {
    background: #7c2d3c;
    color: #fff;
    border-color: #7c2d3c;
}

.admin-body .btn-danger {
    color: #b42332;
}

.admin-panel {
    margin-bottom: 18px;
    padding: 22px;
    overflow: hidden;
    background: #fff;
    color: #171923;
    border: 1px solid #e8e9ef;
    border-radius: 15px;
}

.admin-panel h2 {
    margin: 0 0 17px;
    color: #171923;
    font: 700 17px 'Manrope', Arial, sans-serif;
}

.stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin-bottom: 18px;
}

.stat {
    padding: 18px;
    background: #fff;
    border: 1px solid #e8e9ef;
    border-radius: 14px;
}

.stat strong {
    display: block;
    color: #171923;
    font: 800 27px 'Manrope', Arial, sans-serif;
}

.stat span {
    color: #777b88;
    font-size: 12px;
}

.table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.admin-body table {
    width: 100%;
    border-collapse: collapse;
    color: #171923;
    font-size: 12px;
}

.admin-body th,
.admin-body td {
    padding: 12px 10px;
    border-bottom: 1px solid #eff0f4;
    text-align: left;
    vertical-align: middle;
}

.admin-body th {
    color: #777b88;
    font-size: 10px;
    letter-spacing: .8px;
    text-transform: uppercase;
}

.table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.table-actions form {
    margin: 0;
}

.badge {
    padding: 5px 8px;
    border-radius: 20px;
    background: #eaf8f0;
    color: #20794d;
    font-size: 10px;
}

.badge.off {
    background: #f0f0f3;
    color: #777;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.field.full {
    grid-column: 1 / -1;
}

.field label {
    color: #252630;
    font-size: 12px;
    font-weight: 700;
}

.admin-body .field input,
.admin-body .field textarea,
.admin-body .field select {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #dedfe7;
    border-radius: 9px;
    background: #fff;
    color: #252630;
    font: 13px 'DM Sans', Arial, sans-serif;
}

.admin-body .field textarea {
    min-height: 105px;
    resize: vertical;
}

.field small {
    color: #777b88;
    font-size: 11px;
}

.check-field {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #252630;
    font-size: 12px;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 17px;
}

.admin-body .flash {
    margin-bottom: 15px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #eaf8f0;
    color: #216e49;
    font-size: 13px;
}

.admin-body .flash.error {
    background: #fff0f0;
    color: #a12632;
}

.admin-body .login-box {
    width: calc(100% - 32px);
    max-width: 410px;
    margin: 8vh auto;
    padding: 28px;
    border: 1px solid #e8e9ef;
    border-radius: 18px;
    background: #fff;
    color: #171923;
    box-shadow: 0 15px 40px rgba(32, 32, 48, .06);
}

.admin-body .login-box h1 {
    margin: 0 0 6px;
    color: #171923;
    font: 800 24px 'Manrope', Arial, sans-serif;
}

.admin-body .login-box > p {
    margin: 0 0 23px;
    color: #777b88;
    font-size: 13px;
}

.admin-body .login-box .field {
    margin-bottom: 15px;
}

.logo-preview {
    display: block;
    max-width: 220px;
    max-height: 90px;
    margin: 8px 0;
    padding: 12px;
    border: 1px dashed #d9dae2;
    border-radius: 10px;
    object-fit: contain;
}

@media (max-width: 600px) {
    .admin-wrap {
        padding: 20px 13px;
    }

    .admin-top {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-top h1 {
        font-size: 21px;
    }

    .admin-panel {
        padding: 15px;
    }

    .stats {
        gap: 7px;
    }

    .stat {
        padding: 12px;
        min-width: 0;
    }

    .stat strong {
        font-size: 22px;
    }

    .stat span {
        font-size: 10px;
    }

    .form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .field.full {
        grid-column: auto;
    }

    .admin-nav a {
        padding: 9px 10px;
    }
}

/* FIX: Restore admin dashboard styles without changing the public page */
body.admin-body {
    display: block !important;
    min-height: 100vh;
    margin: 0;
    padding: 0;
    background: #f6f7fb !important;
    color: #171923 !important;
    font-family: 'DM Sans', Arial, sans-serif;
    align-items: initial;
    justify-content: initial;
}

.admin-body * {
    box-sizing: border-box;
}

.admin-wrap {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    padding: 28px 22px;
}

.admin-top {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 20px;
    margin-bottom: 24px;
    color: #171923;
}

.admin-top h1 {
    margin: 0;
    color: #171923;
    font: 800 25px/1.3 'Manrope', Arial, sans-serif;
}

.admin-top p {
    margin: 5px 0 0;
    color: #777b88;
    font-size: 13px;
}

.admin-body a {
    text-decoration: none;
}

.admin-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 22px;
}

.admin-nav a,
.admin-body .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    padding: 10px 13px;
    border: 1px solid #e6e7ee;
    border-radius: 9px;
    background: #fff;
    color: #393b46;
    font: 600 12px 'DM Sans', Arial, sans-serif;
    cursor: pointer;
}

.admin-nav a.active,
.admin-body .btn-primary {
    background: #7c2d3c;
    color: #fff;
    border-color: #7c2d3c;
}

.admin-body .btn-danger {
    color: #b42332;
}

.admin-panel {
    margin-bottom: 18px;
    padding: 22px;
    overflow: hidden;
    background: #fff;
    color: #171923;
    border: 1px solid #e8e9ef;
    border-radius: 15px;
}

.admin-panel h2 {
    margin: 0 0 17px;
    color: #171923;
    font: 700 17px 'Manrope', Arial, sans-serif;
}

.stats {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 13px;
    margin-bottom: 18px;
}

.stat {
    padding: 18px;
    background: #fff;
    border: 1px solid #e8e9ef;
    border-radius: 14px;
}

.stat strong {
    display: block;
    color: #171923;
    font: 800 27px 'Manrope', Arial, sans-serif;
}

.stat span {
    color: #777b88;
    font-size: 12px;
}

.table-wrap {
    max-width: 100%;
    overflow-x: auto;
}

.admin-body table {
    width: 100%;
    border-collapse: collapse;
    color: #171923;
    font-size: 12px;
}

.admin-body th,
.admin-body td {
    padding: 12px 10px;
    border-bottom: 1px solid #eff0f4;
    text-align: left;
    vertical-align: middle;
}

.admin-body th {
    color: #777b88;
    font-size: 10px;
    letter-spacing: .8px;
    text-transform: uppercase;
}

.table-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.table-actions form {
    margin: 0;
}

.badge {
    padding: 5px 8px;
    border-radius: 20px;
    background: #eaf8f0;
    color: #20794d;
    font-size: 10px;
}

.badge.off {
    background: #f0f0f3;
    color: #777;
}

.form-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 15px;
}

.field {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.field.full {
    grid-column: 1 / -1;
}

.field label {
    color: #252630;
    font-size: 12px;
    font-weight: 700;
}

.admin-body .field input,
.admin-body .field textarea,
.admin-body .field select {
    width: 100%;
    padding: 11px 12px;
    border: 1px solid #dedfe7;
    border-radius: 9px;
    background: #fff;
    color: #252630;
    font: 13px 'DM Sans', Arial, sans-serif;
}

.admin-body .field textarea {
    min-height: 105px;
    resize: vertical;
}

.field small {
    color: #777b88;
    font-size: 11px;
}

.check-field {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #252630;
    font-size: 12px;
}

.form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 17px;
}

.admin-body .flash {
    margin-bottom: 15px;
    padding: 12px 14px;
    border-radius: 10px;
    background: #eaf8f0;
    color: #216e49;
    font-size: 13px;
}

.admin-body .flash.error {
    background: #fff0f0;
    color: #a12632;
}

.admin-body .login-box {
    width: calc(100% - 32px);
    max-width: 410px;
    margin: 8vh auto;
    padding: 28px;
    border: 1px solid #e8e9ef;
    border-radius: 18px;
    background: #fff;
    color: #171923;
    box-shadow: 0 15px 40px rgba(32, 32, 48, .06);
}

.admin-body .login-box h1 {
    margin: 0 0 6px;
    color: #171923;
    font: 800 24px 'Manrope', Arial, sans-serif;
}

.admin-body .login-box > p {
    margin: 0 0 23px;
    color: #777b88;
    font-size: 13px;
}

.admin-body .login-box .field {
    margin-bottom: 15px;
}

.logo-preview {
    display: block;
    max-width: 220px;
    max-height: 90px;
    margin: 8px 0;
    padding: 12px;
    border: 1px dashed #d9dae2;
    border-radius: 10px;
    object-fit: contain;
}

@media (max-width: 600px) {
    .admin-wrap {
        padding: 20px 13px;
    }

    .admin-top {
        align-items: flex-start;
        flex-direction: column;
    }

    .admin-top h1 {
        font-size: 21px;
    }

    .admin-panel {
        padding: 15px;
    }

    .stats {
        gap: 7px;
    }

    .stat {
        padding: 12px;
        min-width: 0;
    }

    .stat strong {
        font-size: 22px;
    }

    .stat span {
        font-size: 10px;
    }

    .form-grid {
        grid-template-columns: minmax(0, 1fr);
    }

    .field.full {
        grid-column: auto;
    }

    .admin-nav a {
        padding: 9px 10px;
    }
}

/* Logo: fit neatly inside the circular frame */
.brand img,
.brand-mark,
.site-header .brand img,
.site-header .brand-mark {
    width: 84px;
    height: 84px;
    box-sizing: border-box;
    border-radius: 50%;
    object-fit: contain;
    object-position: center;
    padding: 5px;
    background: #fff;
    border: 3px solid #d9b53b;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* Final logo fit adjustment */
.brand img,
.site-header .brand img {
    width: 84px !important;
    height: 84px !important;
    padding: 0 !important;
    border: 3px solid #d9b53b !important;
    border-radius: 50% !important;
    object-fit: cover !important;
    object-position: center !important;
    background: #fff !important;
    display: block;
}