:root {  
    --gm-gold: #f4b63a;
    --gm-gold-dark: #e09b14;
    --gm-brown: #3b2414;
    --gm-brown-soft: #4b3020;
    --gm-cream: #fff6e6;
}

/* ---------------------------------------
   BASE
--------------------------------------- */
body {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    background: radial-gradient(circle at top, #fff6e6 0, #f5ead9 40%, #e8d2b9 100%);
    color: #2a160b;
}

a {
    color: var(--gm-gold-dark);
}

a:hover {
    color: #c27f06;
}

/* Main wrapper */
.gm-main {
    min-height: calc(100vh - 120px);
    padding-top: 1.5rem;
    padding-bottom: 2.5rem;
}

/* Simple section heading utility (for index + category pages) */
.gm-section-title {
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-size: 0.78rem;
    color: rgba(59,36,20,0.75);
    margin-bottom: 0.5rem;
}

.gm-section-subtitle {
    font-size: 0.9rem;
    color: rgba(59,36,20,0.7);
}

/* ---------------------------------------
   NAVBAR
--------------------------------------- */
.gm-navbar {
    background: var(--gm-brown);
    border-bottom: 1px solid rgba(0,0,0,0.25);
}

.gm-logo {
    height: 40px;
}

.gm-brand-title {
    font-size: 0.95rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #ffe9b8;
}

.gm-brand-subtitle {
    font-size: 0.78rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #f7d599;
    opacity: 0.8;
}

.gm-navbar-tagline {
    color: #f3e0c0;
    opacity: 0.85;
    font-size: 0.8rem;
}

/* ---------------------------------------
   FOOTER
--------------------------------------- */
.gm-footer {
    background: #2a160b;
    color: #f3e0c0;
    border-top: 1px solid rgba(0,0,0,0.3);
    font-size: 0.85rem;
}

.gm-footer a {
    color: #ffd984;
}

.gm-footer a:hover {
    color: #f4b63a;
}

.gm-footer-dot {
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #f4b63a;
    vertical-align: middle;
}

/* ---------------------------------------
   HERO SECTION – INDEX PAGE
--------------------------------------- */

.hero-card {
    background: linear-gradient(135deg, #3b2414, #2b170d);
    color: #f8e1b8;
    border-radius: 20px;
    padding: 2.25rem 2rem;
    position: relative;
    overflow: hidden;
    box-shadow: 0 8px 18px rgba(0,0,0,0.25);
    border: 1px solid rgba(244,182,58,0.25);
}

/* make big title consistent with candidate header tone */
.hero-card .display-5 {
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.hero-card p.lead {
    color: #f4dcc0;
}

/* optional watermark */
.hero-badge {
    position: absolute;
    right: -20px;
    top: -20px;
    width: 130px;
    opacity: 0.05;
}

/* Steps under hero */
.hero-steps {
    margin-top: 1rem;
}

.hero-step {
    display: flex;
    align-items: flex-start;
    gap: .75rem;
    padding: .5rem .85rem;
    border-radius: 999px;
    background: rgba(0,0,0,0.18);
    border: 1px solid rgba(244,182,58,0.3);
}

.hero-step h6 {
    font-size: .9rem;
    margin-bottom: 0;
    color: #ffeac0;
}

.hero-step p {
    font-size: .75rem;
    margin-bottom: 0;
    color: #f2d7aa;
}

.step-number {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .8rem;
    font-weight: 700;
    background: var(--gm-gold);
    color: #3b2414;
}

/* Circular logo on right */
.hero-logo-wrap {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.hero-logo-ring {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: #f4dca4;
    padding: 6px;
    box-shadow: 0 10px 20px rgba(0,0,0,0.25);
    position: relative;
}

.hero-logo-ring::after {
    content: "";
    position: absolute;
    inset: 12px;
    border-radius: 50%;
    border: 1px dashed rgba(59,36,20,.18);
}

.hero-logo-inner {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: #fffaf0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

/* make the crest/logo fit nicely inside the circle */
.hero-logo-inner img {
    max-width: 90%;
    max-height: 90%;
    width: auto;
    height: auto;
    object-fit: contain;
}

@media (max-width: 991.98px) {
    .hero-card {
        padding: 1.75rem 1.5rem;
    }

    .hero-logo-ring {
        width: 170px;
        height: 170px;
    }
}

/* ---------------------------------------
   CHIP – reused in hero, candidate header, category
--------------------------------------- */

.chip {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    font-size: .75rem;
    background: rgba(244,182,58,.12);
    border: 1px solid rgba(244,182,58,.6);
    color: #ffe6aa;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

.hero-card .chip {
    background: rgba(0,0,0,.3);
    border-color: rgba(244,182,58,.7);
}

/* small inline chip for "Category · Queen" */
.category-meta-chip {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    border: 1px solid rgba(244,182,58,0.7);
    background: rgba(0,0,0,0.25);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #ffeec5;
}

/* ---------------------------------------
   CATEGORY CARDS – INDEX PAGE
--------------------------------------- */

.category-card {
    border-radius: 16px;
    border: 1px solid rgba(0,0,0,0.06);
    background: #3b2414;
    color: #fbe5bd;
    cursor: pointer;
    transition: transform .12s ease, box-shadow .12s ease, border-color .12s ease, background .12s ease;
    min-height: 150px;
}

.category-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 10px 20px rgba(0,0,0,0.25);
    border-color: rgba(244,182,58,0.7);
    background: #4b3020;
}

.category-card h3 {
    font-weight: 700;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    font-size: 1rem;
}

.category-card p.small {
    color: #ffdba1;
}

.category-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,0.35);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: .9rem;
    font-weight: 700;
    color: #fbe5bd;
    background: rgba(0,0,0,0.25);
}

/* Colored initials for each category */
.category-card--queen .category-icon {
    background: #FFD8E6;
    border-color: #f2a8c8;
    color: #3b2414;
}

.category-card--king .category-icon {
    background: #D9E7FF;
    border-color: #a8bde6;
    color: #1f2b3a;
}

.category-card--fairy .category-icon {
    background: #E9DDFF;
    border-color: #bba6f0;
    color: #322447;
}

/* ---------------------------------------
   CATEGORY PAGE HEADER
--------------------------------------- */

.category-header-card {
    border-radius: 20px;
    padding: 1.75rem 2rem;
    background: linear-gradient(135deg, #3b2414, #2b170d);
    color: #f8e1b8;
    box-shadow: 0 14px 30px rgba(0,0,0,0.35);
    border: 1px solid rgba(244,182,58,0.45);
}

.category-title {
    font-size: 1.7rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    font-weight: 700;
}

.category-subtitle {
    font-size: 0.9rem;
    color: #f4dcc0;
}

/* back button styled like index */
.btn-back-soft {
    border-radius: 999px;
    border: 1px solid rgba(244,182,58,0.6);
    background: rgba(0,0,0,0.3);
    color: #ffeec0;
    padding-inline: 1rem;
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.11em;
}

.btn-back-soft:hover {
    background: rgba(0,0,0,0.5);
    color: #fff7d6;
}

/* right-side pill with category name */
.category-meta-pill {
    padding: .75rem 1.25rem;
    border-radius: 999px;
    background: rgba(0,0,0,0.25);
    border: 1px solid rgba(244,182,58,0.6);
    min-width: 180px;
}

.category-meta-pill .pill-label {
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #f4dcc0;
}

.category-meta-pill .pill-name {
    font-size: 0.95rem;
    font-weight: 600;
    color: #ffeec5;
}

/* ---------------------------------------
   CATEGORY LIST BROWN CONTAINER
--------------------------------------- */

.category-list-card {
    border-radius: 26px;
    padding: 1.6rem 2rem 2rem;
    background: #3b2414;
    border: 1px solid rgba(244,182,58,0.55);
    box-shadow: 0 18px 40px rgba(0,0,0,0.4);
    margin-bottom: 2.2rem;
}

.category-list-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1.3rem;
}

.category-list-card-header h3 {
    margin: 0;
    font-size: 0.9rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #ffeec5;
}

.category-count-chip {
    padding: 4px 12px;
    border-radius: 999px;
    border: 1px solid rgba(244,182,58,0.8);
    font-size: 0.78rem;
    color: #ffeec5;
    text-transform: uppercase;
    letter-spacing: 0.12em;
}

/* alert inside brown panel */
.category-list-card .alert {
    background: rgba(0,0,0,0.22);
    border-color: rgba(244,182,58,0.4);
    color: #ffeec5;
}

/* keep margin between brown container and viewport edges smaller on mobile */
@media (max-width: 767.98px) {
    .category-list-card {
        padding: 1.4rem 1.2rem 1.7rem;
        border-radius: 20px;
    }
}

/* ---------------------------------------
   CANDIDATE CARDS – PUBLIC LIST
--------------------------------------- */

/* Make the whole tile clickable without blue underline */
.candidate-card-link {
    text-decoration: none;
    color: inherit;
    display: block;
}

/* Card shell – cream + shadow, rounded */
.candidate-card {
    border-radius: 24px;
    overflow: hidden;
    background: #fff6e1;
    border: 1px solid rgba(0,0,0,0.05);
    box-shadow: 0 14px 30px rgba(0,0,0,0.16);
    transition: transform .18s ease, box-shadow .18s ease;
}

.candidate-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 44px rgba(0,0,0,0.28);
}

/* photo region */
.candidate-card-photo-wrap {
    position: relative;
    height: 210px;
    background: #eee2d3;
}

.candidate-card-photo-wrap .candidate-photo,
.candidate-photo {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* number badge (used where applicable) */
.candidate-number-badge {
    position: absolute;
    left: 14px;
    top: 14px;
    padding: 4px 10px;
    border-radius: 999px;
    background: #3b2414;
    border: 1px solid rgba(244,182,58,0.8);
    color: #ffeec5;
    font-size: 0.8rem;
    font-weight: 600;
}

/* Brown info panel */
.candidate-card-info {
    background: #3b2414;
    color: #ffeec5;
    padding: 1rem 1.3rem 1.15rem;
}

/* pill-like outline with text inside (QUEEN CANDIDATE) */
.candidate-chip-bar {
    display: inline-block;
    padding: 3px 12px;
    border-radius: 999px;
    border: 1px solid rgba(244,182,58,0.9);
    font-size: 0.7rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #ffeec5;
    margin-bottom: 0.55rem;
}

/* #2 · CAT */
.candidate-card-title {
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

/* Balagtas · STEM */
.candidate-card-meta {
    font-size: 0.8rem;
    color: #f4dcc0;
}

/* Total Points pill */
.candidate-points-pill {
    display: inline-block;
    padding: 4px 10px;
    border-radius: 999px;
    background: #f4b63a;
    color: #3b2414;
    font-size: 0.8rem;
    font-weight: 600;
}

/* “View profile & vote” text */
.candidate-card-cta {
    font-size: 0.8rem;
    color: #ffd98c;
}

.candidate-card:hover .candidate-card-cta {
    color: #f4b63a;
}

/* bootstrap card-based candidate list (if used) */
.candidate-card .card-title {
    font-weight: 600;
    color: #2a160b;
}

.candidate-card .text-muted {
    color: #8b6a4d !important;
    font-size: 0.78rem;
    letter-spacing: 0.06em;
}

/* make button full-width and on-brand in cards */
.candidate-card .btn-gm {
    border-radius: 999px;
    font-size: 0.9rem;
}

/* Small adjustments on mobile */
@media (max-width: 767.98px) {
    .candidate-card-photo-wrap {
        height: 190px;
    }
}

/* optional: if you keep .category-header-top for layout */
.category-header-top {
    row-gap: 0.5rem;
}

/* ---------------------------------------
   CANDIDATE HEADER – MATCH INDEX HERO
--------------------------------------- */

.candidate-header-card {
    border-radius: 24px;
    overflow: hidden;
    background: radial-gradient(circle at top left, #4b3020 0, #2b170d 55%, #1f1008 100%);
    box-shadow: 0 18px 40px rgba(0,0,0,0.4);
    border: 1px solid rgba(244,182,58,0.45);
    color: #f8e1b8;
}

.candidate-photo-wrap {
    height: 100%;
    background: #2b170d;
    border-right: 1px solid rgba(0,0,0,0.45);
}

.candidate-photo-lg {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.candidate-info {
    color: #f8e1b8;
}

.candidate-info h2 {
    letter-spacing: 0.09em;
    text-transform: uppercase;
}

.candidate-info .text-muted {
    color: #f4dcc0 !important;
    opacity: .9;
}

.candidate-info .chip {
    background: rgba(0,0,0,.35);
    border-color: rgba(244,182,58,.8);
    color: #ffeec5;
}

.candidate-info .badge-points {
    background: #f4b63a;
    color: #3b2414;
}

.candidate-info .btn-link {
    color: #ffd98c;
    text-decoration: none;
    font-weight: 500;
}

.candidate-info .btn-link:hover {
    color: #f4b63a;
    text-decoration: underline;
}

@media (max-width: 767.98px) {
    .candidate-photo-wrap {
        max-height: 260px;
        border-right: 0;
        border-bottom: 1px solid rgba(0,0,0,0.45);
    }
    .candidate-photo-lg {
        border-radius: 24px 24px 0 0;
    }
}

/* ---------------------------------------
   VOTE CARD – DARK BROWN PANEL
--------------------------------------- */

.vote-card {
    border-radius: 24px;
    background: #3b2414;
    border: 1px solid rgba(244,182,58,0.55);
    box-shadow: 0 16px 32px rgba(0,0,0,0.35);
    color: #fbe5bd;
}

.vote-card h4 {
    color: #ffeec6;
    font-size: 0.9rem;
    letter-spacing: 0.18em;
    text-transform: uppercase;
}

.vote-card .text-muted {
    color: #f4dcc0 !important;
}

/* amount list on dark background */
.amount-list {
    border-radius: 16px;
    background: #2b170d;
    padding: .5rem;
    border: 1px solid rgba(0,0,0,0.5);
}

.amount-option {
    gap: .5rem;
    border-radius: 12px;
    padding: .45rem .6rem;
    cursor: pointer;
    border: 1px solid transparent;
    background: transparent;
}

.amount-option:hover,
.amount-option:has(.form-check-input:checked) {
    background: rgba(244,182,58,0.07);
    border-color: rgba(244,182,58,0.7);
}

.amount-option .form-check-input {
    margin-top: .5rem;
    cursor: pointer;
}

/* Make label + price sit on left / right */
.amount-main {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
}

.amount-label-text {
    font-weight: 600;
    color: #ffeec6;
}

.amount-value {
    font-weight: 600;
    color: var(--gm-gold-dark);
}

.amount-subtext.small.text-muted {
    color: #e3c192 !important;
}
.qr-instructions {
  color: #4A2B17 !important;  /* dark brown, readable */
}

.qr-amount {
  font-weight: 600;
  color: #2B150A;             /* even darker for emphasis */
}

/* QR box to match golden panels from index */
.qr-box {
    border-radius: 18px;
    padding: 1.1rem 1.3rem;
    background: #fff6e1;
    border: 1px solid rgba(244,182,58,0.9);
    text-align: center;
    color: #3b2414;
}

.qr-image {
    max-width: 260px;
    border-radius: 16px;
    box-shadow: 0 8px 18px rgba(0,0,0,0.25);
}

/* ===============================
   FORM CONTROLS ON DARK CARD
   =============================== */

.vote-card .form-label {
    font-size: 0.85rem;
    color: #ffeec5;
}

.vote-card .form-control,
.vote-card .form-select,
.vote-card input[type="file"].form-control {
    background: #1e1009;
    border: 1px solid rgba(244,182,58,0.45);
    color: #ffeec5;
    border-radius: 999px;
    padding-inline: 1rem;
}

.vote-card .form-control::placeholder {
    color: rgba(255,238,197,0.6);
}

.vote-card .form-control:focus,
.vote-card .form-select:focus,
.vote-card input[type="file"].form-control:focus {
    background: #241108;
    border-color: #f4b63a;
    box-shadow: 0 0 0 .15rem rgba(244,182,58,0.35);
    color: #ffeec5;
}

.vote-card .form-select option {
    background: #3b2414;
    color: #ffeec5;
}

.vote-card .form-text {
    color: #f4dcc0;
    font-size: 0.78rem;
}

/* button already golden, just ensure it fits */
.vote-card .btn-gm {
    border-radius: 999px;
    font-size: 0.95rem;
}

/* radios on dark background */
.vote-card .form-check-input[type="radio"] {
    background-color: transparent;
    border-color: rgba(244,182,58,0.7);
}

.vote-card .form-check-input:checked {
    background-color: #f4b63a;
    border-color: #f4b63a;
}

/* ---------------------------------------
   BUTTONS
--------------------------------------- */

.btn-gm {
    background: var(--gm-gold);
    border-color: var(--gm-gold);
    color: #3b2414;
    font-weight: 600;
    border-radius: 999px;
    padding-inline: 1.5rem;
}

.btn-gm:hover {
    background: var(--gm-gold-dark);
    border-color: var(--gm-gold-dark);
    color: #30170b;
}

/* Red reject/delete button for admin actions */
.btn-reject {
    background: #c0392b;
    border-color: #c0392b;
    color: #fffaf0;
    border-radius: 999px;
    font-weight: 600;
    padding-inline: 0.9rem;
}

.btn-reject:hover {
    background: #a83225;
    border-color: #a83225;
    color: #ffffff;
}

/* ---------------------------------------
   ADMIN – TABLES ON BROWN CARDS
--------------------------------------- */

/* common admin table class */
.gm-admin-table {
    border-radius: 14px;
    overflow: hidden;
}

/* dark header strip with golden text */
.gm-table-head th {
    background: #2b170d;
    color: #ffeec5;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    border-bottom: 1px solid rgba(255,255,255,0.18);
    padding-top: 0.55rem;
    padding-bottom: 0.45rem;
}

/* body rows: cream background so you can clearly see each row */
.category-list-card .gm-admin-table tbody td {
    background: #fffaf1;
    color: #2a160b;
    border-color: rgba(0,0,0,0.05);
}

.category-list-card .gm-admin-table tbody tr:nth-child(even) td {
    background: #f6ebdd;
}

/* center the "no data" message but keep it readable */
.category-list-card .gm-admin-table tbody td.text-center {
    background: #fffaf1;
    color: #8b6a4d;
}

/* make the code-looking reference numbers a bit nicer */
.category-list-card code {
    background: rgba(0,0,0,0.04);
    padding: 2px 6px;
    border-radius: 999px;
    font-size: 0.78rem;
}

/* Slight tightening on small screens so tables don't feel huge */
@media (max-width: 767.98px) {
    .gm-admin-table th,
    .gm-admin-table td {
        padding: 0.45rem 0.55rem;
        font-size: 0.78rem;
    }
}

/* older generic table styling still works for any .table inside brown card */
.category-list-card .table {
    color: #ffeec5;
    margin-bottom: 0;
}

.category-list-card .table thead {
    background: #1c1008;
}

.category-list-card .table thead th {
    border: none;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: #ffeec5;
}

.category-list-card .table tbody tr {
    border-color: rgba(255,255,255,0.06);
}

.category-list-card .table tbody tr:nth-child(even) {
    background: rgba(255,255,255,0.02);
}

.category-list-card .table td,
.category-list-card .table th {
    padding: 0.6rem 0.75rem;
}

/* ---------------------------------------
   ADMIN LAYOUT SHELL
--------------------------------------- */

.admin-sidebar {
    min-height: 100vh;
    background: #281309;
    color: #f5e1c5;
    border-right: 1px solid rgba(0,0,0,0.35);
    box-shadow: 4px 0 16px rgba(0,0,0,0.4);
}

.admin-sidebar-logo-wrap {
    width: 56px;
    height: 56px;
    border-radius: 16px;
    background: #3b2414;
    padding: 6px;
    border: 1px solid rgba(244,182,58,0.7);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.admin-sidebar-title {
    font-size: 0.85rem;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: #ffe6b5;
    font-weight: 600;
}

.admin-sidebar-subtitle {
    font-size: 0.75rem;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #f4b63a;
    opacity: 0.9;
}

.admin-sidebar-welcome {
    color: #f5e1c5;
    opacity: 0.85;
}

/* nav links (desktop + mobile) */
.admin-nav {
    font-size: 0.9rem;
}

.admin-nav-link {
    color: #f5e1c5;
    text-decoration: none;
    border-radius: 999px;
    padding: 0.45rem 0.85rem;
    display: block;
}

.admin-nav-link:hover {
    background: rgba(244,182,58,0.12);
    color: #ffeec5;
}

.admin-nav-link.active {
    background: rgba(244,182,58,0.22);
    color: var(--gm-gold);
    font-weight: 600;
}

.admin-nav-link--muted {
    opacity: 0.85;
}

.admin-nav-link--muted:hover {
    opacity: 1;
}

/* older simple admin-sidebar link style (kept compatible) */
.admin-sidebar a {
    color: #f5e1c5;
    text-decoration: none;
}

.admin-sidebar a.active,
.admin-sidebar a:hover {
    color: var(--gm-gold);
}

/* ---------------------------------------
   MOBILE NAV CARD – MATCH BROWN THEME
--------------------------------------- */

.admin-mobile-nav-card {
    border-radius: 18px;
    background: #3b2414;
    border: 1px solid rgba(0,0,0,0.5);
    box-shadow: 0 10px 24px rgba(0,0,0,0.35);
}

.admin-mobile-nav-card .card-body {
    padding: 0.7rem 0.9rem;
}

/* override Bootstrap link color inside mobile card */
.admin-mobile-nav-card .admin-nav-link {
    color: #ffeec5;
}

.admin-mobile-nav-card .admin-nav-link:hover {
    background: rgba(244,182,58,0.16);
    color: #ffeec5;
}

.admin-mobile-nav-card .admin-nav-link.active {
    background: rgba(244,182,58,0.3);
    color: var(--gm-gold);
    font-weight: 600;
}

/* ---------------------------------------
   ADMIN – STATUS PILLS
--------------------------------------- */

.status-pill {
    display: inline-block;
    padding: 4px 12px;
    border-radius: 999px;
    font-size: 0.75rem;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 600;
}

.status-pill--verified {
    background: #f4b63a;
    color: #3b2414;
}

.status-pill--rejected {
    background: #c0392b;
    color: #fffaf0;
}

/* ---------------------------------------
   ADMIN LOGIN CARD
--------------------------------------- */

.admin-login-card {
    border-radius: 24px;
    max-width: 430px;
    margin: 0 auto;
}

.admin-login-card h4 {
    color: #ffeec6;
}

.admin-login-card p {
    color: #f4dcc0;
}

.admin-login-card a {
    color: var(--gm-gold);
}

.admin-login-card a:hover {
    color: var(--gm-gold-dark);
}

/* ---------------------------------------
   ADMIN – CARD PADDING ON MOBILE
--------------------------------------- */

@media (max-width: 767.98px) {
    .vote-card.p-3 {
        padding: 1.1rem 1.1rem 1.3rem !important;
    }

    .category-list-card {
        padding: 1.1rem 1.1rem 1.4rem;
        border-radius: 20px;
    }
}