/**
 * Sirajul Huda v1.0.9
 * Custom Theme Builder and final colour-consistency layer.
 */

.theme-color-skin.theme-custom-enabled {
    --skin-page: var(--theme-body);
    --skin-panel: var(--theme-surface);
    --skin-section: var(--theme-section);
    --skin-soft: var(--theme-soft);
    --skin-text: var(--theme-body-text);
    --skin-heading: var(--theme-body-heading);
    --skin-muted: var(--theme-body-muted);
    --skin-border: var(--theme-border);
    --skin-border-strong: var(--theme-border-strong);
    --skin-link: var(--theme-link);
    --skin-link-hover: var(--theme-link-hover);
    --skin-icon: var(--theme-icon);
    --skin-icon-surface: var(--theme-icon-surface);
    color-scheme: light;
}

.theme-color-skin,
.theme-color-skin main,
.theme-color-skin .article-body {
    background-color: var(--skin-page);
    color: var(--skin-text);
}

.theme-color-skin a:not(.btn):not(.nav-link):not(.dropdown-item):not(.mobile-nav-link) {
    color: var(--theme-link);
}

.theme-color-skin a:not(.btn):not(.nav-link):not(.dropdown-item):not(.mobile-nav-link):hover,
.theme-color-skin a:not(.btn):not(.nav-link):not(.dropdown-item):not(.mobile-nav-link):focus-visible {
    color: var(--theme-link-hover);
}

.theme-color-skin :focus-visible {
    outline-color: var(--theme-hero-accent);
}

/* Buttons and all interactive colour states. */
.theme-color-skin .btn-green,
.theme-color-skin .sirda-cta-button,
.theme-color-skin .article-pagination a.is-active,
.theme-color-skin .article-pagination a:hover {
    border-color: var(--theme-button-primary);
    background: var(--theme-button-primary);
    color: var(--theme-button-primary-text);
}

.theme-color-skin .btn-green:hover,
.theme-color-skin .btn-green:focus-visible,
.theme-color-skin .sirda-cta-button:hover,
.theme-color-skin .sirda-cta-button:focus-visible {
    border-color: var(--theme-button-primary-hover);
    background: var(--theme-button-primary-hover);
    color: var(--theme-button-primary-text);
}

.theme-color-skin .btn-gold,
.theme-color-skin .newsletter-form button,
.theme-color-skin .capacity-badge,
.theme-color-skin .hero-indicators .active {
    border-color: var(--theme-button-accent);
    background: var(--theme-button-accent);
    color: var(--theme-button-accent-text);
}

.theme-color-skin .btn-gold:hover,
.theme-color-skin .btn-gold:focus-visible,
.theme-color-skin .newsletter-form button:hover,
.theme-color-skin .newsletter-form button:focus-visible {
    border-color: var(--theme-button-accent-hover);
    background: var(--theme-button-accent-hover);
    color: var(--theme-button-accent-text);
}

.theme-color-skin .btn-outline-green {
    border-color: var(--theme-link);
    background: transparent;
    color: var(--theme-link);
}

.theme-color-skin .btn-outline-green:hover,
.theme-color-skin .btn-outline-green:focus-visible {
    border-color: var(--theme-button-primary);
    background: var(--theme-button-primary);
    color: var(--theme-button-primary-text);
}

.theme-color-skin .btn-maroon {
    border-color: var(--theme-category);
    background: var(--theme-category);
    color: var(--theme-on-category);
}

.theme-color-skin .btn-maroon:hover,
.theme-color-skin .btn-maroon:focus-visible {
    border-color: var(--theme-primary-hover);
    background: var(--theme-primary-hover);
    color: var(--theme-on-primary);
}

/* Topbar, sticky header, desktop navigation, dropdown, and mobile menu. */
.theme-color-skin .topbar {
    border-bottom-color: color-mix(in srgb, var(--theme-topbar-text) 18%, transparent);
    background: var(--theme-topbar);
    color: var(--theme-topbar-text);
}

.theme-color-skin .topbar a,
.theme-color-skin .topbar button,
.theme-color-skin .topbar-item {
    color: var(--theme-topbar-text);
}

.theme-color-skin .topbar a:hover,
.theme-color-skin .topbar button:hover,
.theme-color-skin .topbar-item:hover,
.theme-color-skin .topbar i,
.theme-color-skin .topbar-item i {
    color: var(--theme-topbar-accent);
}

.home-page.theme-color-skin .topbar {
    background: color-mix(in srgb, var(--theme-topbar) 88%, transparent);
}

.theme-color-skin:not(.home-page) .site-header,
.theme-color-skin .site-header.scrolled {
    border-bottom-color: var(--theme-border);
    background: color-mix(in srgb, var(--theme-header) 97%, transparent);
}

.theme-color-skin:not(.home-page) .site-header .navbar,
.theme-color-skin .site-header.scrolled .navbar {
    background: var(--theme-navigation);
}

.theme-color-skin:not(.home-page) .navbar-brand strong,
.theme-color-skin:not(.home-page) .navbar-brand small,
.theme-color-skin .site-header.scrolled .navbar-brand strong,
.theme-color-skin .site-header.scrolled .navbar-brand small {
    color: var(--theme-header-text);
}

.theme-color-skin:not(.home-page) .navbar-nav .nav-link,
.theme-color-skin .site-header.scrolled .navbar-nav .nav-link,
.theme-color-skin:not(.home-page) .navbar-toggler,
.theme-color-skin .site-header.scrolled .navbar-toggler {
    color: var(--theme-navigation-text);
}

.theme-color-skin .navbar-nav .nav-link:hover,
.theme-color-skin .navbar-nav .nav-link:focus-visible,
.theme-color-skin .navbar-nav .nav-link.active,
.theme-color-skin .nav-style-underline .navbar-nav .nav-link::after {
    color: var(--theme-navigation-hover);
}

.theme-color-skin .nav-style-underline .navbar-nav .nav-link::after {
    background: var(--theme-navigation-hover);
}

.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-brand strong,
.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-brand small,
.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-nav .nav-link,
.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-toggler {
    color: var(--theme-hero-text);
}

.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-nav .nav-link:hover,
.home-page.theme-color-skin .site-header:not(.scrolled) .navbar-nav .nav-link:focus-visible {
    color: var(--theme-hero-accent);
}

.theme-color-skin .dropdown-menu,
.theme-color-skin .offcanvas,
.theme-color-skin .modal-content {
    border-color: var(--theme-border);
    background: var(--theme-navigation);
    color: var(--theme-navigation-text);
}

.theme-color-skin .dropdown-item,
.theme-color-skin .mobile-nav-link,
.theme-color-skin .mobile-submenu a {
    border-color: var(--theme-border);
    color: var(--theme-navigation-text);
}

.theme-color-skin .dropdown-item:hover,
.theme-color-skin .dropdown-item:focus,
.theme-color-skin .mobile-nav-link:hover,
.theme-color-skin .mobile-nav-link:focus-visible,
.theme-color-skin .mobile-submenu a:hover,
.theme-color-skin .mobile-submenu a:focus-visible {
    background: var(--theme-soft);
    color: var(--theme-navigation-hover);
}

.theme-color-skin .language-selector {
    border-color: var(--theme-border);
    background-color: var(--theme-navigation);
    color: var(--theme-navigation-text);
}

.theme-color-skin .site-header .navbar-brand img,
.theme-color-skin #mobileMenu .navbar-brand img,
.theme-color-skin .footer-brand img {
    border-color: var(--theme-border-strong);
    background: var(--theme-logo-surface);
}

/* Hero and all photograph overlays. */
.theme-color-skin .hero,
.theme-color-skin .hero-slider {
    background-color: var(--theme-hero-overlay-start);
}

.theme-color-skin .hero-slide::before {
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--theme-hero-overlay-start) 96%, transparent),
            color-mix(in srgb, var(--theme-hero-overlay-start) 76%, transparent) 52%,
            color-mix(in srgb, var(--theme-hero-overlay-end) 34%, transparent) 84%
        ),
        var(--hero-image) var(--hero-bg-position) center / cover no-repeat;
}

.theme-color-skin .hero-overlay-light .hero-slide::before {
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--theme-hero-overlay-start) 86%, transparent),
            color-mix(in srgb, var(--theme-hero-overlay-start) 62%, transparent) 52%,
            color-mix(in srgb, var(--theme-hero-overlay-end) 24%, transparent) 84%
        ),
        var(--hero-image) var(--hero-bg-position) center / cover no-repeat;
}

.theme-color-skin .hero-overlay-strong .hero-slide::before {
    background:
        linear-gradient(
            90deg,
            color-mix(in srgb, var(--theme-hero-overlay-start) 98%, transparent),
            color-mix(in srgb, var(--theme-hero-overlay-start) 88%, transparent) 52%,
            color-mix(in srgb, var(--theme-hero-overlay-end) 48%, transparent) 84%
        ),
        var(--hero-image) var(--hero-bg-position) center / cover no-repeat;
}

.theme-color-skin .hero-copy,
.theme-color-skin .hero-copy h1,
.theme-color-skin .hero-copy p,
.theme-color-skin .hero-copy a:not(.btn),
.theme-color-skin .hero-trust,
.theme-color-skin .hero-trust span {
    color: var(--theme-hero-text);
}

.theme-color-skin .hero-eyebrow,
.theme-color-skin .hero-kicker,
.theme-color-skin .hero-copy a:not(.btn):hover {
    color: var(--theme-hero-accent);
}

.theme-color-skin .hero-indicators button {
    border-color: var(--theme-hero-text);
}

.theme-color-skin .service-overlay {
    background: linear-gradient(
        180deg,
        transparent 5%,
        color-mix(in srgb, var(--theme-hero-overlay-start) 30%, transparent) 43%,
        color-mix(in srgb, var(--theme-hero-overlay-start) 98%, #000000) 100%
    );
}

.theme-color-skin .service-content,
.theme-color-skin .service-content h3,
.theme-color-skin .service-content p,
.theme-color-skin .service-content a {
    color: var(--theme-hero-text);
}

.theme-color-skin .service-content > i,
.theme-color-skin .service-content a:hover {
    color: var(--theme-hero-accent);
}

/* Surface rhythm, cards, headings, copy, and hover links. */
.theme-color-skin .section-about,
.theme-color-skin .stats-section,
.theme-color-skin .ppdb-wrap,
.theme-color-skin .units-section,
.theme-color-skin .donation-section,
.theme-color-skin .news-section,
.theme-color-skin .child-safe-section {
    background: var(--skin-page);
}

.theme-color-skin .services-section,
.theme-color-skin .leadership-section,
.theme-color-skin .home-notice-section,
.theme-color-skin .video-section,
.theme-color-skin .soft-section,
.theme-color-skin .article-header {
    background: var(--skin-section);
    color: var(--theme-section-text);
}

.theme-color-skin .news-card,
.theme-color-skin .unit-card,
.theme-color-skin .leader-card,
.theme-color-skin .listing-card,
.theme-color-skin .form-card,
.theme-color-skin .video-card,
.theme-color-skin .ppdb-card,
.theme-color-skin .gallery-card,
.theme-color-skin .home-notice-panel,
.theme-color-skin .related-post-card,
.theme-color-skin .inline-related,
.theme-color-skin .post-navigation-card,
.theme-color-skin .info-card,
.theme-color-skin .program-list > a,
.theme-color-skin .donation-numbers > div,
.theme-color-skin .location-tag,
.theme-color-skin .contact-box,
.theme-color-skin .bank-box,
.theme-color-skin .empty-state {
    border-color: var(--skin-border);
    background: var(--skin-panel);
    color: var(--theme-surface-text);
}

.theme-color-skin .section-title,
.theme-color-skin .article-header h1,
.theme-color-skin .news-body h2 a,
.theme-color-skin .news-body h3 a,
.theme-color-skin .unit-card h3,
.theme-color-skin .leader-card h3,
.theme-color-skin .listing-card h2,
.theme-color-skin .form-card h2,
.theme-color-skin .home-notice-heading h2,
.theme-color-skin .home-notice-list h3 a,
.theme-color-skin .related-post-card h3 a,
.theme-color-skin .post-navigation-card strong,
.theme-color-skin .program-list h3,
.theme-color-skin .prose,
.theme-color-skin .prose h1,
.theme-color-skin .prose h2,
.theme-color-skin .prose h3,
.theme-color-skin .prose h4 {
    color: var(--skin-heading);
}

.theme-color-skin .section-lead,
.theme-color-skin .section-heading > p,
.theme-color-skin .news-body p,
.theme-color-skin .news-meta,
.theme-color-skin .unit-card p,
.theme-color-skin .leader-card p,
.theme-color-skin .listing-card p,
.theme-color-skin .article-lead,
.theme-color-skin .article-meta,
.theme-color-skin .home-notice-list p,
.theme-color-skin .home-notice-list time,
.theme-color-skin .progress-label {
    color: var(--skin-muted);
}

.theme-color-skin .news-card h2,
.theme-color-skin .news-card h3,
.theme-color-skin .news-card h2 a,
.theme-color-skin .news-card h3 a,
.theme-color-skin .unit-card h3,
.theme-color-skin .leader-card h3,
.theme-color-skin .listing-card h2,
.theme-color-skin .form-card h2,
.theme-color-skin .home-notice-panel h2,
.theme-color-skin .home-notice-panel h3 a,
.theme-color-skin .related-post-card h3 a,
.theme-color-skin .post-navigation-card strong,
.theme-color-skin .program-list > a h3,
.theme-color-skin .empty-state h2,
.theme-color-skin .empty-state h3 {
    color: var(--theme-surface-heading);
}

.theme-color-skin .news-card p,
.theme-color-skin .news-card .news-meta,
.theme-color-skin .unit-card p,
.theme-color-skin .leader-card p,
.theme-color-skin .listing-card p,
.theme-color-skin .home-notice-panel p,
.theme-color-skin .home-notice-panel time,
.theme-color-skin .related-post-card time,
.theme-color-skin .empty-state p {
    color: var(--theme-surface-muted);
}

.theme-color-skin .news-card .text-link,
.theme-color-skin .unit-card a:not(.btn),
.theme-color-skin .leader-card a:not(.btn),
.theme-color-skin .listing-card a:not(.btn),
.theme-color-skin .home-notice-panel a:not(.btn),
.theme-color-skin .related-post-card a:not(.btn),
.theme-color-skin .post-navigation-card,
.theme-color-skin .program-list > a {
    color: var(--theme-surface-link);
}

.theme-color-skin .news-card .text-link:hover,
.theme-color-skin .unit-card a:not(.btn):hover,
.theme-color-skin .leader-card a:not(.btn):hover,
.theme-color-skin .listing-card a:not(.btn):hover,
.theme-color-skin .home-notice-panel a:not(.btn):hover,
.theme-color-skin .related-post-card a:not(.btn):hover,
.theme-color-skin .post-navigation-card:hover,
.theme-color-skin .program-list > a:hover {
    color: var(--theme-surface-link-hover);
}

.theme-color-skin .services-section .section-title,
.theme-color-skin .leadership-section .section-title,
.theme-color-skin .home-notice-section .section-title,
.theme-color-skin .video-section .section-title,
.theme-color-skin .soft-section .section-title,
.theme-color-skin .article-header h1 {
    color: var(--theme-section-heading);
}

.theme-color-skin .services-section .section-heading > p,
.theme-color-skin .leadership-section .section-heading > p,
.theme-color-skin .home-notice-section .section-heading > p,
.theme-color-skin .video-section .section-heading > p,
.theme-color-skin .soft-section .section-heading > p,
.theme-color-skin .article-header .article-lead,
.theme-color-skin .article-header .article-meta {
    color: var(--theme-section-muted);
}

.theme-color-skin .text-link,
.theme-color-skin .home-notice-heading > a,
.theme-color-skin .news-body .text-link {
    color: var(--theme-link);
}

.theme-color-skin .text-link:hover,
.theme-color-skin .home-notice-heading > a:hover,
.theme-color-skin .news-body .text-link:hover {
    color: var(--theme-link-hover);
}

/* Testimonial colour is explicit, including the previously unreadable card. */
.theme-color-skin .testimonials-section {
    background:
        radial-gradient(circle at 6% 18%, var(--theme-accent-soft), transparent 29%),
        var(--skin-section);
}

.theme-color-skin .testimonial-modern {
    border-color: var(--skin-border);
    background: var(--theme-testimonial-surface);
    color: var(--theme-testimonial-text);
}

.theme-color-skin .testimonial-modern > p,
.theme-color-skin .testimonial-modern footer strong,
.theme-color-skin .testimonial-modern footer small {
    color: var(--theme-testimonial-text);
}

.theme-color-skin .testimonial-quote {
    color: color-mix(in srgb, var(--theme-link) 18%, transparent);
}

.theme-color-skin .testimonials-style-spotlight .testimonial-featured {
    border-color: color-mix(in srgb, var(--theme-special-text) 18%, transparent);
    background: var(--theme-special-surface);
    color: var(--theme-special-text);
}

.theme-color-skin .testimonials-style-spotlight .testimonial-featured > p,
.theme-color-skin .testimonials-style-spotlight .testimonial-featured footer strong,
.theme-color-skin .testimonials-style-spotlight .testimonial-featured footer small {
    color: var(--theme-special-text);
}

.theme-color-skin .testimonial-verified,
.theme-color-skin .testimonials-style-spotlight .testimonial-featured .testimonial-verified {
    color: var(--theme-hero-accent);
}

/* PPDB is a protected two-colour gradient with one readable foreground. */
.theme-color-skin .ppdb-banner {
    background:
        radial-gradient(circle at 88% 14%, color-mix(in srgb, var(--theme-button-accent) 22%, transparent), transparent 29%),
        linear-gradient(120deg, var(--theme-ppdb-start), var(--theme-ppdb-end));
    color: var(--theme-ppdb-text);
}

.theme-color-skin .ppdb-copy,
.theme-color-skin .ppdb-copy h2,
.theme-color-skin .ppdb-copy p,
.theme-color-skin .ppdb-levels {
    color: var(--theme-ppdb-text);
}

.theme-color-skin .ppdb-copy .kicker {
    color: var(--theme-hero-accent);
}

/* Artikel Khusus no longer inherits a dark-green link on a dark background. */
.theme-color-skin .special-articles-section {
    background:
        radial-gradient(circle at 88% 0, color-mix(in srgb, var(--theme-hero-accent) 19%, transparent), transparent 34%),
        linear-gradient(
            135deg,
            var(--theme-special-surface),
            color-mix(in srgb, var(--theme-special-surface) 82%, var(--theme-hero-overlay-end))
        );
    color: var(--theme-special-text);
}

.theme-color-skin .special-article-card {
    border-color: color-mix(in srgb, var(--theme-special-text) 20%, transparent);
    background: color-mix(in srgb, var(--theme-special-text) 9%, transparent);
    color: var(--theme-special-text);
}

.theme-color-skin .special-articles-section .eyebrow,
.theme-color-skin .special-articles-section .section-title,
.theme-color-skin .special-articles-section .section-heading p,
.theme-color-skin .special-article-copy h3 a,
.theme-color-skin .special-article-copy p,
.theme-color-skin .special-article-copy > div,
.theme-color-skin .special-article-copy > div a {
    color: var(--theme-special-text);
}

.theme-color-skin .special-article-copy > span {
    color: var(--theme-hero-accent);
}

.theme-color-skin .special-articles-section .btn-outline-green {
    border-color: color-mix(in srgb, var(--theme-special-text) 58%, transparent);
    color: var(--theme-special-text);
}

.theme-color-skin .special-articles-section .btn-outline-green:hover {
    border-color: var(--theme-button-accent);
    background: var(--theme-button-accent);
    color: var(--theme-button-accent-text);
}

/* Forms, notices, post navigation, and sharing. */
.theme-color-skin .form-control,
.theme-color-skin .form-select,
.theme-color-skin .newsletter-form input {
    border-color: var(--skin-border);
    background: var(--skin-panel);
    color: var(--skin-text);
}

.theme-color-skin .form-control::placeholder,
.theme-color-skin .newsletter-form input::placeholder {
    color: var(--skin-muted);
    opacity: 1;
}

.theme-color-skin .share-button,
.theme-color-skin .testimonial-controls button,
.theme-color-skin .article-pagination a {
    border-color: var(--skin-border);
    background: var(--skin-panel);
    color: var(--skin-heading);
}

.theme-color-skin .share-button:hover,
.theme-color-skin .testimonial-controls button:hover {
    border-color: var(--theme-button-primary);
    background: var(--theme-primary-subtle);
    color: var(--theme-link-hover);
}

/* Footer tokens apply to every piece of text and every hover state. */
.theme-color-skin .site-footer,
.theme-color-skin .back-to-top {
    background: var(--theme-footer);
    color: var(--theme-footer-text);
}

.theme-color-skin .footer-overlay {
    background:
        radial-gradient(circle at 12% 0, color-mix(in srgb, var(--theme-hero-accent) 14%, transparent), transparent 31%),
        linear-gradient(
            105deg,
            color-mix(in srgb, var(--theme-footer) 98%, #000000),
            color-mix(in srgb, var(--theme-footer) 86%, var(--theme-hero-overlay-end))
        );
}

.theme-color-skin .footer-title,
.theme-color-skin .footer-brand strong,
.theme-color-skin .footer-brand span,
.theme-color-skin .footer-address,
.theme-color-skin .footer-links a,
.theme-color-skin .footer-contact,
.theme-color-skin .footer-contact a,
.theme-color-skin .footer-bottom {
    color: var(--theme-footer-text);
}

.theme-color-skin .footer-title::before {
    background-color: var(--theme-hero-accent);
}

.theme-color-skin .footer-contact i {
    color: var(--theme-hero-accent);
}

.theme-color-skin .footer-links a:hover,
.theme-color-skin .footer-contact a:hover {
    color: var(--theme-hero-accent);
}

/* Photographs are never tinted, hidden, or blended into a skin. */
.theme-color-skin img,
.theme-color-skin picture,
.theme-color-skin .news-image,
.theme-color-skin .special-article-image,
.theme-color-skin .related-post-image {
    opacity: 1;
    visibility: visible;
    filter: none;
    mix-blend-mode: normal;
}

@media (max-width: 991.98px) {
    .theme-color-skin .hero-slider .hero-slide::before {
        background:
            linear-gradient(
                90deg,
                color-mix(in srgb, var(--theme-hero-overlay-start) 97%, transparent),
                color-mix(in srgb, var(--theme-hero-overlay-start) 80%, transparent) 72%,
                color-mix(in srgb, var(--theme-hero-overlay-end) 48%, transparent)
            ),
            var(--hero-image) var(--hero-bg-position) center / cover no-repeat;
    }
}

@media (max-width: 767.98px) {
    .theme-color-skin .hero-slider .hero-slide::before {
        background:
            linear-gradient(
                180deg,
                color-mix(in srgb, var(--theme-hero-overlay-start) 88%, transparent),
                color-mix(in srgb, var(--theme-hero-overlay-start) 94%, transparent)
            ),
            var(--hero-image) var(--hero-bg-position) center / cover no-repeat;
    }
}

@media (forced-colors: active) {
    .theme-color-skin .site-header .navbar-brand img,
    .theme-color-skin #mobileMenu .navbar-brand img,
    .theme-color-skin .footer-brand img {
        border: 1px solid CanvasText;
        background: Canvas;
    }
}