/* ============================================================
   ISIGWEBO - MAIN STYLES
   ============================================================ */

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    background: #f0f2f5;
    color: #333;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* ============================================================
   HEADER
   ============================================================ */
header {
    background: #1a252f;
    color: #fff;
    padding: 15px 30px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    border-bottom: 3px solid #e74c5e;
}

header .logo a {
    color: #fff;
    text-decoration: none;
    font-size: 24px;
    font-weight: bold;
}

header .logo span {
    color: #e74c5e;
}

header nav {
    display: flex;
    gap: 20px;
    align-items: center;
    flex-wrap: wrap;
}

header nav a {
    color: #ccc;
    text-decoration: none;
    font-size: 14px;
    transition: color 0.3s;
}

header nav a:hover {
    color: #fff;
}

header nav .btn-login {
    background: #e74c5e;
    color: #fff;
    padding: 6px 16px;
    border-radius: 20px;
}

header nav .btn-login:hover {
    background: #c0392b;
}

header nav .btn-signup {
    background: #2c3e50;
    color: #fff;
    padding: 6px 16px;
    border-radius: 20px;
    border: 1px solid #fff;
}

header nav .btn-signup:hover {
    background: #fff;
    color: #2c3e50;
}

header .theme-toggle {
    background: none;
    border: 1px solid #555;
    color: #fff;
    padding: 6px 12px;
    border-radius: 20px;
    cursor: pointer;
    font-size: 16px;
}

/* ============================================================
   HEADER SOCIAL ICONS - GLOW
   ============================================================ */
header nav .social-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #aaa;
    transition: all 0.3s ease;
    padding: 4px;
}

header nav .social-icon svg {
    width: 20px;
    height: 20px;
    fill: #aaa;
    transition: all 0.3s ease;
}

header nav .social-icon:hover {
    transform: scale(1.15);
}

header nav .social-icon[title="Facebook"]:hover svg {
    fill: #1877f2 !important;
    filter: drop-shadow(0 0 12px #1877f2) drop-shadow(0 0 24px #1877f2);
}

header nav .social-icon[title="Twitter/X"]:hover svg {
    fill: #000 !important;
    filter: drop-shadow(0 0 12px #000) drop-shadow(0 0 24px #000);
}

header nav .social-icon[title="Instagram"]:hover svg {
    fill: #e1306c !important;
    filter: drop-shadow(0 0 12px #e1306c) drop-shadow(0 0 24px #e1306c);
}

header nav .social-icon[title="TikTok"]:hover svg {
    fill: #000 !important;
    filter: drop-shadow(0 0 12px #000) drop-shadow(0 0 24px #000);
}

/* ============================================================
   MAIN CONTENT
   ============================================================ */
main {
    flex: 1;
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px;
    width: 100%;
}

/* ============================================================
   HOMEPAGE
   ============================================================ */
.hero {
    text-align: center;
    padding: 40px 20px;
    background: linear-gradient(135deg, #2c3e50, #1a252f);
    border-radius: 12px;
    color: #fff;
    margin-bottom: 30px;
}

.hero h1 {
    font-size: 42px;
    margin-bottom: 10px;
}

.hero h1 span {
    color: #e74c5e;
}

.hero p {
    font-size: 18px;
    opacity: 0.8;
}

.btn-primary {
    display: inline-block;
    padding: 12px 30px;
    background: #e74c5e;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    transition: background 0.3s;
}

.btn-primary:hover {
    background: #c0392b;
}

.stats-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 20px;
    margin-bottom: 30px;
}

.stat-card {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    text-align: center;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    border: 1px solid #eee;
}

.stat-card .number {
    font-size: 36px;
    font-weight: bold;
    color: #2c3e50;
    display: block;
}

.stat-card .label {
    font-size: 14px;
    color: #666;
}

.search-box {
    display: flex;
    gap: 10px;
    margin: 20px 0;
    flex-wrap: wrap;
}

.search-box form {
    display: flex;
    gap: 10px;
    width: 100%;
    flex-wrap: wrap;
}

.search-box input {
    flex: 1;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    min-width: 200px;
}

.search-box button {
    padding: 12px 24px;
    background: #2c3e50;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
}

.search-box button:hover {
    background: #e74c5e;
}

.issue-card {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    margin-bottom: 15px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    border: 1px solid #eee;
}

.issue-card a {
    text-decoration: none;
    color: inherit;
}

.issue-card h3 {
    color: #2c3e50;
    margin-bottom: 8px;
}

.issue-card p {
    color: #555;
    font-size: 14px;
    margin-bottom: 8px;
}

.issue-card .meta {
    font-size: 12px;
    color: #999;
}

.issues-section h2 {
    color: #2c3e50;
    margin-bottom: 20px;
}

.top-locations {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.location-tag {
    background: #f8f9fa;
    padding: 8px 16px;
    border-radius: 20px;
    border: 1px solid #eee;
    font-size: 14px;
}

.location-tag strong {
    color: #2c3e50;
}

/* ============================================================
   FOOTER
   ============================================================ */
footer {
    background: #1a252f;
    color: #ccc;
    padding: 30px 20px;
    text-align: center;
    margin-top: auto;
    border-top: 2px solid #e74c5e;
}

footer .footer-content {
    max-width: 1200px;
    margin: 0 auto;
}

footer .footer-brand p {
    font-size: 18px;
    margin-bottom: 5px;
}

footer .footer-brand .small {
    font-size: 14px;
    opacity: 0.6;
}

.footer-social {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
    margin: 15px 0;
}

.footer-social a {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    color: #888;
    text-decoration: none;
    transition: all 0.3s ease;
    padding: 8px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.03);
}

.footer-social a svg {
    width: 28px;
    height: 28px;
    transition: all 0.3s ease;
    filter: drop-shadow(0 0 2px rgba(255, 255, 255, 0.1));
}

.footer-social a:hover svg {
    filter: drop-shadow(0 0 15px rgba(255, 255, 255, 0.6)) drop-shadow(0 0 30px rgba(255, 255, 255, 0.3));
    transform: scale(1.15);
}

.footer-social a:hover {
    color: #fff;
    background: rgba(255, 255, 255, 0.08);
}

.social-label {
    font-size: 10px;
    color: #666;
    opacity: 0;
    transition: opacity 0.05s ease;
    font-weight: 500;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    white-space: nowrap;
}

.footer-social a:hover .social-label {
    opacity: 1;
    color: #fff;
}

.footer-social a[title="Facebook"]:hover svg {
    filter: drop-shadow(0 0 20px rgba(59, 89, 152, 0.8)) drop-shadow(0 0 40px rgba(59, 89, 152, 0.4));
}
.footer-social a[title="Facebook"]:hover .social-label {
    color: #3b5998;
}

.footer-social a[title="Instagram"]:hover svg {
    filter: drop-shadow(0 0 20px rgba(225, 48, 108, 0.8)) drop-shadow(0 0 40px rgba(225, 48, 108, 0.4));
}
.footer-social a[title="Instagram"]:hover .social-label {
    color: #e1306c;
}

.footer-social a[title="TikTok"]:hover svg {
    filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.8)) drop-shadow(0 0 40px rgba(0, 0, 0, 0.4));
}
.footer-social a[title="TikTok"]:hover .social-label {
    color: #000;
}

.footer-social a[title="Twitter"]:hover svg {
    filter: drop-shadow(0 0 20px rgba(0, 0, 0, 0.8)) drop-shadow(0 0 40px rgba(0, 0, 0, 0.4));
}
.footer-social a[title="Twitter"]:hover .social-label {
    color: #000;
}

footer .footer-copyright {
    font-size: 13px;
    opacity: 0.6;
    margin-top: 10px;
}

/* ============================================================
   MAP PAGE
   ============================================================ */
.map-page h1 {
    font-size: 32px;
    color: #2c3e50;
    margin-bottom: 10px;
}

.map-page > p {
    color: #666;
    margin-bottom: 20px;
}

.map-filters {
    display: flex;
    gap: 10px;
    margin-bottom: 15px;
    flex-wrap: wrap;
}

.map-filters .btn {
    padding: 8px 20px;
    border: 2px solid #ddd;
    border-radius: 20px;
    background: #fff;
    color: #333;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    transition: all 0.3s ease;
}

.map-filters .btn:hover {
    background: #f0f0f0;
    border-color: #bbb;
}

.map-filters .btn.active {
    background: #2c3e50;
    color: #fff;
    border-color: #2c3e50;
}

.map-filters .btn.active:hover {
    background: #1a252f;
}

#map {
    height: 500px;
    border-radius: 12px;
    border: 1px solid #e8e0d8;
    width: 100%;
}

.map-legend {
    display: flex;
    gap: 20px;
    margin-top: 15px;
    padding: 12px 16px;
    background: #fff;
    border-radius: 8px;
    border: 1px solid #eee;
    font-size: 14px;
    color: #555;
}

.legend-dot {
    display: inline-block;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    margin-right: 6px;
    vertical-align: middle;
    border: 2px solid #fff;
    box-shadow: 0 0 0 1px #ddd;
}

#mapSearchStatus {
    font-size: 13px;
    color: #8a8a8a;
    margin-bottom: 12px;
    min-height: 20px;
}

.search-row {
    display: flex;
    gap: 10px;
    margin-bottom: 16px;
    flex-wrap: wrap;
}

.search-row input {
    flex: 1;
    padding: 10px 14px;
    background: #faf8f5;
    border: 1px solid #ddd6cc;
    border-radius: 8px;
    font-size: 14px;
    color: #1a1a1a;
    min-width: 200px;
}

.search-row input:focus {
    outline: none;
    border-color: #2c3e50;
}

.search-row .btn {
    padding: 10px 24px;
    background: #2c3e50;
    color: #fff;
    border: none;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    transition: background 0.3s;
    white-space: nowrap;
    position: relative;
}

.search-row .btn:hover {
    background: #e74c5e;
}

.search-row .btn:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* ============================================================
   ISSUE PAGE
   ============================================================ */
.issue-page {
    max-width: 900px;
    margin: 0 auto;
    padding: 30px 20px;
}
.issue-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    margin-bottom: 20px;
}
.issue-header .category {
    background: #3498db;
    color: #fff;
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
    margin-right: 10px;
}
.issue-header .status {
    padding: 4px 14px;
    border-radius: 20px;
    font-size: 13px;
    font-weight: 600;
}
.issue-header .status.pending {
    background: #f1c40f;
    color: #333;
}
.issue-header .status.resolved {
    background: #2ecc71;
    color: #fff;
}
.issue-header .status.in-progress {
    background: #3498db;
    color: #fff;
}
.issue-header .days {
    font-size: 14px;
    color: #666;
    margin-left: 10px;
}
.issue-page h1 {
    font-size: 32px;
    color: #2c3e50;
    margin: 10px 0;
}
.issue-description {
    font-size: 16px;
    color: #444;
    line-height: 1.7;
    margin-bottom: 20px;
}
.issue-photo {
    margin: 20px 0;
    border-radius: 12px;
    overflow: hidden;
    border: 1px solid #eee;
}
.issue-photo img {
    width: 100%;
    max-height: 400px;
    object-fit: cover;
}
.issue-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    padding: 15px 0;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    margin: 15px 0;
    font-size: 14px;
    color: #666;
}
.issue-stats span {
    display: flex;
    align-items: center;
    gap: 4px;
}
.issue-social {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    margin: 15px 0;
    padding: 12px 16px;
    background: #f8f9fa;
    border-radius: 8px;
}
.issue-social .social-label {
    font-weight: 600;
    color: #333;
    margin-right: 5px;
}

.issue-social a svg {
    width: 28px;
    height: 28px;
    transition: all 0.3s ease !important;
    fill: #888 !important;
}

.issue-social a:hover {
    transform: scale(1.1);
}

.issue-social a[title="Facebook"]:hover svg {
    fill: #1877f2 !important;
    filter: drop-shadow(0 0 20px #1877f2) drop-shadow(0 0 40px #1877f2) !important;
}

.issue-social a[title="Twitter"]:hover svg {
    fill: #000 !important;
    filter: drop-shadow(0 0 20px #000) drop-shadow(0 0 40px #000) !important;
}

.issue-social a[title="Instagram"]:hover svg {
    fill: #e1306c !important;
    filter: drop-shadow(0 0 20px #e1306c) drop-shadow(0 0 40px #e1306c) !important;
}

.issue-social a[title="TikTok"]:hover svg {
    fill: #000 !important;
    filter: drop-shadow(0 0 20px #000) drop-shadow(0 0 40px #000) !important;
}

.issue-votes {
    display: flex;
    gap: 15px;
    align-items: center;
    margin: 20px 0;
    flex-wrap: wrap;
}
.issue-votes .vote-btn {
    padding: 10px 25px;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: transform 0.2s;
}
.issue-votes .vote-btn:hover {
    transform: scale(1.05);
}
.issue-votes .vote-btn:first-child {
    background: #2ecc71;
    color: #fff;
}
.issue-votes .vote-btn:last-child {
    background: #e74c5e;
    color: #fff;
}
#voteMessage {
    font-weight: 600;
    font-size: 14px;
}
.issue-flag {
    background: #fff;
    padding: 20px;
    border-radius: 12px;
    border: 1px solid #eee;
    margin: 20px 0;
}
.issue-flag h3 {
    margin: 0 0 12px 0;
    color: #2c3e50;
}
.issue-flag select {
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 8px;
    font-size: 14px;
    margin-right: 10px;
    min-width: 180px;
}
.issue-flag .btn-flag {
    padding: 10px 24px;
    background: #e74c5e;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s;
}
.issue-flag .btn-flag:hover {
    background: #c0392b;
}
#flagMessage {
    margin-top: 10px;
    font-weight: 600;
}
.issue-comments {
    margin-top: 30px;
}
.issue-comments h3 {
    color: #2c3e50;
    margin-bottom: 15px;
}
.issue-comments #commentText {
    width: 100%;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 8px;
    min-height: 80px;
    font-size: 14px;
    box-sizing: border-box;
    resize: vertical;
}
.issue-comments .btn {
    margin-top: 10px;
    padding: 10px 30px;
    background: #2c3e50;
    color: #fff;
    border: none;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.3s;
}
.issue-comments .btn:hover {
    background: #e74c5e;
}
.comment-list {
    margin-top: 20px;
}
.comment {
    background: #f8f9fa;
    padding: 15px;
    border-radius: 8px;
    margin-bottom: 10px;
}
.comment strong {
    color: #2c3e50;
}
.comment-date {
    color: #999;
    font-size: 12px;
    margin-left: 10px;
}
.comment p {
    margin: 8px 0 0 0;
    color: #444;
}
.empty {
    color: #999;
    font-style: italic;
    padding: 15px 0;
}
.btn-download {
    display: inline-block;
    padding: 8px 18px;
    background: #2c3e50;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 600;
    font-size: 14px;
    transition: background 0.3s;
}
.btn-download:hover {
    background: #e74c5e;
}

/* ============================================================
   DARK MODE
   ============================================================ */
body.dark-mode {
    background: #1a1a2e;
    color: #e0e0e0;
}

body.dark-mode .stat-card,
body.dark-mode .issue-card,
body.dark-mode .report-card,
body.dark-mode .party-card,
body.dark-mode .profile-section,
body.dark-mode .province-section,
body.dark-mode .evidence-item,
body.dark-mode .comment,
body.dark-mode .issue-flag,
body.dark-mode .map-legend,
body.dark-mode .login-box,
body.dark-mode .profile-box,
body.dark-mode .admin-issue-card,
body.dark-mode .banned-user-card,
body.dark-mode .party-evidence-group {
    background: #16213e;
    border-color: #2a3a5e;
    color: #e0e0e0;
}

body.dark-mode .stat-card .number,
body.dark-mode .issue-card h3,
body.dark-mode .profile-section h2,
body.dark-mode .province-section h2,
body.dark-mode .issue-page h1,
body.dark-mode .report-page h1,
body.dark-mode .map-page h1,
body.dark-mode .parties-page h1,
body.dark-mode .leaderboard-page h1,
body.dark-mode .profile-page h1 {
    color: #e0e0e0;
}

body.dark-mode .stat-card .label,
body.dark-mode .issue-card .meta,
body.dark-mode .issue-stats,
body.dark-mode .meta-info span,
body.dark-mode .empty {
    color: #999;
}

body.dark-mode .search-box input,
body.dark-mode .report-card input,
body.dark-mode .report-card select,
body.dark-mode .report-card textarea,
body.dark-mode .issue-comments #commentText,
body.dark-mode .issue-flag select {
    background: #1a1a2e;
    color: #e0e0e0;
    border-color: #2a3a5e;
}

body.dark-mode .issue-social {
    background: #16213e;
}

body.dark-mode .province-header {
    background: #0d1b2a;
}

body.dark-mode .hero {
    background: linear-gradient(135deg, #0d1b2a, #1a1a2e);
}

body.dark-mode header {
    background: #0d1b2a;
}

body.dark-mode footer {
    background: #0d1b2a;
}

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 768px) {
    header {
        flex-direction: column;
        text-align: center;
        padding: 15px;
    }
    header nav {
        justify-content: center;
    }
    .hero h1 {
        font-size: 28px;
    }
    .search-box form {
        flex-direction: column;
    }
    .footer-social {
        gap: 15px;
        flex-wrap: wrap;
    }
    .footer-social a svg {
        width: 24px;
        height: 24px;
    }
    .social-label {
        font-size: 9px;
    }
    .issue-header {
        flex-direction: column;
        align-items: flex-start;
    }
    .issue-stats {
        gap: 12px;
    }
    .issue-social {
        flex-direction: column;
        align-items: flex-start;
    }
    .report-card .form-row {
        grid-template-columns: 1fr;
    }
    .report-card {
        padding: 20px;
    }
}

/* ===== BACK BUTTON ===== */
.back-btn {
    display: inline-block;
    margin-bottom: 20px;
    color: #2c3e50;
    text-decoration: none;
    font-weight: 500;
    padding: 8px 16px;
    background: #f8f9fa;
    border-radius: 8px;
    transition: all 0.2s;
    border: 1px solid #eee;
    cursor: pointer;
    font-size: 14px;
}
.back-btn:hover {
    background: #e9ecef;
    text-decoration: none;
    transform: translateX(-3px);
}
.back-btn i {
    margin-right: 6px;
}

body.dark-mode .back-btn {
    background: #262636;
    color: #ecf0f1;
    border-color: #2a2a3a;
}
body.dark-mode .back-btn:hover {
    background: #2d2d40;
}

/* ===== HOVER EFFECT FOR ISSUE CARDS ===== */
.issue-card {
    cursor: pointer;
    transition: all 0.2s;
}
.issue-card:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.12);
}
.issue-card a {
    text-decoration: none;
    color: inherit;
    display: block;
}
body.dark-mode .issue-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.5);
}

/* ===== PAGE NAVIGATION ARROWS ===== */
.page-nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 0;
    margin: 10px 0 20px 0;
    border-bottom: 1px solid #eee;
    flex-wrap: wrap;
    gap: 10px;
}
.page-nav-bottom {
    border-top: 1px solid #eee;
    border-bottom: none;
    margin-top: 30px;
    padding-top: 15px;
}
.page-nav a {
    color: #2c3e50;
    text-decoration: none;
    font-size: 14px;
    font-weight: 500;
    padding: 6px 14px;
    border-radius: 6px;
    transition: background 0.2s;
    display: inline-flex;
    align-items: center;
    gap: 6px;
}
.page-nav a:hover {
    background: #f0f0f0;
}
.page-nav .nav-links {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
}
.page-nav .nav-links a {
    font-weight: 400;
    color: #888;
    padding: 4px 10px;
    font-size: 13px;
}
.page-nav .nav-links a:hover {
    background: #f0f0f0;
    color: #2c3e50;
}
.page-nav .nav-links a.active {
    color: #2c3e50;
    font-weight: 600;
}
.page-nav .arrow {
    font-size: 16px;
    padding: 6px 14px;
}
.page-nav .arrow:hover {
    background: #f0f0f0;
    border-radius: 6px;
}

body.dark-mode .page-nav {
    border-bottom-color: #2a2a3a;
}
body.dark-mode .page-nav-bottom {
    border-top-color: #2a2a3a;
}
body.dark-mode .page-nav a {
    color: #b0b0b0;
}
body.dark-mode .page-nav a:hover {
    background: #2a2a3a;
    color: #ecf0f1;
}
body.dark-mode .page-nav .nav-links a {
    color: #666;
}
body.dark-mode .page-nav .nav-links a:hover {
    background: #2a2a3a;
    color: #ecf0f1;
}
body.dark-mode .page-nav .nav-links a.active {
    color: #ecf0f1;
}

/* ===== NAVIGATION HIGHLIGHT ===== */
header nav a.active {
    color: #fff;
    font-weight: 600;
    border-bottom: 2px solid #e74c5e;
    padding-bottom: 2px;
}

header nav a.active:hover {
    color: #fff;
}

body.dark-mode header nav a.active {
    color: #fff;
    border-bottom-color: #e74c5e;
}

/* ===== CURSOR FIXES ===== */
a,
button,
input[type="submit"],
input[type="button"],
.clickable,
.stat-card,
.issue-card,
.party-card,
.expand-btn,
.view-reports-btn,
.province-tag,
.admin-issue-card,
.leaderboard-item,
.back-link,
.back-btn,
.btn,
.cta-link,
.nav-links a,
.arrow,
.footer-social a,
header nav a,
input[type="checkbox"],
input[type="radio"] {
    cursor: pointer;
}

.stat-card,
.stat-card *,
.issue-card,
.issue-card *,
.party-card,
.party-card *,
.admin-issue-card,
.admin-issue-card *,
.leaderboard-item,
.leaderboard-item * {
    cursor: pointer !important;
}

input[type="text"],
input[type="email"],
input[type="password"],
input[type="number"],
input[type="tel"],
input[type="search"],
textarea,
select,
.contenteditable {
    cursor: text;
}

p, h1, h2, h3, h4, h5, h6, span, div, label, li,
.meta, .status-badge, .province-count, .town-name, .town-count,
.stat-card .label, .stat-card .number, .issue-card .meta,
.location-tag, .no-data, .empty, .social-label, .footer-copyright,
.hero p, .hero h1, .about-section p, .about-section h2,
.terms-section p, .terms-section h2,
.evidence-item .title, .evidence-item .date, .evidence-item .description, .evidence-item .amount,
.minister-item .name, .minister-item .role,
.comment .author, .comment .date, .comment .text,
.report-stats .stat-card .number, .report-stats .stat-card .label {
    cursor: default;
}

button:disabled,
input:disabled,
a.disabled,
.btn:disabled {
    cursor: not-allowed;
}

.party-profile .stat-card,
.party-profile .stat-card * {
    cursor: default !important;
}

.footer-social a[title="YouTube"]:hover svg {
    fill: #ff0000 !important;
    filter: drop-shadow(0 0 20px rgba(255, 0, 0, 0.8)) drop-shadow(0 0 40px rgba(255, 0, 0, 0.4)) !important;
}

header nav .social-icon[title="YouTube"]:hover svg {
    fill: #ff0000 !important;
    filter: drop-shadow(0 0 15px rgba(255, 0, 0, 0.7)) !important;
}

header nav .social-icon[title="Facebook"]:hover svg {
    fill: #1877f2 !important;
    filter: drop-shadow(0 0 15px rgba(24, 119, 242, 0.7)) !important;
}

header nav .social-icon[title="Instagram"]:hover svg {
    fill: #e1306c !important;
    filter: drop-shadow(0 0 15px rgba(225, 48, 108, 0.7)) !important;
}

/* ===== KILL BLUE FOCUS/TAP HIGHLIGHT ===== */
a, button, .social-logo, .map-filters .btn {
    -webkit-tap-highlight-color: transparent;
}

a:focus, button:focus, .social-logo:focus, .map-filters .btn:focus {
    outline: none;
    box-shadow: 0 0 0 2px rgba(44, 62, 80, 0.25);
    border-radius: 6px;
}

.social-logo {
    display: inline-block;
    transition: transform 0.18s ease, box-shadow 0.18s ease, filter 0.18s ease;
}
.social-logo:hover {
    transform: scale(1.12);
    filter: brightness(1.1);
}
.social-logo:active {
    transform: scale(0.95);
    box-shadow: 0 0 0 3px rgba(44, 62, 80, 0.2);
}
/* Kill focus ring on issue card links */
.issue-card a:focus,
.issue-card a:focus-visible,
.issue-card a:focus-within,
.issue-card a:active {
    outline: 0 !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
    border: 0 !important;
    -webkit-tap-highlight-color: transparent !important;
}

.issue-card:focus,
.issue-card:focus-visible,
.issue-card:focus-within {
    outline: 0 !important;
    outline-offset: 0 !important;
    box-shadow: none !important;
}
a:focus,
a:focus-visible,
a:focus-within,
a:active {
    outline: 0 !important;
    outline-offset: 0 !important;
}
.footer-social a[title="Facebook"]:hover svg {
    fill: #1877f2 !important;
    filter: drop-shadow(0 0 20px #1877f2) drop-shadow(0 0 40px #1877f2) !important;
}

.footer-social a[title="Instagram"]:hover svg {
    fill: #e1306c !important;
    filter: drop-shadow(0 0 20px #e1306c) drop-shadow(0 0 40px #e1306c) !important;
}
.back-link:focus,
.back-link:focus-visible,
.back-link:active {
    background: #f8f9fa !important;
    outline: 0 !important;
}

body.dark-mode .back-link:focus,
body.dark-mode .back-link:focus-visible,
body.dark-mode .back-link:active {
    background: #262636 !important;
}
/* Locations page: clickable towns need visible hover + pointer cursor */
.town-item a {
    cursor: pointer !important;
    transition: background 0.15s ease;
    padding: 10px 8px;
    margin: 0 -8px;
    border-radius: 6px;
}

.town-item a:hover {
    background: #f0f2f5;
}

.town-item a:hover .town-name,
.town-item a:hover .town-count {
    color: #2c3e50;
}

body.dark-mode .town-item a:hover {
    background: #2a2a3a;
}

body.dark-mode .town-item a:hover .town-name,
body.dark-mode .town-item a:hover .town-count {
    color: #ecf0f1;
}

/* Kill focus ring on back links and town links */
.back-link:focus,
.back-link:focus-visible,
.back-link:active,
.town-item a:focus,
.town-item a:focus-visible,
.town-item a:active {
    outline: 0 !important;
    box-shadow: none !important;
}

.back-link:focus,
.back-link:focus-visible {
    background: #f8f9fa !important;
}

body.dark-mode .back-link:focus,
body.dark-mode .back-link:focus-visible {
    background: #262636 !important;
}
/* Make the whole town row the click target */
.town-item {
    padding: 0;
    cursor: pointer;
    border-radius: 6px;
    transition: background 0.15s ease;
}

.town-item a {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 12px 8px;
    cursor: pointer !important;
    outline: 0 !important;
}

.town-item:hover {
    background: #f0f2f5;
}

.town-item a:hover .town-name,
.town-item a:hover .town-count {
    color: #2c3e50;
}

body.dark-mode .town-item:hover {
    background: #2a2a3a;
}

body.dark-mode .town-item a:hover .town-name,
body.dark-mode .town-item a:hover .town-count {
    color: #ecf0f1;
}
.town-item a,
.town-item a *,
.town-item .town-name,
.town-item .town-name *,
.town-item .town-count,
.town-item .town-count * {
    cursor: pointer !important;
}