/*
  Phase 3 — Platforms Code v1.0 chrome only (.dga-header / .dga-footer).
  Official: https://design.dga.gov.sa/guidelines/components/ui-shell/
  Pixel anatomy needs Figma PC 1.0. Do not restyle cookies here.
*/

@font-face {
    font-family: IBMPlexSansArabic;
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Regular.woff2") format("woff2");
}

@font-face {
    font-family: IBMPlexSansArabic;
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Medium.woff2") format("woff2");
}

@font-face {
    font-family: IBMPlexSansArabic;
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-SemiBold.woff2") format("woff2");
}

@font-face {
    font-family: IBMPlexSansArabic;
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Bold.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Sans Arabic";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Regular.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Sans Arabic";
    font-style: normal;
    font-weight: 500;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Medium.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Sans Arabic";
    font-style: normal;
    font-weight: 600;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-SemiBold.woff2") format("woff2");
}

@font-face {
    font-family: "IBM Plex Sans Arabic";
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    size-adjust: 100%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
    src: url("../fonts/ibm-plex-sans-arabic/IBMPlexSansArabic-Bold.woff2") format("woff2");
}

@font-face {
    font-family: IBMPlexSansArabic-fallback;
    src: local("Tahoma");
    size-adjust: 105%;
    ascent-override: 90%;
    descent-override: 32%;
    line-gap-override: 0%;
}

html,
body {
    font-family: IBMPlexSansArabic, IBMPlexSansArabic-fallback, "IBM Plex Sans Arabic", Tahoma, sans-serif !important;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: IBMPlexSansArabic, IBMPlexSansArabic-fallback, "IBM Plex Sans Arabic", Tahoma, sans-serif !important;
}

.dga-header,
.dga-footer,
.dga-gov-banner {
    font-family: var(--font-family-primary) !important;
}

    .dga-header h1,
    .dga-header h2,
    .dga-header h3,
    .dga-header h4,
    .dga-header h5,
    .dga-header h6,
    .dga-header a,
    .dga-header p,
    .dga-header li,
    .dga-header span,
    .dga-header button,
    .dga-header label,
    .dga-footer h1,
    .dga-footer h2,
    .dga-footer h3,
    .dga-footer h4,
    .dga-footer h5,
    .dga-footer h6,
    .dga-footer a,
    .dga-footer p,
    .dga-footer li,
    .dga-footer span,
    .dga-footer address,
    .dga-scope,
    .dga-scope h1,
    .dga-scope h2,
    .dga-scope h3,
    .dga-scope h4,
    .dga-scope h5,
    .dga-scope h6,
    .dga-scope p,
    .dga-scope a,
    .dga-scope li,
    .dga-scope span,
    .dga-scope summary,
    .dga-scope button {
        font-family: IBMPlexSansArabic, "IBM Plex Sans Arabic", Tahoma, sans-serif !important;
    }

    .dga-header.header-wrap.style1:after {
        background-color: var(--background-primary);
    }

    /* Utility row owns its green surface. The theme :after is 67% of the whole
   header, so opening #dga-gov-verify stretched that strip and left the
   on-color social icons on a white background. */
    .dga-header .header-top,
    .dga-header.header-wrap.style1 .header-top {
        background: var(--background-primary);
        position: relative;
        overflow: visible;
    }


    .dga-header.header-wrap.style1:has(#dga-gov-verify:checked):after {
        height: 0;
    }

    .dga-header .header-top .header-top-left .contact-info,
    .dga-header.header-wrap.style1 .header-top .header-top-left .contact-info {
        display: flex;
        align-items: center;
        gap: 6px;
    }

        .dga-header .header-top .header-top-left .contact-info li,
        .dga-header.header-wrap.style1 .header-top .header-top-left .contact-info li {
            margin-inline-end: 0;
        }

            .dga-header .header-top .header-top-left .contact-info li a,
            .dga-header.header-wrap.style1 .header-top .header-top-left .contact-info li a {
                background: var(--colors-primary-sa-flag-700);
                border-color: var(--background-primary);
                color: var(--text-oncolor-primary);
            }

                .dga-header .header-top .header-top-left .contact-info li a:hover,
                .dga-header.header-wrap.style1 .header-top .header-top-left .contact-info li a:hover {
                    background-color: var(--colors-primary-sa-flag-900);
                }

                .dga-header .header-top .header-top-left .contact-info li a:focus-visible,
                .dga-header .navbar-nav .nav-link:focus-visible,
                .dga-header .btn.style1:focus-visible,
                .dga-header .mobile-menu a:focus-visible,
                .dga-header .mobile-menu button:focus-visible,
                .dga-header .menu-close a:focus-visible,
                .dga-header .menu-close button:focus-visible,
                .dga-header .navbar-brand:focus-visible,
                .dga-footer a:focus-visible,
                .dga-gov-banner__toggle:focus-visible,
                .dga-gov-banner a:focus-visible,
                .dga-header .dropdown-toggle:focus-visible,
                .dga-footer.footer-wrap .footer-logo a:focus-visible,
                .dga-footer.footer-wrap .footer-logo img:focus-visible {
                    outline: var(--focus-ring-width) solid var(--focus-ring-color);
                    outline-offset: 2px;
                }

    .dga-header .navbar-nav .nav-link {
        color: var(--colors-text-primary);
        font-weight: var(--font-weight-medium);
    }

        .dga-header .navbar-nav .nav-link:hover,
        .dga-header .navbar-nav .nav-item.has-child:hover > .nav-link {
            color: var(--link-primary);
        }

    .dga-header .btn.style1,
    .dga-header .dga-btn--primary {
        background-color: var(--button-background-primary-default);
        border-color: var(--button-background-primary-default);
        color: var(--text-oncolor-primary);
    }

        /* Legacy .btn sweep fills #ECF0F2 and turns label green — not official hover. */
        .dga-header .btn.style1::before,
        .dga-header .btn.style1::after,
        .dga-header .dga-btn::before,
        .dga-header .dga-btn::after {
            content: none !important;
            display: none !important;
        }

        .dga-header .btn.style1:hover,
        .dga-header .dga-btn--primary:hover:not(:disabled):not([aria-disabled="true"]) {
            background-color: var(--button-background-primary-hovered) !important;
            border-color: var(--button-background-primary-hovered) !important;
            color: var(--text-oncolor-primary) !important;
        }

        .dga-header .btn.style1:active,
        .dga-header .dga-btn--primary:active:not(:disabled):not([aria-disabled="true"]) {
            background-color: var(--button-background-primary-pressed) !important;
            border-color: var(--button-background-primary-pressed) !important;
            color: var(--text-oncolor-primary) !important;
        }

    .dga-header .dropdown-toggle {
        color: var(--text-oncolor-primary) !important;
    }

    /* Official primary + On Color so footer copy stays visible on the green surface. */
    .dga-footer.footer-wrap {
        background: var(--background-primary);
        color: var(--text-oncolor-primary);
        border-top: none;
        width: 100%;
        max-width: none;
        margin-left: 0;
        margin-right: 0;
        box-sizing: border-box;
    }

        .dga-footer.footer-wrap .footer-widget .footer-widget-title,
        .dga-footer.footer-wrap .footer-widget .social-link h6,
        .dga-footer.footer-wrap .footer-widget .footer-menu li a,
        .dga-footer.footer-wrap .footer-widget .contact-info li h6,
        .dga-footer.footer-wrap .footer-widget .contact-info li i,
        .dga-footer.footer-wrap .footer-widget .contact-info li p,
        .dga-footer.footer-wrap .footer-widget .contact-info li a {
            color: var(--text-oncolor-primary);
        }

            .dga-footer.footer-wrap .footer-widget .footer-widget-title:before {
                background-color: var(--alpha-white-20);
            }

            .dga-footer.footer-wrap .footer-widget .footer-widget-title:after {
                background-color: var(--text-oncolor-primary);
            }

            .dga-footer.footer-wrap .footer-widget .footer-menu li a:hover,
            .dga-footer.footer-wrap .footer-widget .contact-info li a:hover {
                color: var(--link-oncolor-hovered);
            }

        .dga-footer.footer-wrap .copyright-text,
        .dga-footer.footer-wrap .copyright-text span {
            background: var(--colors-primary-sa-flag-700);
            color: var(--text-oncolor-primary);
            width: 100%;
            max-width: none;
        }

        .dga-footer.footer-wrap,
        .dga-footer.footer-wrap .footer-widget-title,
        .dga-footer.footer-wrap .social-link h6 {
            font-family: IBMPlexSansArabic, "IBM Plex Sans Arabic", Tahoma, sans-serif;
        }

            .dga-footer.footer-wrap > .container {
                max-width: 1280px;
                width: 100%;
                margin-inline: auto;
                padding-inline: 16px;
            }

@media (min-width: 960px) {
    .dga-footer.footer-wrap > .container {
        padding-inline: 32px;
    }
}

.dga-footer.footer-wrap .container > .row {
    display: grid;
    grid-template-columns: 1fr;
    gap: 32px;
    margin: 0;
    padding-top: 40px;
    padding-bottom: 32px;
    --bs-gutter-x: 0;
}

@media (min-width: 600px) {
    .dga-footer.footer-wrap .container > .row {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    }
}

@media (min-width: 960px) {
    .dga-footer.footer-wrap .container > .row {
        grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) minmax(0, 1.5fr) minmax(0, 1.3fr);
    }
}

.dga-footer.footer-wrap .container > .row > [class*="col-"] {
    width: 100%;
    max-width: 100%;
    flex: 0 0 auto;
    padding-left: 0;
    padding-right: 0;
}

.dga-footer.footer-wrap .footer-widget {
    margin-bottom: 0;
    text-align: start;
}

    .dga-footer.footer-wrap .footer-widget .footer-widget-title {
        margin-bottom: 16px;
    }

        .dga-footer.footer-wrap .footer-widget .footer-widget-title:before,
        .dga-footer.footer-wrap .footer-widget .footer-widget-title:after {
            left: auto;
            right: auto;
            inset-inline-start: 0;
        }

    .dga-footer.footer-wrap .footer-widget .footer-menu {
        margin: 0;
        padding: 0;
    }

        .dga-footer.footer-wrap .footer-widget .footer-menu li {
            margin-bottom: 10px;
        }

    .dga-footer.footer-wrap .footer-widget .contact-info {
        margin: 0;
        padding: 0;
    }

        .dga-footer.footer-wrap .footer-widget .contact-info li {
            display: grid;
            grid-template-columns: 24px minmax(0, 1fr);
            column-gap: 12px;
            row-gap: 4px;
            align-items: start;
            margin-bottom: 20px;
        }

            .dga-footer.footer-wrap .footer-widget .contact-info li i {
                grid-column: 1;
                grid-row: 1 / -1;
                margin-inline-end: 0;
                line-height: 1.5;
                padding-top: 0.2em;
            }

            .dga-footer.footer-wrap .footer-widget .contact-info li h6 {
                margin-bottom: 4px;
            }

            .dga-footer.footer-wrap .footer-widget .contact-info li h6,
            .dga-footer.footer-wrap .footer-widget .contact-info li p,
            .dga-footer.footer-wrap .footer-widget .contact-info li a {
                grid-column: 2;
            }

            .dga-footer.footer-wrap .footer-widget .contact-info li p {
                flex: none;
                padding-inline-start: 0;
                line-height: 1.7;
                overflow-wrap: anywhere;
            }

.dga-footer.footer-wrap .footer-logo {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 16px;
}

    .dga-footer.footer-wrap .footer-logo img {
        display: block;
        width: 100%;
        max-width: min(220px, 100%);
        height: auto;
        aspect-ratio: 616 / 203;
    }

        /* Stamp is the only .footer-logo img after the Nazaha mark was removed. Do not invert it. */
        .dga-footer.footer-wrap .footer-logo img:first-of-type {
            filter: none;
            height: auto;
            max-width: min(220px, 100%);
        }

        .dga-footer.footer-wrap .footer-logo img:nth-of-type(2) {
            max-width: min(220px, 100%);
        }

.dga-footer.footer-wrap .social-link h6 {
    font-size: 1.125rem;
    margin-top: 20px;
    margin-inline-end: 0;
}

.dga-footer.footer-wrap .social-link .social-profile {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 12px 0 0;
    padding: 0;
}

    .dga-footer.footer-wrap .social-link .social-profile li a {
        margin-inline-start: 0;
    }

@media (max-width: 599px) {
    .dga-footer .row > [class*="col-"] {
        flex: 0 0 100%;
        max-width: 100%;
    }
}

/* Official identity bar — same anatomy as dga.gov.sa .digital-stamp-card */
.dga-gov-banner,
.dga-gov-banner h6,
.dga-gov-banner p,
.dga-gov-banner a,
.dga-gov-banner label,
.dga-gov-banner span {
    font-family: IBMPlexSansArabic, "IBM Plex Sans Arabic", Tahoma, sans-serif !important;
}

.dga-gov-banner {
    background: var(--colors-gray-50);
    color: var(--text-secondary-paragraph);
}

.dga-gov-banner__check {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.dga-gov-banner__bar {
    padding: 8px 10px !important
}

.dga-gov-banner__row {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
}

.dga-gov-banner__flag {
    flex: 0 0 auto;
    display: block;
    width: 20px;
    height: 14px;
}

.dga-gov-banner__label {
    margin: 0;
    color: var(--colors-base-black);
    font-size: 0.875rem;
    font-weight: 500;
}

.dga-gov-banner__toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin: 0;
    cursor: pointer;
    color: var(--link-primary);
    font-size: 0.875rem;
    font-weight: 600;
}

    .dga-gov-banner__toggle img {
        transition: transform 0.2s ease;
    }

.dga-gov-banner__check:checked ~ .dga-gov-banner__bar .dga-gov-banner__toggle img {
    transform: rotate(180deg);
}

.dga-gov-banner__panel {
    display: none;
    padding: 40px 0 32px;
}

.dga-gov-banner__check:checked ~ .dga-gov-banner__panel {
    display: block;
}

.dga-gov-banner__cols {
    display: flex;
    gap: 32px;
    margin-bottom: 32px;
}

.dga-gov-banner__box {
    display: flex;
    align-items: flex-start;
    gap: 18px;
    flex: 1 1 0;
    min-width: 0;
}

    .dga-gov-banner__box img {
        flex: 0 0 52px;
    }

    .dga-gov-banner__box h6 {
        margin: 0 0 12px;
        color: var(--colors-base-black);
        font-size: 18px;
        font-weight: 500;
        line-height: 1.2;
    }

    .dga-gov-banner__box p {
        margin: 0;
        color: var(--text-primary-paragraph);
        font-size: 16px;
        line-height: 24px;
    }

.dga-gov-banner__hl {
    color: var(--link-primary);
    font-weight: 500;
}

.dga-gov-banner__reg {
    display: inline-flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 12px;
    padding: 8px 28px;
    border-radius: 8px;
    background: var(--colors-base-white);
}

    .dga-gov-banner__reg p {
        margin: 0;
        color: var(--text-primary-paragraph);
        font-size: 16px;
    }

    .dga-gov-banner__reg a {
        color: var(--link-primary);
        text-decoration: underline;
    }

.dga-header.header-wrap.sticky {
    top: -100px;
}

.content-wrapper {
    margin-top: 136px;
}

.page-wrapper:has(#dga-gov-verify:checked) .content-wrapper {
    margin-top: 396px;
}

@media (max-width: 767px) {
    .dga-gov-banner__cols {
        flex-direction: column;
    }

    /* Theme sets header to static below 768px. Keep it a containing block so
     style1:after (87% green) is the header strip, not 87% of the viewport. */
    .dga-header.header-wrap.style1 {
        position: relative;
    }

        .dga-header.header-wrap.style1:after {
            height: 100%;
        }

    .dga-header .header-bottom {
        position: relative;
        z-index: 1;
    }

    .content-wrapper,
    .page-wrapper:has(#dga-gov-verify:checked) .content-wrapper {
        margin-top: 0;
    }
}

/* dga.gov.sa footer anatomy — Nazaha content and stamp 791 preserved */
.dga-footer.footer-wrap {
    background: var(--colors-primary-sa-flag-900);
    color: var(--text-oncolor-primary);
    margin-top: var(--spacing-xl);
}

    .dga-footer.footer-wrap .dga-footer-brand {
        padding-top: 40px;
    }

    .dga-footer.footer-wrap .dga-footer-org-logo {
        display: block;
        height: 48px;
        width: auto;
        max-width: 160px;
    }

    .dga-footer.footer-wrap .dga-footer-body {
        display: flex;
        flex-wrap: wrap;
        gap: 24px;
        padding-top: 24px;
        padding-bottom: 40px;
    }

    .dga-footer.footer-wrap .dga-footer-section {
        flex: 1 1 45%;
        min-width: 0;
        margin-bottom: 0;
    }

@media (min-width: 960px) {
    .dga-footer.footer-wrap .dga-footer-section {
        flex: 0 0 23.33%;
    }
}

.dga-footer.footer-wrap .dga-footer-acc,
.dga-footer.footer-wrap .dga-footer-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin: 0;
    padding: 0 0 8px;
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--border-oncolor-transparent-30);
    color: var(--text-oncolor-primary);
    font-family: IBMPlexSansArabic, "IBM Plex Sans Arabic", Tahoma, sans-serif;
    font-size: 16px;
    font-weight: 600;
    text-align: start;
    cursor: default;
}

    .dga-footer.footer-wrap .dga-footer-acc:focus-visible {
        outline: var(--focus-ring-width) solid var(--text-oncolor-primary);
        outline-offset: 2px;
    }

.dga-footer.footer-wrap .dga-footer-chevron {
    display: none;
    flex: 0 0 auto;
}

.dga-footer.footer-wrap .dga-footer-section-body {
    margin: 0;
    padding: 0;
}

    .dga-footer.footer-wrap .dga-footer-section-body > li {
        margin: 8px 0 0;
    }

.dga-footer.footer-wrap .footer-widget-title:before,
.dga-footer.footer-wrap .footer-widget-title:after,
.dga-footer.footer-wrap .dga-footer-acc:before,
.dga-footer.footer-wrap .dga-footer-acc:after {
    display: none;
}

.dga-footer.footer-wrap .footer-menu li a,
.dga-footer.footer-wrap .contact-info li a,
.dga-footer.footer-wrap .contact-info li p,
.dga-footer.footer-wrap .contact-info li h6,
.dga-footer.footer-wrap .contact-info li i {
    color: var(--text-oncolor-primary);
    font-size: 14px;
}

    .dga-footer.footer-wrap .footer-menu li a:hover {
        color: var(--link-oncolor-hovered);
        text-decoration: underline;
    }

.dga-footer.footer-wrap .dga-footer-social {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 12px 0 24px;
    padding: 0;
}

    .dga-footer.footer-wrap .dga-footer-social li a {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        margin: 0;
        background: var(--background-primary);
        border-radius: 4px;
        color: var(--text-oncolor-primary);
    }

        .dga-footer.footer-wrap .dga-footer-social li a i,
        .dga-footer.footer-wrap .dga-footer-social li a svg {
            color: var(--text-oncolor-primary);
            fill: var(--icon-oncolor);
        }

.dga-footer.footer-wrap .dga-footer-a11y {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin: 12px 0 24px;
}

.dga-footer.footer-wrap .dga-footer-a11y-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    padding: 0 6px;
    background: var(--background-primary);
    border: 0;
    border-radius: 4px;
    color: var(--text-oncolor-primary);
    font-size: 12px;
    font-family: IBMPlexSansArabic, "IBM Plex Sans Arabic", Tahoma, sans-serif;
    text-decoration: none;
    cursor: pointer;
}

    .dga-footer.footer-wrap .dga-footer-a11y-btn:hover,
    .dga-footer.footer-wrap .dga-footer-social li a:hover,
    .dga-footer.footer-wrap .dga-footer-social li a:hover i,
    .dga-footer.footer-wrap .dga-footer-social li a:hover svg {
        color: var(--text-oncolor-primary);
        fill: var(--icon-oncolor);
        opacity: 0.8;
    }

.dga-footer.footer-wrap .dga-footer-a11y-btn--wide {
    width: fit-content;
    gap: 4px;
    padding: 0 8px;
}

.dga-footer.footer-wrap .dga-footer-section--connect .dga-footer-heading:not(:first-child) {
    margin-top: 8px;
}

.dga-footer.footer-wrap .footer-logo {
    margin-top: 8px;
}

.dga-footer.footer-wrap .dga-footer-policy {
    padding: 16px 0;
}

.dga-footer.footer-wrap .dga-footer-policy__row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.dga-footer.footer-wrap .copyright-text,
.dga-footer.footer-wrap .copyright-text span {
    background: transparent;
    color: var(--text-oncolor-primary);
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    font-size: 14px;
    font-weight: 600;
}

.dga-footer.footer-wrap .dga-footer-policy__links {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin-top: 10px;
}

    .dga-footer.footer-wrap .dga-footer-policy__links a {
        color: var(--text-oncolor-primary);
        font-size: 14px;
    }

        .dga-footer.footer-wrap .dga-footer-policy__links a:hover {
            color: var(--link-oncolor-hovered);
            text-decoration: underline;
        }

.dga-footer.footer-wrap a:focus-visible,
.dga-footer.footer-wrap .dga-footer-a11y-btn:focus-visible,
.dga-footer.footer-wrap .footer-logo a:focus-visible,
.dga-footer.footer-wrap .footer-logo img:focus-visible {
    outline: var(--focus-ring-width) solid var(--text-oncolor-primary);
    outline-offset: 2px;
}

.dga-footer.footer-wrap .dga-footer-policy__end img {
    display: block;
    height: 47px;
    width: auto;
}

.dga-footer.footer-wrap .contact-info {
    list-style: none;
}

    .dga-footer.footer-wrap .contact-info li {
        display: grid;
        grid-template-columns: 24px minmax(0, 1fr);
        column-gap: 12px;
        row-gap: 4px;
        align-items: start;
        margin: 12px 0 0;
    }

        .dga-footer.footer-wrap .contact-info li i {
            grid-column: 1;
            grid-row: 1 / -1;
            line-height: 1;
            display: inline-flex;
            align-items: center;
            justify-content: center;
            height: 1.25em;
        }

        .dga-footer.footer-wrap .contact-info li.dga-footer-contact-inline {
            align-items: center;
        }

            .dga-footer.footer-wrap .contact-info li.dga-footer-contact-inline i {
                align-self: center;
                height: auto;
            }

            .dga-footer.footer-wrap .contact-info li.dga-footer-contact-inline a {
                justify-self: start;
                width: max-content;
                line-height: 1.25;
                unicode-bidi: isolate;
            }

        .dga-footer.footer-wrap .contact-info li h6,
        .dga-footer.footer-wrap .contact-info li p,
        .dga-footer.footer-wrap .contact-info li a {
            grid-column: 2;
        }

@media (max-width: 599px) {
    .dga-footer.footer-wrap .dga-footer-body {
        display: block;
        padding-bottom: 0;
    }

    .dga-footer.footer-wrap .dga-footer-section {
        flex: none;
        width: 100%;
        margin-bottom: 30px;
    }

    .dga-footer.footer-wrap .dga-footer-acc {
        cursor: pointer;
    }

    .dga-footer.footer-wrap .dga-footer-chevron {
        display: block;
    }

    .dga-footer.footer-wrap .dga-footer-section.is-open .dga-footer-chevron {
        transform: rotate(180deg);
    }

    .dga-footer.footer-wrap .dga-footer-section:not(.dga-footer-section--connect) .dga-footer-section-body {
        display: none;
    }

    .dga-footer.footer-wrap .dga-footer-section.is-open .dga-footer-section-body {
        display: block;
    }

    .dga-footer.footer-wrap .dga-footer-section.is-open .contact-info.dga-footer-section-body {
        display: grid;
    }

    .dga-footer.footer-wrap .dga-footer-policy__row {
        flex-direction: column-reverse;
        align-items: flex-start;
    }
}

/* W05 Navigation Header + Menu
   Official: https://design.dga.gov.sa/guidelines/components/ui-shell/navigation-header
             https://design.dga.gov.sa/guidelines/components/navigational/menu
   Porto/Bootstrap class names are retained as drawer/CMS behavior hooks. */
.dga-header.dga-nav-header .dga-menu__link,
.dga-header .navbar-nav .nav-link {
    color: var(--colors-text-primary);
    font-weight: var(--font-weight-medium);
    border-radius: 2px;
}

    .dga-header .navbar-nav .nav-link:hover,
    .dga-header .navbar-nav .nav-item.has-child:hover > .nav-link,
    .dga-header .dga-menu__link:hover {
        color: var(--link-primary);
    }

    .dga-header .navbar-nav .nav-link:active,
    .dga-header .dga-menu__link:active {
        color: var(--colors-primary-sa-flag-800);
    }

    .dga-header .navbar-nav .nav-link:focus-visible,
    .dga-header .dga-menu__link:focus-visible,
    .dga-header .dga-btn:focus-visible,
    .dga-header .mobile-menu a:focus-visible,
    .dga-header .mobile-menu button:focus-visible,
    .dga-header .menu-close a:focus-visible,
    .dga-header .menu-close button:focus-visible,
    .dga-header .navbar-brand:focus-visible {
        outline: var(--focus-ring-width) solid var(--focus-ring-color);
        outline-offset: 2px;
    }

    .dga-header .navbar-nav .nav-link[aria-disabled="true"],
    .dga-header .dga-menu__link[aria-disabled="true"],
    .dga-header .dga-menu__link.is-disabled {
        color: var(--colors-gray-400);
        pointer-events: none;
        cursor: not-allowed;
    }

    .dga-header .navbar-nav > .nav-item.is-selected > .nav-link,
    .dga-header .dga-menu__link.is-selected,
    .dga-header .navbar-nav .nav-link[aria-current="page"] {
        color: var(--colors-primary-sa-flag-600-primary);
        font-weight: 600;
    }

.dga-header .dga-menu__chevron {
    display: inline-block;
    margin-inline-start: 4px;
    vertical-align: middle;
    color: currentColor;
}

.dga-header .dga-menu__link.dga-has-external-icon {
    display: inline-flex;
    align-items: center;
    gap: 4px;
}

body.dga-nav-open {
    overflow: hidden;
}

    body.dga-nav-open::before {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba(16, 24, 40, 0.4);
        z-index: 997;
    }

.dga-header.dga-nav-header {
    z-index: 1000;
}

.dga-header .mobile-menu a,
.dga-header .mobile-menu button {
    width: 44px !important;
    height: 44px !important;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 4px !important;
    background-color: var(--colors-primary-sa-flag-600-primary) !important;
    color: var(--colors-base-white);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

    .dga-header .mobile-menu a:hover,
    .dga-header .mobile-menu button:hover {
        background-color: var(--colors-primary-sa-flag-700) !important;
    }

    .dga-header .mobile-menu a:active,
    .dga-header .mobile-menu button:active {
        background-color: var(--colors-primary-sa-flag-900) !important;
    }

.dga-header .menu-close a,
.dga-header .menu-close button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--colors-gray-700, #344054);
    cursor: pointer;
}

.dga-header .menu-close .dga-icon,
.dga-header .dga-menu-close-btn .dga-icon {
    color: var(--colors-gray-700, #344054);
    background-color: currentColor;
}

@media (min-width: 992px) {
    .dga-header .navbar-nav > .nav-item > .nav-link.is-selected::after,
    .dga-header .navbar-nav > .nav-item.is-selected > .nav-link::after {
        content: "";
        position: absolute;
        inset-inline: 0;
        bottom: 18px;
        height: 2px;
        background: var(--colors-primary-sa-flag-600-primary);
        visibility: visible;
        opacity: 1;
        width: auto;
        transform: none;
    }

    .dga-header .navbar-nav .nav-item.has-child:hover > .dga-menu__chevron,
    .dga-header .navbar-nav .nav-item.has-child:focus-within > .dga-menu__chevron,
    .dga-header .navbar-nav .nav-item.has-child:hover > .nav-link .dga-menu__chevron,
    .dga-header .navbar-nav .nav-item.has-child:focus-within > .nav-link .dga-menu__chevron {
        transform: rotate(180deg);
    }

    .dga-header .navbar-nav .nav-item .dropdown-menu {
        transform: none !important;
        top: 100%;
        border-radius: 8px;
        border: 1px solid var(--colors-gray-200, #e4e7ec);
        box-shadow: 0 4px 16px rgba(16, 24, 40, 0.12);
        padding: 8px 0;
        background: var(--colors-base-white);
    }

    .dga-header .navbar-nav .nav-item.has-child:focus-within > .dropdown-menu {
        opacity: 1;
        visibility: visible;
        transform: none;
    }

    .dga-header .navbar-nav .nav-item .dropdown-menu li a:before {
        display: none !important;
    }

    .dga-header .navbar-nav .nav-item .dropdown-menu li a {
        padding: 10px 16px !important;
        min-height: 44px;
        display: flex;
        align-items: center;
    }

        .dga-header .navbar-nav .nav-item .dropdown-menu li a:hover,
        .dga-header .navbar-nav .nav-item .dropdown-menu li a:focus-visible {
            background: var(--colors-primary-sa-flag-50, #f3fcf6);
            color: var(--colors-primary-sa-flag-700);
        }

        .dga-header .navbar-nav .nav-item .dropdown-menu li a:active {
            background: var(--colors-primary-sa-flag-100, #dff6e7);
        }

        .dga-header .navbar-nav .nav-item .dropdown-menu li.is-selected > a,
        .dga-header .navbar-nav .nav-item .dropdown-menu li a.is-selected,
        .dga-header .navbar-nav .nav-item .dropdown-menu li a[aria-current="page"] {
            background: var(--colors-primary-sa-flag-50, #f3fcf6);
            color: var(--colors-primary-sa-flag-700) !important;
            font-weight: 600;
        }
}

@media (max-width: 991px) {
    .dga-header .menu-close {
        position: absolute;
        top: 12px;
        inset-inline-end: 12px;
        inset-inline-start: auto;
        left: auto !important;
        right: auto !important;
        z-index: 2;
    }

    .dga-header .main-menu-wrap {
        left: auto !important;
        right: auto !important;
        inset-inline-start: -100% !important;
        inset-inline-end: auto;
        width: min(22.5rem, 100%);
        max-width: 100%;
        background: var(--colors-base-white);
        z-index: 1001;
        padding-top: 64px;
        visibility: hidden;
        pointer-events: none;
    }

        .dga-header .main-menu-wrap.open {
            inset-inline-start: 0 !important;
            visibility: visible;
            pointer-events: auto;
        }

    .dga-header .navbar-nav .nav-item a {
        min-height: 44px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .dga-header .navbar-nav .nav-item.is-selected > .nav-link,
    .dga-header .navbar-nav .nav-link.is-selected {
        color: var(--colors-primary-sa-flag-600-primary);
        font-weight: 600;
    }

    .dga-header .navbar-nav .nav-item.has-child.menu-open > .nav-link .dga-menu__chevron,
    .dga-header .navbar-nav .nav-item.has-child > .nav-link[aria-expanded="true"] .dga-menu__chevron {
        transform: rotate(180deg);
    }

    .dga-header .navbar-nav .nav-item .dropdown-menu {
        position: static;
        width: 100%;
        box-shadow: none;
        transform: none !important;
        padding-inline-start: 12px;
        border: 0;
    }

    .dga-header .other-options .dga-btn {
        min-height: 44px;
    }

    .dga-header .main-menu-wrap.open .other-options.md-none {
        display: block !important;
        margin-top: 16px;
    }
}

.dga-header .searchbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    min-width: 44px;
    min-height: 44px;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    cursor: pointer;
}

    .dga-header .searchbtn:focus-visible {
        outline: 2px solid var(--colors-base-black);
        outline-offset: 2px;
    }

.dga-header .search-area form {
    display: flex;
    align-items: center;
    width: 100%;
    gap: 8px;
}

.dga-header .search-area input[type="search"] {
    flex: 1 1 auto;
    min-width: 0;
}

.dga-header .search-area button.close-searchbox {
    background: transparent;
    width: 44px;
    min-width: 44px;
    height: 44px;
}

.dga-header .mobile-bar-wrap {
    display: flex;
    align-items: center;
    gap: 8px;
}