/*
 | Sumnima Paruhang — responsive UI upgrade
 | Shared visual layer for the current admin, legacy dashboard, public site and auth pages.
 | This file intentionally contains presentation-only overrides so existing workflows remain unchanged.
 */

:root {
    --sp-brown-950: #2f1b12;
    --sp-brown-900: #3d2418;
    --sp-brown-800: #52311f;
    --sp-brown-700: #684027;
    --sp-brown-600: #7d5232;
    --sp-gold-600: #c38a1f;
    --sp-gold-500: #dda82e;
    --sp-gold-400: #ecc65c;
    --sp-cream-50: #fffdf8;
    --sp-cream-100: #fbf6ed;
    --sp-cream-200: #f3eadc;
    --sp-ink: #2d241f;
    --sp-muted: #74675e;
    --sp-line: #e8dfd3;
    --sp-success: #2f7751;
    --sp-danger: #b5473f;
    --sp-info: #356b86;
    --sp-shadow-sm: 0 2px 10px rgba(61, 36, 24, .05);
    --sp-shadow-md: 0 16px 42px rgba(61, 36, 24, .10);
    --sp-shadow-lg: 0 28px 70px rgba(47, 27, 18, .16);
    --sp-radius-sm: 10px;
    --sp-radius-md: 16px;
    --sp-radius-lg: 22px;
    --sp-transition: 180ms ease;
}

html {
    scroll-behavior: smooth;
}

body {
    text-rendering: optimizeLegibility;
}

button,
a,
input,
select,
textarea {
    -webkit-tap-highlight-color: transparent;
}

button,
a,
[role="button"] {
    touch-action: manipulation;
}

:focus-visible {
    outline: 3px solid rgba(221, 168, 46, .34);
    outline-offset: 3px;
}

::selection {
    color: #fff;
    background: var(--sp-brown-700);
}

/* --------------------------------------------------------------------------
   Primary administration layout
   -------------------------------------------------------------------------- */
.admin-body {
    --admin-navy: var(--sp-brown-950);
    --admin-navy-soft: var(--sp-brown-800);
    --admin-red: var(--sp-brown-700);
    --admin-red-dark: var(--sp-brown-900);
    --admin-gold: var(--sp-gold-500);
    --admin-bg: #f7f4ef;
    --admin-surface: #ffffff;
    --admin-border: var(--sp-line);
    --admin-text: var(--sp-ink);
    --admin-muted: var(--sp-muted);
    --sidebar-width: 282px;
    --topbar-height: 74px;
    --radius: var(--sp-radius-md);
    --shadow: var(--sp-shadow-md);
    background:
        radial-gradient(circle at 100% 0, rgba(221, 168, 46, .08), transparent 27rem),
        #f7f4ef;
    font-family: "Poppins", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.admin-body .admin-sidebar {
    background:
        radial-gradient(circle at 12% 5%, rgba(236, 198, 92, .13), transparent 15rem),
        linear-gradient(180deg, #43281b 0%, #2f1b12 58%, #25150e 100%);
    border-right: 0;
    box-shadow: 14px 0 36px rgba(47, 27, 18, .10);
}

.admin-body .sidebar-brand {
    min-height: var(--topbar-height);
    padding: 13px 18px;
    border-bottom-color: rgba(255, 255, 255, .09);
}

.admin-body .sidebar-mark {
    width: 46px;
    height: 46px;
    color: var(--sp-brown-950);
    background: linear-gradient(145deg, #f3d370, #d8a52d);
    border: 1px solid rgba(255, 255, 255, .25);
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
    font-weight: 800;
}

.admin-body .sidebar-brand-copy strong {
    font-size: 15px;
    letter-spacing: -.01em;
}

.admin-body .sidebar-brand-copy small {
    color: rgba(255, 255, 255, .55);
    font-size: 10px;
    letter-spacing: .03em;
}

.admin-body .sidebar-nav {
    padding: 16px 12px 28px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255, 255, 255, .18) transparent;
}

.admin-body .sidebar-nav > a,
.admin-body .nav-disabled {
    min-height: 45px;
    margin-bottom: 4px;
    padding: 10px 12px;
    border: 1px solid transparent;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 580;
}

.admin-body .sidebar-nav > a {
    color: rgba(255, 255, 255, .70);
}

.admin-body .sidebar-nav > a:hover {
    color: #fff;
    background: rgba(255, 255, 255, .075);
    border-color: rgba(255, 255, 255, .05);
    transform: translateX(3px);
}

.admin-body .sidebar-nav > a.active {
    position: relative;
    color: var(--sp-brown-950);
    background: linear-gradient(135deg, #fff8e8, #f4dfad);
    border-color: rgba(255, 255, 255, .28);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
}

.admin-body .sidebar-nav > a.active::after {
    position: absolute;
    top: 50%;
    right: 9px;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--sp-gold-600);
    content: "";
    transform: translateY(-50%);
}

.admin-body .sidebar-nav > a svg {
    width: 19px;
    height: 19px;
}

.admin-body .nav-heading {
    margin: 23px 11px 9px;
    color: rgba(255, 255, 255, .38);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: .15em;
}

.admin-body .nav-code {
    width: 25px;
    height: 25px;
    color: rgba(255, 255, 255, .58);
    border-color: rgba(255, 255, 255, .13);
    border-radius: 8px;
}

.admin-body .sidebar-nav > a.active .nav-code {
    color: var(--sp-brown-800);
    background: rgba(104, 64, 39, .08);
    border-color: rgba(104, 64, 39, .16);
}

.admin-body .sidebar-footer {
    padding: 14px 12px;
    background: rgba(0, 0, 0, .07);
    border-top-color: rgba(255, 255, 255, .08);
}

.admin-body .sidebar-footer a {
    min-height: 44px;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .06);
    border-radius: 12px;
}

.admin-body .admin-topbar {
    min-height: var(--topbar-height);
    padding-inline: clamp(18px, 2.3vw, 34px);
    background: rgba(255, 253, 248, .88);
    border-bottom-color: rgba(104, 64, 39, .12);
    box-shadow: 0 8px 25px rgba(61, 36, 24, .035);
    backdrop-filter: blur(18px) saturate(140%);
}

.admin-body .topbar-title small {
    color: var(--sp-gold-600);
    font-size: 9px;
    font-weight: 750;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.admin-body .topbar-title strong {
    color: var(--sp-brown-950);
    font-size: 15px;
    letter-spacing: -.01em;
}

.admin-body .sidebar-toggle,
.admin-body .profile-menu-trigger {
    border-color: var(--sp-line);
    background: rgba(255, 255, 255, .82);
    box-shadow: var(--sp-shadow-sm);
}

.admin-body .profile-menu-trigger:hover,
.admin-body .profile-menu.open .profile-menu-trigger {
    border-color: rgba(195, 138, 31, .38);
    background: #fff;
}

.admin-body .profile-menu-panel {
    overflow: hidden;
    border: 1px solid var(--sp-line);
    border-radius: 16px;
    box-shadow: var(--sp-shadow-lg);
}

.admin-body .language-switcher.compact {
    border-color: var(--sp-line);
    background: rgba(255, 255, 255, .72);
}

.admin-body .language-switcher.compact a.active {
    color: #fff;
    background: var(--sp-brown-700);
}

.admin-body .admin-content {
    width: min(1520px, 100%);
    padding: clamp(20px, 2.6vw, 38px);
}

.admin-body .page-header,
.admin-body .page-intro {
    margin-bottom: 24px;
}

.admin-body .page-header h1,
.admin-body .page-intro h1 {
    color: var(--sp-brown-950);
    font-size: clamp(24px, 2.7vw, 36px);
    letter-spacing: -.035em;
}

.admin-body .page-header p,
.admin-body .page-intro p {
    color: var(--sp-muted);
    line-height: 1.7;
}

.admin-body .eyebrow {
    color: var(--sp-gold-600) !important;
    font-weight: 800;
}

.admin-body .back-link,
.admin-body .text-link,
.admin-body .text-button {
    color: var(--sp-brown-700);
}

.admin-body .panel,
.admin-body .stat-card,
.admin-body .overview-card,
.admin-body .quick-action-card,
.admin-body .metric-card,
.admin-body .table-card,
.admin-body .form-card,
.admin-body .detail-card,
.admin-body .filter-panel {
    border-color: var(--sp-line);
    border-radius: var(--sp-radius-md);
    box-shadow: var(--sp-shadow-sm);
}

.admin-body .panel,
.admin-body .stat-card,
.admin-body .overview-card,
.admin-body .quick-action-card,
.admin-body .metric-card,
.admin-body .table-card,
.admin-body .form-card,
.admin-body .detail-card {
    background: rgba(255, 255, 255, .94);
}

.admin-body .panel {
    overflow: hidden;
}

.admin-body .panel-header {
    min-height: 76px;
    padding: 18px 22px;
    border-bottom-color: var(--sp-line);
    background: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 253, 248, .65));
}

.admin-body .panel-header h2,
.admin-body .section-heading h2,
.admin-body .registry-header h2 {
    color: var(--sp-brown-950);
    font-size: 17px;
    letter-spacing: -.02em;
}

.admin-body .button {
    min-height: 44px;
    padding-inline: 17px;
    border-radius: 11px;
    font-size: 12px;
    font-weight: 720;
    box-shadow: none;
}

.admin-body .button:hover {
    transform: translateY(-2px);
}

.admin-body .button.primary {
    color: #fff;
    background: linear-gradient(135deg, var(--sp-brown-700), var(--sp-brown-900));
    border-color: var(--sp-brown-800);
    box-shadow: 0 10px 20px rgba(82, 49, 31, .18);
}

.admin-body .button.primary:hover {
    background: linear-gradient(135deg, var(--sp-brown-800), var(--sp-brown-950));
}

.admin-body .button.secondary {
    color: var(--sp-brown-950);
    background: linear-gradient(135deg, #f4dc92, #e2ae37);
    border-color: #d4a02f;
}

.admin-body .button.ghost {
    color: var(--sp-brown-800);
    background: #fff;
    border-color: var(--sp-line);
}

.admin-body .button.ghost:hover {
    border-color: rgba(125, 82, 50, .35);
    background: var(--sp-cream-50);
}

.admin-body .dashboard-hero {
    overflow: hidden;
    border: 1px solid rgba(236, 198, 92, .16);
    border-radius: 24px;
    background:
        radial-gradient(circle at 90% 15%, rgba(236, 198, 92, .24), transparent 20rem),
        linear-gradient(135deg, #4b2d1e 0%, #2f1b12 70%);
    box-shadow: 0 22px 54px rgba(47, 27, 18, .16);
}

.admin-body .dashboard-kicker {
    color: var(--sp-gold-400);
}

.admin-body .dashboard-hero h1 {
    letter-spacing: -.04em;
}

.admin-body .dashboard-identity-row {
    color: rgba(255, 255, 255, .62);
}

.admin-body .dashboard-section-heading h2 {
    color: var(--sp-brown-950);
    letter-spacing: -.025em;
}

.admin-body .quick-action-card,
.admin-body .overview-card {
    position: relative;
    overflow: hidden;
    transition: transform var(--sp-transition), border-color var(--sp-transition), box-shadow var(--sp-transition);
}

.admin-body .quick-action-card::after,
.admin-body .overview-card::after {
    position: absolute;
    inset: auto -30px -50px auto;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    background: rgba(221, 168, 46, .07);
    content: "";
    pointer-events: none;
}

.admin-body .quick-action-card:hover,
.admin-body .overview-card:hover {
    border-color: rgba(195, 138, 31, .34);
    box-shadow: var(--sp-shadow-md);
    transform: translateY(-4px);
}

.admin-body .quick-action-icon {
    color: var(--sp-brown-900);
    background: linear-gradient(145deg, #f8e9b6, #e7bd55);
    box-shadow: inset 0 0 0 1px rgba(125, 82, 50, .08);
}

.admin-body .overview-card strong,
.admin-body .stat-card strong {
    color: var(--sp-brown-950);
}

.admin-body .overview-card-label,
.admin-body .stat-card > span {
    color: var(--sp-brown-700);
}

.admin-body .filter-bar,
.admin-body .filter-panel {
    padding: 15px;
    border-color: var(--sp-line);
    border-radius: 14px;
    background: rgba(255, 253, 248, .85);
}

.admin-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
.admin-body select,
.admin-body textarea,
.admin-body .search-input,
.admin-body .search-control {
    border-color: #ded4c8;
    border-radius: 11px;
    background: #fff;
    color: var(--sp-ink);
    transition: border-color var(--sp-transition), box-shadow var(--sp-transition), background var(--sp-transition);
}

.admin-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):hover,
.admin-body select:hover,
.admin-body textarea:hover {
    border-color: #cbbbac;
}

.admin-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.admin-body select:focus,
.admin-body textarea:focus,
.admin-body .search-input:focus,
.admin-body .search-control:focus {
    border-color: var(--sp-gold-600);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(221, 168, 46, .13);
}

.admin-body input[type="checkbox"],
.admin-body input[type="radio"] {
    accent-color: var(--sp-brown-700);
}

.admin-body input[type="file"] {
    max-width: 100%;
}

.admin-body .form-section {
    padding: clamp(20px, 2.2vw, 30px);
}

.admin-body .form-actions {
    gap: 10px;
    padding: 18px clamp(20px, 2.2vw, 30px);
    background: var(--sp-cream-50);
    border-top-color: var(--sp-line);
}

.admin-body .table-wrap {
    position: relative;
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-color: #c7b6a7 transparent;
    scrollbar-width: thin;
}

.admin-body .table-wrap.is-scrollable::after,
.legacy-admin-body .table-wrap.is-scrollable::after {
    position: sticky;
    right: 10px;
    bottom: 8px;
    display: block;
    width: max-content;
    margin: -28px 10px 8px auto;
    padding: 4px 8px;
    color: var(--sp-muted);
    background: rgba(255, 253, 248, .9);
    border: 1px solid var(--sp-line);
    border-radius: 999px;
    content: "Swipe to view more →";
    font-size: 9px;
    font-weight: 700;
    pointer-events: none;
    backdrop-filter: blur(8px);
}

.admin-body .data-table {
    min-width: 720px;
}

.admin-body .data-table th {
    padding: 13px 16px;
    color: #7d6e64;
    background: #fcf8f2;
    border-bottom-color: var(--sp-line);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.admin-body .data-table td {
    padding: 15px 16px;
    border-bottom-color: #eee7de;
    font-size: 12px;
}

.admin-body .data-table tbody tr {
    transition: background var(--sp-transition);
}

.admin-body .data-table tbody tr:hover {
    background: #fffaf1;
}

.admin-body .data-table td strong {
    color: var(--sp-brown-950);
}

.admin-body .status-pill,
.admin-body .status-badge,
.admin-body .tag-badge {
    border-radius: 999px;
    font-weight: 750;
}

.admin-body .empty-state {
    padding: 34px 22px;
    color: var(--sp-muted);
}

.admin-body .alert {
    position: relative;
    padding: 14px 44px 14px 16px;
    border-radius: 13px;
    box-shadow: var(--sp-shadow-sm);
}

.admin-body .pagination a,
.admin-body .pagination span,
.admin-body .pagination-button {
    border-radius: 10px;
}

/* --------------------------------------------------------------------------
   Legacy dashboard layout still used by a small set of modules
   -------------------------------------------------------------------------- */
.legacy-admin-body {
    --page: #f7f4ef;
    --surface: #ffffff;
    --surface-soft: #fbf6ed;
    --surface-hover: #f3eadc;
    --border: var(--sp-line);
    --text: var(--sp-ink);
    --muted: var(--sp-muted);
    --subtle: #9a8b80;
    --primary: var(--sp-brown-700);
    --primary-dark: var(--sp-brown-950);
    --primary-soft: #f0e2d3;
    --accent: var(--sp-gold-600);
    --shadow-sm: var(--sp-shadow-sm);
    --shadow-md: var(--sp-shadow-md);
    --radius-sm: 11px;
    --radius-md: 16px;
    --radius-lg: 22px;
    background:
        radial-gradient(circle at 100% 0, rgba(221, 168, 46, .08), transparent 26rem),
        var(--page);
    font-family: "Poppins", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.legacy-admin-body .sidebar {
    background:
        radial-gradient(circle at 15% 5%, rgba(236, 198, 92, .13), transparent 15rem),
        linear-gradient(180deg, #43281b, #2f1b12 65%, #25150e);
    box-shadow: 14px 0 36px rgba(47, 27, 18, .10);
}

.legacy-admin-body .sidebar .brand__mark {
    color: var(--sp-brown-950);
    background: linear-gradient(145deg, #f3d370, #d8a52d);
    border-radius: 14px;
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
}

.legacy-admin-body .sidebar .nav-link {
    border: 1px solid transparent;
    border-radius: 12px;
}

.legacy-admin-body .sidebar .nav-link:hover {
    border-color: rgba(255, 255, 255, .05);
}

.legacy-admin-body .sidebar .nav-link.is-active {
    color: var(--sp-brown-950);
    background: linear-gradient(135deg, #fff8e8, #f4dfad);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .16);
}

.legacy-admin-body .topbar {
    min-height: 74px;
    padding-inline: clamp(16px, 2.3vw, 32px);
    background: rgba(255, 253, 248, .88);
    border-bottom-color: rgba(104, 64, 39, .12);
    box-shadow: 0 8px 25px rgba(61, 36, 24, .035);
    backdrop-filter: blur(18px) saturate(140%);
}

.legacy-admin-body .dashboard-content {
    width: min(1520px, 100%);
    margin-inline: auto;
    padding: clamp(20px, 2.6vw, 38px);
}

.legacy-admin-body .panel,
.legacy-admin-body .stat-card,
.legacy-admin-body .form-card,
.legacy-admin-body .table-panel {
    border-color: var(--sp-line);
    border-radius: var(--sp-radius-md);
    box-shadow: var(--sp-shadow-sm);
}

.legacy-admin-body .panel__header,
.legacy-admin-body .panel-header {
    min-height: 74px;
    background: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 253, 248, .65));
}

.legacy-admin-body .button:not(.button--danger) {
    border-radius: 11px;
}

.legacy-admin-body .button--primary,
.legacy-admin-body .button.primary {
    background: linear-gradient(135deg, var(--sp-brown-700), var(--sp-brown-950));
    box-shadow: 0 10px 20px rgba(82, 49, 31, .18);
}

.legacy-admin-body .table-wrap {
    max-width: 100%;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
    scrollbar-color: #c7b6a7 transparent;
    scrollbar-width: thin;
}

.legacy-admin-body .data-table {
    min-width: 720px;
}

.legacy-admin-body .data-table th {
    background: #fcf8f2;
}

.legacy-admin-body .data-table tbody tr:hover {
    background: #fffaf1;
}

.legacy-admin-body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]):focus,
.legacy-admin-body select:focus,
.legacy-admin-body textarea:focus {
    border-color: var(--sp-gold-600);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(221, 168, 46, .13);
}

/* --------------------------------------------------------------------------
   Public website
   -------------------------------------------------------------------------- */
.public-site-body {
    background: #fffdf8;
    color: var(--sp-ink);
    font-family: "Poppins", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.public-site-body .container {
    width: min(1180px, calc(100% - clamp(32px, 6vw, 64px)));
}

.public-site-body .site-header {
    box-shadow: 0 8px 28px rgba(47, 27, 18, .055);
}

.public-site-body .site-header.is-scrolled {
    box-shadow: 0 12px 36px rgba(47, 27, 18, .11);
}

.public-site-body .top-strip {
    background: var(--sp-brown-950);
}

.public-site-body .top-trust > span {
    color: var(--sp-gold-400);
}

.public-site-body .header-main {
    min-height: 84px;
}

.public-site-body .brand-mark {
    color: var(--sp-brown-950);
    background: linear-gradient(145deg, #f3d370, #d8a52d);
    border-radius: 15px;
    box-shadow: 0 10px 22px rgba(61, 36, 24, .12);
}

.public-site-body .brand-copy strong {
    color: var(--sp-brown-950);
    letter-spacing: -.02em;
}

.public-site-body .primary-nav > a {
    position: relative;
    border-radius: 10px;
    font-weight: 650;
}

.public-site-body .primary-nav > a:not(.nav-cta):hover,
.public-site-body .primary-nav > a:not(.nav-cta).active {
    color: var(--sp-brown-800);
    background: #fbf3e5;
}

.public-site-body .primary-nav > a:not(.nav-cta).active::after {
    position: absolute;
    right: 12px;
    bottom: 5px;
    left: 12px;
    height: 2px;
    border-radius: 99px;
    background: var(--sp-gold-600);
    content: "";
}

.public-site-body .nav-cta,
.public-site-body .button-primary,
.public-site-body .button.button-primary {
    color: #fff;
    background: linear-gradient(135deg, var(--sp-brown-700), var(--sp-brown-950));
    border-color: var(--sp-brown-800);
    box-shadow: 0 10px 22px rgba(82, 49, 31, .18);
}

.public-site-body .button,
.public-site-body .footer-button {
    min-height: 44px;
    border-radius: 12px;
    font-weight: 720;
    transition: transform var(--sp-transition), box-shadow var(--sp-transition), background var(--sp-transition);
}

.public-site-body .button:hover,
.public-site-body .footer-button:hover {
    transform: translateY(-2px);
}

.public-site-body .section {
    padding-block: clamp(58px, 7vw, 94px);
}

.public-site-body .section-topline {
    gap: 24px;
    margin-bottom: clamp(28px, 4vw, 44px);
}

.public-site-body .section-topline h2,
.public-site-body .page-hero h1,
.public-site-body .hero h1,
.public-site-body .home-hero h1 {
    letter-spacing: -.045em;
}

.public-site-body .eyebrow {
    color: var(--sp-brown-700);
    font-weight: 800;
    letter-spacing: .13em;
}

.public-site-body :is(.project-card, .community-card, .video-card, .home-video-card, .public-card, .supporter-list, .public-empty-state, .transparency-card) {
    border-color: var(--sp-line);
    border-radius: var(--sp-radius-lg);
    box-shadow: var(--sp-shadow-sm);
    transition: transform var(--sp-transition), border-color var(--sp-transition), box-shadow var(--sp-transition);
}

.public-site-body :is(.project-card, .community-card, .video-card, .home-video-card, .public-card):hover {
    border-color: rgba(195, 138, 31, .32);
    box-shadow: var(--sp-shadow-md);
    transform: translateY(-5px);
}

.public-site-body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea) {
    border-radius: 12px;
    transition: border-color var(--sp-transition), box-shadow var(--sp-transition);
}

.public-site-body :is(input:not([type="checkbox"]):not([type="radio"]), select, textarea):focus {
    border-color: var(--sp-gold-600);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(221, 168, 46, .13);
}

.public-site-body .site-footer {
    background:
        radial-gradient(circle at 8% 0, rgba(236, 198, 92, .12), transparent 22rem),
        linear-gradient(180deg, #3d2418, #25150e);
}

.public-site-body .footer-seal {
    color: var(--sp-brown-950);
    background: linear-gradient(145deg, #f3d370, #d8a52d);
}

/* --------------------------------------------------------------------------
   Authentication pages
   -------------------------------------------------------------------------- */
.guest-page {
    background: #f7f4ef;
    font-family: "Poppins", Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.guest-page .guest-shell {
    min-height: 100svh;
}

.guest-page .guest-visual {
    overflow: hidden;
    background:
        radial-gradient(circle at 15% 10%, rgba(236, 198, 92, .22), transparent 18rem),
        radial-gradient(circle at 90% 85%, rgba(221, 168, 46, .12), transparent 23rem),
        linear-gradient(145deg, #4b2d1e, #2f1b12 72%);
}

.guest-page .guest-visual::after {
    position: absolute;
    right: -12vw;
    bottom: -18vw;
    width: 42vw;
    height: 42vw;
    border: 1px solid rgba(255, 255, 255, .08);
    border-radius: 50%;
    content: "";
}

.guest-page .guest-brand .brand__mark {
    color: var(--sp-brown-950);
    background: linear-gradient(145deg, #f3d370, #d8a52d);
    border-radius: 14px;
}

.guest-page .guest-content {
    background:
        radial-gradient(circle at 100% 0, rgba(221, 168, 46, .08), transparent 22rem),
        #fffdf8;
}

.guest-page .auth-card,
.guest-page .guest-card,
.guest-page form {
    border-radius: var(--sp-radius-lg);
}

.guest-page input:not([type="checkbox"]):not([type="radio"]),
.guest-page select,
.guest-page textarea {
    border-radius: 12px;
}

.guest-page input:not([type="checkbox"]):not([type="radio"]):focus,
.guest-page select:focus,
.guest-page textarea:focus {
    border-color: var(--sp-gold-600);
    outline: 0;
    box-shadow: 0 0 0 4px rgba(221, 168, 46, .13);
}

/* --------------------------------------------------------------------------
   Responsive behavior
   -------------------------------------------------------------------------- */
@media (max-width: 1180px) {
    .admin-body .quick-action-grid,
    .admin-body .overview-card-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .admin-body .dashboard-content-grid,
    .admin-body .dashboard-grid,
    .legacy-admin-body .dashboard-grid--main,
    .legacy-admin-body .dashboard-grid {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 980px) {
    body.sidebar-open,
    body:has(.admin-shell.sidebar-open),
    body:has(.dashboard-shell.sidebar-open) {
        overflow: hidden;
    }

    .admin-body .admin-sidebar,
    .legacy-admin-body .sidebar {
        box-shadow: 20px 0 60px rgba(24, 13, 8, .30);
    }

    .admin-body .admin-topbar,
    .legacy-admin-body .topbar {
        padding-inline: 16px;
    }

    .public-site-body .primary-nav {
        overflow-y: auto;
        max-height: calc(100svh - 84px);
        padding: 16px;
        background: rgba(255, 253, 248, .98);
        border: 1px solid var(--sp-line);
        border-radius: 0 0 18px 18px;
        box-shadow: var(--sp-shadow-lg);
        backdrop-filter: blur(18px);
    }

    .public-site-body .primary-nav > a {
        min-height: 46px;
        padding-inline: 14px;
    }

    .public-site-body .primary-nav > a:not(.nav-cta).active::after {
        top: 10px;
        right: auto;
        bottom: 10px;
        left: 4px;
        width: 3px;
        height: auto;
    }
}

@media (max-width: 760px) {
    .admin-body .admin-content,
    .legacy-admin-body .dashboard-content {
        padding: 18px 14px 30px;
    }

    .admin-body .admin-topbar,
    .legacy-admin-body .topbar {
        min-height: 66px;
    }

    .admin-body .topbar-title small,
    .legacy-admin-body .topbar__title small,
    .admin-body .profile-menu-trigger .user-copy,
    .legacy-admin-body .profile-button__copy,
    .legacy-admin-body .system-pill {
        display: none;
    }

    .admin-body .profile-menu-trigger,
    .legacy-admin-body .profile-button {
        min-width: 44px;
        padding: 4px;
        border-radius: 12px;
    }

    .admin-body .page-header,
    .admin-body .page-intro,
    .admin-body .dashboard-section-heading,
    .admin-body .panel-header,
    .legacy-admin-body .page-heading,
    .legacy-admin-body .panel__header,
    .public-site-body .section-topline {
        align-items: stretch;
        flex-direction: column;
    }

    .admin-body .header-actions,
    .admin-body .page-actions,
    .admin-body .dashboard-hero-actions,
    .legacy-admin-body .page-heading__actions,
    .legacy-admin-body .form-actions {
        width: 100%;
        flex-wrap: wrap;
    }

    .admin-body .header-actions .button,
    .admin-body .page-actions .button,
    .admin-body .dashboard-hero-actions .button,
    .legacy-admin-body .page-heading__actions .button {
        flex: 1 1 150px;
    }

    .admin-body .dashboard-hero {
        padding: 24px 20px;
        border-radius: 20px;
    }

    .admin-body .dashboard-identity-row {
        gap: 8px 12px;
    }

    .admin-body .quick-action-grid,
    .admin-body .overview-card-grid,
    .admin-body .stat-grid,
    .legacy-admin-body .stats-grid,
    .legacy-admin-body .stat-grid {
        grid-template-columns: 1fr 1fr;
    }

    .admin-body .panel-header,
    .legacy-admin-body .panel__header,
    .legacy-admin-body .panel-header {
        min-height: auto;
        padding: 16px;
    }

    .admin-body .form-section,
    .legacy-admin-body .form-section {
        padding: 18px 16px;
    }

    .admin-body .form-actions,
    .legacy-admin-body .form-actions {
        padding: 16px;
    }

    .admin-body .form-grid,
    .admin-body .form-grid.two-columns,
    .admin-body .form-grid.three-columns,
    .legacy-admin-body .form-grid,
    .legacy-admin-body .form-grid--2,
    .legacy-admin-body .form-grid--3 {
        grid-template-columns: 1fr;
    }

    .admin-body .form-grid .two-span,
    .legacy-admin-body .form-field--full {
        grid-column: auto;
    }

    .public-site-body .container {
        width: min(100% - 28px, 1180px);
    }

    .public-site-body .section {
        padding-block: 54px;
    }

    .public-site-body .top-links {
        display: none;
    }

    .public-site-body .top-strip-inner {
        justify-content: center;
        text-align: center;
    }

    .public-site-body .footer-grid {
        gap: 32px;
    }
}

@media (max-width: 560px) {
    .admin-body .language-switcher.compact {
        display: none;
    }

    .admin-body .quick-action-grid,
    .admin-body .overview-card-grid,
    .admin-body .stat-grid,
    .legacy-admin-body .stats-grid,
    .legacy-admin-body .stat-grid {
        grid-template-columns: 1fr;
    }

    .admin-body .quick-action-card,
    .admin-body .overview-card,
    .admin-body .stat-card {
        padding: 16px;
    }

    .admin-body .dashboard-hero h1 {
        font-size: 25px;
    }

    .admin-body .button,
    .legacy-admin-body .button,
    .public-site-body .button {
        min-height: 46px;
    }

    .admin-body .filter-bar,
    .admin-body .filter-panel,
    .legacy-admin-body .filter-bar {
        grid-template-columns: 1fr;
    }

    .admin-body .filter-bar .button,
    .admin-body .filter-panel .button,
    .legacy-admin-body .filter-bar .button {
        width: 100%;
    }

    .admin-body .data-table,
    .legacy-admin-body .data-table {
        min-width: 660px;
    }

    .public-site-body .brand-copy small {
        display: none;
    }

    .public-site-body .header-main {
        min-height: 72px;
    }

    .public-site-body .section-topline h2 {
        font-size: clamp(28px, 9vw, 38px);
    }

    .guest-page .guest-content__inner {
        width: min(100% - 28px, 520px);
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

@media print {
    .admin-body .admin-sidebar,
    .admin-body .admin-topbar,
    .legacy-admin-body .sidebar,
    .legacy-admin-body .topbar,
    .public-site-body .site-header,
    .public-site-body .site-footer {
        display: none !important;
    }

    .admin-body .admin-main,
    .legacy-admin-body .dashboard-main {
        margin: 0 !important;
    }

    .admin-body .admin-content,
    .legacy-admin-body .dashboard-content {
        width: 100%;
        padding: 0;
    }
}


/* 2026-08 legacy dashboard button compatibility */
.legacy-admin-body .button,
.legacy-admin-body a.button,
.legacy-admin-body button.button {
    font-family: inherit;
    text-decoration: none;
    -webkit-text-fill-color: currentColor;
}

.legacy-admin-body .button.button--primary,
.legacy-admin-body .button.primary {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.legacy-admin-body .button.button--danger,
.legacy-admin-body .button.danger,
.legacy-admin-body .button.danger-outline,
.legacy-admin-body button.text-danger-button,
.legacy-admin-body button.danger-link {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #b91c1c !important;
    border: 1px solid #b91c1c !important;
    border-radius: 10px;
    text-decoration: none !important;
}

.legacy-admin-body .button.button--danger:hover,
.legacy-admin-body .button.danger:hover,
.legacy-admin-body .button.danger-outline:hover,
.legacy-admin-body button.text-danger-button:hover,
.legacy-admin-body button.danger-link:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #991b1b !important;
    border-color: #991b1b !important;
}


/* 2026-08 legacy textual action normalization. */
.legacy-admin-body .button,
.legacy-admin-body a.button,
.legacy-admin-body button.button,
.legacy-admin-body button.text-danger-button,
.legacy-admin-body button.danger-link {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #2563eb !important;
    background-image: none !important;
    border-color: #2563eb !important;
    text-decoration: none !important;
}

.legacy-admin-body .button:hover,
.legacy-admin-body .button:focus-visible,
.legacy-admin-body a.button:hover,
.legacy-admin-body a.button:focus-visible,
.legacy-admin-body button.button:hover,
.legacy-admin-body button.button:focus-visible,
.legacy-admin-body button.text-danger-button:hover,
.legacy-admin-body button.danger-link:hover {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}

/* V5 legacy dashboard action contract: blue surface + white content. */
.legacy-admin-body :is(
    .button,
    a.button,
    button.button,
    button.text-danger-button,
    button.danger-link
) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background-color: #2563eb !important;
    background: #2563eb !important;
    background-image: none !important;
    border-color: #2563eb !important;
    text-decoration-color: #ffffff !important;
}

.legacy-admin-body :is(
    .button,
    a.button,
    button.button,
    button.text-danger-button,
    button.danger-link
) * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.legacy-admin-body :is(
    .button,
    a.button,
    button.button,
    button.text-danger-button,
    button.danger-link
):is(:hover, :focus-visible, :active) {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    background-color: #1d4ed8 !important;
    background: #1d4ed8 !important;
    border-color: #1d4ed8 !important;
}