body.southernpos-page {
    --accent-primary: #10b981;
    --accent-secondary: #059669;
    --accent-hover: #34d399;
    --accent: #10b981;

    --bg-primary: #0a0a0a;
    --bg-secondary: #1a1a1a;
    --bg-tertiary: #2a2a2a;

    --text-primary: #ffffff;
    --text-secondary: #e0e0e0;
    --text-tertiary: #a0a0a0;

    --border: rgba(255, 255, 255, 0.15);

    --success: #10b981;
    --warning: #f59e0b;
    --error: #ef4444;
    --info: #3b82f6;
}


html[data-theme="light"] body.southernpos-page {
    --accent-primary: #059669;
    --accent-secondary: #10b981;
    --accent-hover: #047857;
    --accent: #059669;

    --bg-primary: #fafafa;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f5f5f5;

    --text-primary: #0a0a0a;
    --text-secondary: #525252;
    --text-tertiary: #737373;

    --border: #e5e5e5;

    --success: #059669;
    --warning: #d97706;
    --error: #dc2626;
    --info: #2563eb;
}


body.southernpos-page .hero-gradient {
    background: linear-gradient(135deg,
            #10b981 0%,
            #34d399 50%,
            #059669 100%);
    opacity: 0.15;
}


html[data-theme="light"] body.southernpos-page .hero-gradient {
    background: linear-gradient(135deg,
            #10b981 0%,
            #34d399 50%,
            #059669 100%);
    opacity: 0.08;
}


body.southernpos-page .project-title {
    background: linear-gradient(135deg, #ffffff, #10b981);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}


html[data-theme="light"] body.southernpos-page .project-title {
    background: linear-gradient(135deg, #0a0a0a, #059669);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}


body.southernpos-page .feature-icon {
    background: linear-gradient(135deg, #10b981, #34d399);
}

html[data-theme="light"] body.southernpos-page .feature-icon {
    background: linear-gradient(135deg, #059669, #10b981);
}


body.southernpos-page .browser-content {
    background: linear-gradient(135deg, #10b981, #059669);
}


body.southernpos-page .overlay-cta svg {
    color: #10b981;
}


body.southernpos-page .btn-primary {
    background-color: #10b981;
    color: #ffffff;
    font-weight: 600;
}

body.southernpos-page .btn-primary:hover {
    background-color: #34d399;
}


html[data-theme="light"] body.southernpos-page .btn-primary {
    background-color: #059669;
    color: #ffffff;
}

html[data-theme="light"] body.southernpos-page .btn-primary:hover {
    background-color: #047857;
}


body.southernpos-page .project-label,
body.southernpos-page .nav-link.active,
body.southernpos-page a:hover {
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .project-label,
html[data-theme="light"] body.southernpos-page .nav-link.active,
html[data-theme="light"] body.southernpos-page a:hover {
    color: #059669;
}


body.southernpos-page .badge.badge-primary {
    background-color: rgba(16, 185, 129, 0.15);
    border-color: #10b981;
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .badge.badge-primary {
    background-color: rgba(5, 150, 105, 0.1);
    border-color: #059669;
    color: #059669;
}


body.southernpos-page .meta-icon.status-dev {
    color: #f59e0b;
}

html[data-theme="light"] body.southernpos-page .meta-icon.status-dev {
    color: #d97706;
}


body.southernpos-page .tech-badge:hover {
    border-color: #10b981;
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .tech-badge:hover {
    border-color: #059669;
    color: #059669;
}


body.southernpos-page .feature-highlight:hover {
    border-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .feature-highlight:hover {
    border-color: #059669;
}


body.southernpos-page .architecture-item:hover {
    border-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .architecture-item:hover {
    border-color: #059669;
}


body.southernpos-page .decision-item {
    border-left-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .decision-item {
    border-left-color: #059669;
}


body.southernpos-page .roadmap-status.implemented {
    color: #10b981;
    border-bottom-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .roadmap-status.implemented {
    color: #059669;
    border-bottom-color: #059669;
}

body.southernpos-page .roadmap-status.in-progress {
    color: #f59e0b;
    border-bottom-color: #f59e0b;
}

html[data-theme="light"] body.southernpos-page .roadmap-status.in-progress {
    color: #d97706;
    border-bottom-color: #d97706;
}

body.southernpos-page .roadmap-status.planned {
    color: #10b981;
    border-bottom-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .roadmap-status.planned {
    color: #059669;
    border-bottom-color: #059669;
}


body.southernpos-page .limitation-item h4::before {
    background-color: #f59e0b;
}

html[data-theme="light"] body.southernpos-page .limitation-item h4::before {
    background-color: #d97706;
}


body.southernpos-page .challenge-card {
    border-left-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .challenge-card {
    border-left-color: #059669;
}


body.southernpos-page .back-link:hover {
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .back-link:hover {
    color: #059669;
}


body.southernpos-page .showcase-browser:hover .showcase-overlay {
    background: rgba(10, 10, 10, 0.85);
}

html[data-theme="light"] body.southernpos-page .showcase-browser:hover .showcase-overlay {
    background: rgba(255, 255, 255, 0.9);
}


body.southernpos-page .problem-box {
    background-color: rgba(239, 68, 68, 0.08);
    border-color: rgba(239, 68, 68, 0.25);
}

body.southernpos-page .solution-box {
    background-color: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.25);
}


html[data-theme="light"] body.southernpos-page .problem-box {
    background-color: rgba(239, 68, 68, 0.05);
    border-color: rgba(239, 68, 68, 0.2);
}

html[data-theme="light"] body.southernpos-page .solution-box {
    background-color: rgba(5, 150, 105, 0.05);
    border-color: rgba(5, 150, 105, 0.2);
}

body.southernpos-page .solution-box h3 svg {
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .solution-box h3 svg {
    color: #059669;
}


body.southernpos-page .arch-layer:hover {
    border-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .arch-layer:hover {
    border-color: #059669;
}

body.southernpos-page .arch-arrow {
    color: #10b981;
}

html[data-theme="light"] body.southernpos-page .arch-arrow {
    color: #059669;
}


body.southernpos-page .feature-item:hover {
    border-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .feature-item:hover {
    border-color: #059669;
}


body.southernpos-page .security-item h4::before {
    background-color: #10b981;
}

html[data-theme="light"] body.southernpos-page .security-item h4::before {
    background-color: #059669;
}


body.southernpos-page .limitation-note {
    background-color: rgba(16, 185, 129, 0.08);
    border-color: rgba(16, 185, 129, 0.25);
}

html[data-theme="light"] body.southernpos-page .limitation-note {
    background-color: rgba(5, 150, 105, 0.05);
    border-color: rgba(5, 150, 105, 0.2);
}


body.southernpos-page .project-cta .btn-primary {
    background-color: #10b981;
    color: #ffffff;
}

body.southernpos-page .project-cta .btn-primary:hover {
    background-color: #34d399;
}

html[data-theme="light"] body.southernpos-page .project-cta .btn-primary {
    background-color: #059669;
    color: #ffffff;
}

html[data-theme="light"] body.southernpos-page .project-cta .btn-primary:hover {
    background-color: #047857;
}


body.southernpos-page .project-link {
    color: #10b981;
}

body.southernpos-page .project-link:hover {
    color: #34d399;
}

html[data-theme="light"] body.southernpos-page .project-link {
    color: #059669;
}

html[data-theme="light"] body.southernpos-page .project-link:hover {
    color: #047857;
}


body.southernpos-page::-webkit-scrollbar-thumb {
    background: #10b981;
}

body.southernpos-page::-webkit-scrollbar-thumb:hover {
    background: #34d399;
}


html[data-theme="light"] body.southernpos-page::-webkit-scrollbar-thumb {
    background: #059669;
}

html[data-theme="light"] body.southernpos-page::-webkit-scrollbar-thumb:hover {
    background: #047857;
}


body.southernpos-page ::selection {
    background-color: rgba(16, 185, 129, 0.3);
    color: #ffffff;
}

body.southernpos-page ::-moz-selection {
    background-color: rgba(16, 185, 129, 0.3);
    color: #ffffff;
}


html[data-theme="light"] body.southernpos-page ::selection {
    background-color: rgba(5, 150, 105, 0.25);
    color: #0a0a0a;
}

html[data-theme="light"] body.southernpos-page ::-moz-selection {
    background-color: rgba(5, 150, 105, 0.25);
    color: #0a0a0a;
}


html[data-theme="light"] body.southernpos-page .navbar {
    background-color: rgba(250, 250, 250, 0.8);
}


html[data-theme="light"] body.southernpos-page .browser-header {
    background-color: #f5f5f5;
}

html[data-theme="light"] body.southernpos-page .browser-url {
    background-color: #ffffff;
}