/* ARF UI consistency layer: presentation-only overrides shared by public,
   volunteer, and admin pages. */
:root {
    --arf-navy: #1e3a8a;
    --arf-navy-dark: #0f172a;
    --arf-blue: #3b82f6;
    --arf-green: #2e8b57;
    --arf-surface: #ffffff;
    --arf-page: #f8fafc;
    --arf-text: #0f172a;
    --arf-muted: #475569;
    --arf-border: #e2e8f0;
    --arf-radius: 10px;
    --arf-radius-lg: 16px;
    --arf-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
    --arf-focus: 0 0 0 3px rgba(59, 130, 246, 0.32);
}

html { -webkit-text-size-adjust: 100%; }
body { color: var(--arf-text); overflow-x: hidden; }
img, svg, video, canvas { max-width: 100%; }
img, video { height: auto; }
button, input, select, textarea { font: inherit; }
button, [role="button"], input[type="submit"], input[type="button"] { touch-action: manipulation; }
a, button, input, select, textarea, summary { -webkit-tap-highlight-color: transparent; }

:focus-visible {
    outline: 3px solid #2563eb !important;
    outline-offset: 3px;
}

.btn, .btn-donate, .arf-notice-btn, .mobile-cta-btn, .vol-btn, .cert-btn, .btn-download {
    min-height: 44px;
    border-radius: var(--arf-radius) !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
.btn { line-height: 1.25; }
.btn:disabled, button:disabled { cursor: not-allowed; }

.btn:hover, .btn-donate:hover, .arf-notice-btn:hover, .vol-btn:hover, .cert-btn:hover, .btn-download:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 12px rgba(15, 23, 42, 0.12);
}

.btn:active, .btn-donate:active, .vol-btn:active {
    transform: translateY(0);
}

input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
select,
textarea,
.form-control {
    border-color: var(--arf-border) !important;
    border-radius: var(--arf-radius) !important;
    min-height: 44px;
    color: var(--arf-text) !important;
    transition: border-color 0.2s, box-shadow 0.2s;
}
textarea { min-height: 110px; resize: vertical; }
input:focus, select:focus, textarea:focus, .form-control:focus {
    border-color: var(--arf-blue) !important;
    box-shadow: var(--arf-focus) !important;
    outline: none !important;
}

.card, .content-card, .section-container, .modal-content,
.arf-notice-popup-card, .login-card, .auth-card,
.vol-stat-card, .stat-card, .chart-card, .volunteer-stat-card,
.quick-action-card, .gallery-card, .cert-card {
    border: 1px solid var(--arf-border) !important;
    border-radius: var(--arf-radius-lg) !important;
    box-shadow: var(--arf-shadow) !important;
    transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.card:hover, .content-card:hover, .vol-stat-card:hover, .stat-card:hover,
.chart-card:hover, .volunteer-stat-card:hover, .quick-action-card:hover,
.gallery-card:hover, .cert-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 20px rgba(15, 23, 42, 0.08) !important;
}

.table-wrapper, .table-responsive { -webkit-overflow-scrolling: touch; }
table { border-color: var(--arf-border); }
th { color: var(--arf-muted); }
.modal, .arf-notice-popup-overlay { padding: 16px; }

@media (min-width: 1025px) {
    /* Desktop navigation must remain available without a menu interaction. */
    .admin-sidebar { transform: translateX(0) !important; }
    .admin-main { margin-left: 280px !important; }
    .admin-topbar { margin-left: 20px !important; }
    .sidebar-close, .menu-toggle { display: none !important; }
}

/* Older admin screens use .active, newer screens use .open. */
.admin-sidebar.active { transform: translateX(0) !important; }
.sidebar-backdrop.active, .sidebar-backdrop.visible { display: block; }

@media (max-width: 1024px) {
    .admin-main { margin-left: 0 !important; }
    .admin-sidebar { transform: translateX(-100%) !important; }
    .admin-sidebar.open, .admin-sidebar.active { transform: translateX(0) !important; }
    .sidebar-close, .menu-toggle { display: inline-flex !important; }
}

@media (max-width: 768px) {
    .nav-container { padding-inline: 1rem; }
    .logo { font-size: 1.05rem; gap: 6px; }
    .logo-image { width: 34px; height: 34px; }
    .page-content { padding: 1.25rem 1rem; }
    .dashboard-header { padding-inline: 1rem; }
    .user-info { display: none; }
    .user-dropdown { padding: 0.25rem; }
    .mobile-overlay-menu { height: 100dvh; }
    .mobile-overlay-header, .mobile-overlay-footer { padding-inline: 1rem; }
    .mobile-nav-link { min-height: 52px; padding-inline: 1rem; }
    .modal-content, .arf-notice-popup-card { width: min(100%, 560px) !important; max-height: calc(100dvh - 32px); overflow: auto; }
}

@media (max-width: 480px) {
    section { padding-inline: 1rem; }
    .hero-content, .registration-form-area { padding-inline: 1rem; }
    .hero-buttons, .about-buttons { gap: 0.75rem; }
    .hero-buttons .btn, .about-buttons .btn { width: 100%; }
    .btn, .btn-donate { width: auto; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
    }
}