/*
  SCE color scheme from the OPTIMUM-SCE Figma file.
  Add class "theme-sce" on body. It overrides the shared theme variables,
  so existing components pick up the green palette without a second stylesheet of rules.
  Sampled from the design: forest #19301E, olive #A6A70D, cream #F6F7F2.
*/
.theme-sce {
    --primary: #19301E;
    --primary-dark: #122416;
    --primary-darker: #122416;
    --primary-color: #19301E;
    --primary-red: #19301E;
    --dark-red: #122416;
    --primary-soft: #E7EBD4;
    --accent: #A6A70D;
    --accent-color-1: #19301E;
    --accent-color-2: #142918;
    --accent-color: #A6A70D;
    --accent-light: #E4E7B0;
    --accent-lighter: #F4F6E4;
    --primary-gradient: linear-gradient(135deg, #C5C84A 0%, #19301E 55%, #122416 100%);
    --light-red-gradient: linear-gradient(135deg, #F6F7F2 0%, #E7EBD4 100%);
    --secondary-gradient: linear-gradient(135deg, #C5C84A 0%, #A6A70D 100%);
    --medium-red: #A6A70D;
    --light-red: #C5C84A;
    --light-red-bg: #F4F6E4;
    --pale-red: #F4F6E4;
    --page-bg: #F6F7F2;
    --surface-bg: #F6F7F2;
    --shadow-light: rgba(25, 48, 30, 0.12);
    --shadow-medium: rgba(25, 48, 30, 0.18);
    --surface-soft: #F4F6E4;
    --surface-soft-strong: #E7EBD4;
    --surface-selected: #E4E7B0;
    --border-soft: rgba(25, 48, 30, 0.25);
    --border-strong: rgba(25, 48, 30, 0.45);
    --state-hover-bg: #F4F6E4;
    --state-active-bg: #E7EBD4;
    --state-focus-ring: rgba(166, 167, 13, 0.45);
    --btn-primary-bg: #19301E;
    --btn-primary-bg-hover: #122416;
    --btn-primary-text: #fff;
    --btn-outline-border: #19301E;
    --btn-outline-text: #19301E;
    --btn-outline-bg-hover: #19301E;
    --btn-outline-text-hover: #fff;
    --highlight-color: #A6A70D;
    --primary-color-dark: #122416;
    --primary-color-light: #19301E;
    --background-lighter: #F6F7F2;
    --brand-primary: #19301E;
    --brand-primary-dark: #122416;
    --brand-primary-soft: #E7EBD4;
    --bs-primary: #19301E;
    --bs-primary-rgb: 25, 48, 30;
    background-color: var(--page-bg);
}

.theme-sce .btn-primary,
.theme-sce .btn-primary:focus {
    background-color: #19301E !important;
    border-color: #19301E !important;
    color: #fff !important;
}

.theme-sce .btn-primary:hover {
    background-color: #122416 !important;
    border-color: #122416 !important;
    color: #fff !important;
}

.theme-sce .btn-outline-primary {
    color: #19301E !important;
    border-color: #19301E !important;
    background-color: transparent;
}

.theme-sce .btn-outline-primary:hover,
.theme-sce .btn-outline-primary:focus {
    background-color: #A6A70D !important;
    border-color: #A6A70D !important;
    color: #19301E !important;
}

.theme-sce .text-primary,
.theme-sce a.text-primary {
    color: #19301E !important;
}

.theme-sce .hero-side {
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.96) 0%, rgba(244, 246, 228, 0.92) 100%);
}

.theme-sce .form-side {
    background: linear-gradient(135deg, #ffffff 0%, #F6F7F2 100%);
}

.theme-sce .alert-info {
    background-color: #F4F6E4;
    color: #19301E;
    border-color: #E4E7B0;
}

.theme-sce .survey-container .survey-header,
.theme-sce .cert-icon,
.theme-sce .progress-fill {
    background: linear-gradient(135deg, #19301E 0%, #122416 100%);
}

.theme-sce .hero-section::after,
.theme-sce .hero-content::before,
.theme-sce .hero-content::after {
    background-image: radial-gradient(rgb(25 48 30 / 22%) 2px, transparent 2px);
}

.theme-sce .cert-card:hover {
    box-shadow: 0 15px 35px rgba(25, 48, 30, 0.22);
    border-color: #19301E;
}

.theme-sce .cert-title p,
.theme-sce .progress-value {
    color: #19301E;
}

.theme-sce .social-link:hover {
    background: #A6A70D;
    color: #19301E;
    box-shadow: 0 5px 15px rgba(25, 48, 30, 0.25);
}

.theme-sce .footer {
    border-top-color: #A6A70D;
}

.theme-sce .footer-title {
    border-bottom-color: #A6A70D;
}

.theme-sce .footer-link::before,
.theme-sce .contact-icon {
    color: #A6A70D;
}

.theme-sce .nav-link:hover,
.theme-sce .nav-link.active {
    color: #19301E !important;
    border-bottom-color: #A6A70D !important;
}

.theme-sce .footer .footer-logo {
    filter: brightness(0) invert(1);
}
