/*
=======================================================================
 Legalgen Shared Public Header + Footer
 Loaded only by layouts/customtheme.blade.php when themeslug=legalgen.

 Contains approved:
 - Premium Header 6B
 - Premium Footer 7
 - Dropdown and Footer Logo Correction 7B

 Does not contain questionnaire form, sidebar, field or step styling.
=======================================================================
*/


/* ===== CQ-PREMIUM-PUBLIC-HEADER-6B START =====
   Public questionnaire header only.
   Replaces simple Header 6A styling with premium brand composition.
   No navigation, authentication, route or contact logic changed.
======================================================================= */

#ftco-navbar {
    min-height: 86px !important;
    max-height: none !important;
    margin: 0 !important;
    padding: 0 !important;

    background:
        linear-gradient(180deg, #ffffff 0%, #fbfdfe 100%) !important;

    border: 0 !important;
    border-bottom: 1px solid #d8e5ec !important;

    box-shadow:
        inset 0 3px 0 #0788a8,
        0 7px 24px rgba(22, 53, 73, 0.09) !important;

    font-family: "Inter", Arial, sans-serif !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    z-index: 1030 !important;
}

#ftco-navbar > .container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    width: calc(100% - 32px) !important;
    max-width: 1280px !important;
    min-height: 86px !important;

    margin: 0 auto !important;
    padding: 7px 4px !important;
}

/* Brand area */

#ftco-navbar .logo-container {
    display: flex !important;
    align-items: center !important;
    flex: 0 1 auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

#ftco-navbar .navbar-brand,
#ftco-navbar .lg-header-brand {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 2px 0 !important;
    text-decoration: none !important;
}

#ftco-navbar .lg-header-logo-img,
#ftco-navbar img#logo {
    display: block !important;
    width: auto !important;
    max-width: min(285px, 30vw) !important;
    height: auto !important;
    max-height: 67px !important;
    margin: 0 !important;
    object-fit: contain !important;
}

#ftco-navbar .lg-header-brand-text {
    color: #17364c !important;
    font-family: "Inter", Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.02em !important;
}

/* Navigation layout */

#ftco-navbar #ftco-nav {
    flex-grow: 1 !important;
    background: transparent !important;
}

#ftco-navbar .navbar-nav {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin-left: auto !important;
}

#ftco-navbar .navbar-nav > .nav-item {
    margin: 0 !important;
    padding: 0 !important;
}

#ftco-navbar .navbar-nav > .nav-item > .nav-link {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 7px !important;

    min-height: 42px !important;
    margin: 0 !important;
    padding: 9px 12px !important;

    color: #263c4f !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    border-radius: 11px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;
    text-transform: none !important;
    white-space: nowrap !important;

    transition:
        color 0.18s ease,
        background-color 0.18s ease,
        border-color 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease !important;
}

/* Home */

#ftco-navbar
.navbar-nav > .nav-item.active:first-child > .nav-link {
    color: #096e88 !important;
    background: #eaf5f8 !important;
    border-color: #cfe6ec !important;
    font-weight: 600 !important;
}

#ftco-navbar
.navbar-nav > .nav-item.active:first-child > .nav-link:hover {
    color: #075d74 !important;
    background: #deeff4 !important;
    border-color: #badce5 !important;
}

/* Phone and email premium contact chips */

#ftco-navbar a[href^="tel:"],
#ftco-navbar a[href^="mailto:"] {
    color: #30465a !important;
    background: #ffffff !important;
    border-color: #dbe6ed !important;

    box-shadow:
        0 3px 10px rgba(27, 58, 78, 0.045),
        inset 0 0 0 1px rgba(255, 255, 255, 0.75) !important;
}

#ftco-navbar a[href^="tel:"]:hover,
#ftco-navbar a[href^="mailto:"]:hover {
    color: #087b96 !important;
    background: #f6fbfc !important;
    border-color: #bcdce5 !important;
    transform: translateY(-1px) !important;
}

#ftco-navbar a[href^="tel:"] .icon,
#ftco-navbar a[href^="mailto:"] .icon {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 25px !important;
    height: 25px !important;

    color: #087f9b !important;
    background: #e8f5f8 !important;
    border: 1px solid #d0e8ee !important;
    border-radius: 50% !important;

    font-size: 11px !important;
    line-height: 1 !important;
}

/* Account chip */

#ftco-navbar #navbarDropdown {
    min-width: 116px !important;
    padding-right: 14px !important;
    padding-left: 14px !important;

    color: #ffffff !important;
    background:
        linear-gradient(135deg, #17394e 0%, #0f6077 100%) !important;

    border-color: #16445b !important;

    font-weight: 600 !important;

    box-shadow:
        0 6px 16px rgba(18, 59, 79, 0.18),
        inset 0 1px 0 rgba(255, 255, 255, 0.12) !important;
}

#ftco-navbar #navbarDropdown:hover,
#ftco-navbar #navbarDropdown:focus {
    color: #ffffff !important;
    background:
        linear-gradient(135deg, #123247 0%, #087b96 100%) !important;

    border-color: #0c718a !important;
    transform: translateY(-1px) !important;
}

#ftco-navbar #navbarDropdown::after {
    margin-left: 8px !important;
    border-top-color: rgba(255, 255, 255, 0.9) !important;
}

/* General hover */

#ftco-navbar
.navbar-nav > .nav-item > .nav-link:hover,
#ftco-navbar
.navbar-nav > .nav-item > .nav-link:focus {
    text-decoration: none !important;
    outline: 0 !important;
}

/* Dropdown card */

#ftco-navbar .dropdown-menu {
    min-width: 205px !important;
    margin-top: 10px !important;
    padding: 8px !important;

    background: rgba(255, 255, 255, 0.99) !important;
    border: 1px solid #d7e4eb !important;
    border-radius: 13px !important;

    box-shadow:
        0 18px 40px rgba(21, 50, 70, 0.16),
        inset 0 1px 0 #ffffff !important;
}

#ftco-navbar .dropdown-item {
    padding: 10px 12px !important;

    color: #2a4053 !important;
    border-radius: 8px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
    text-decoration: none !important;
}

#ftco-navbar .dropdown-item:hover,
#ftco-navbar .dropdown-item:focus {
    color: #076e87 !important;
    background: #eaf5f8 !important;
}

/* Mobile menu */

#ftco-navbar .navbar-toggler {
    min-height: 42px !important;
    margin-left: auto !important;
    padding: 9px 12px !important;

    color: #17394f !important;
    background: #edf6f8 !important;
    border: 1px solid #cfe3ea !important;
    border-radius: 10px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
}

#ftco-navbar .navbar-toggler:focus {
    outline: 0 !important;
    box-shadow: 0 0 0 3px rgba(7, 136, 168, 0.13) !important;
}

@media (max-width: 1100px) {
    #ftco-navbar .navbar-nav {
        gap: 4px !important;
    }

    #ftco-navbar .navbar-nav > .nav-item > .nav-link {
        padding-right: 9px !important;
        padding-left: 9px !important;
        font-size: 12px !important;
    }
}

@media (max-width: 991.98px) {
    #ftco-navbar,
    #ftco-navbar > .container {
        min-height: 74px !important;
    }

    #ftco-navbar > .container {
        flex-wrap: wrap !important;
        width: calc(100% - 20px) !important;
        padding-top: 7px !important;
        padding-bottom: 7px !important;
    }

    #ftco-navbar .lg-header-logo-img,
    #ftco-navbar img#logo {
        max-width: min(225px, 57vw) !important;
        max-height: 55px !important;
    }

    #ftco-navbar #ftco-nav {
        flex-basis: 100% !important;
        width: 100% !important;

        margin-top: 9px !important;
        padding: 11px !important;

        background: #ffffff !important;
        border: 1px solid #d8e5ec !important;
        border-radius: 13px !important;

        box-shadow: 0 16px 34px rgba(23, 54, 74, 0.12) !important;
    }

    #ftco-navbar .navbar-nav {
        align-items: stretch !important;
        gap: 5px !important;
        width: 100% !important;
    }

    #ftco-navbar .navbar-nav > .nav-item,
    #ftco-navbar .navbar-nav > .nav-item > .nav-link {
        width: 100% !important;
    }

    #ftco-navbar .navbar-nav > .nav-item > .nav-link {
        justify-content: flex-start !important;
        padding: 10px 12px !important;
        white-space: normal !important;
    }

    #ftco-navbar #navbarDropdown {
        justify-content: space-between !important;
    }

    #ftco-navbar .dropdown-menu {
        margin-top: 5px !important;
        box-shadow: none !important;
    }
}

@media (max-width: 575.98px) {
    #ftco-navbar > .container {
        width: calc(100% - 14px) !important;
    }

    #ftco-navbar .lg-header-logo-img,
    #ftco-navbar img#logo {
        max-width: 205px !important;
        max-height: 50px !important;
    }
}

/* ===== CQ-PREMIUM-PUBLIC-HEADER-6B END ===== */

/* ===== CQ-PREMIUM-PUBLIC-FOOTER-7 START =====
   Public questionnaire footer only.
   Premium compact styling for existing dynamic footer markup.
   No footer links, products, Blade, routes or logic changed.
======================================================================= */

footer.ftco-footer.ftco-bg-dark.ftco-section {
    position: relative !important;
    overflow: hidden !important;

    min-height: 0 !important;
    margin: 0 !important;
    padding: 58px 0 0 !important;

    color: #d9e7ee !important;

    background:
        radial-gradient(
            750px 360px at 8% -10%,
            rgba(7, 136, 168, 0.2) 0%,
            rgba(7, 136, 168, 0) 66%
        ),
        radial-gradient(
            650px 330px at 100% 20%,
            rgba(42, 112, 139, 0.14) 0%,
            rgba(42, 112, 139, 0) 64%
        ),
        linear-gradient(
            135deg,
            #0d1c28 0%,
            #142a38 52%,
            #10232f 100%
        ) !important;

    border-top: 1px solid rgba(123, 195, 215, 0.24) !important;

    box-shadow:
        inset 0 3px 0 #0788a8,
        0 -12px 32px rgba(17, 45, 63, 0.08) !important;

    font-family: "Inter", Arial, sans-serif !important;
}

/* Subtle premium background pattern. */
footer.ftco-footer.ftco-bg-dark.ftco-section::before {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;

    pointer-events: none !important;
    opacity: 0.08 !important;

    background-image:
        linear-gradient(
            rgba(255, 255, 255, 0.13) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255, 255, 255, 0.13) 1px,
            transparent 1px
        ) !important;

    background-size: 36px 36px !important;
    mask-image:
        linear-gradient(
            180deg,
            rgba(0, 0, 0, 0.75),
            transparent 75%
        ) !important;
}

footer.ftco-footer.ftco-bg-dark.ftco-section > .container {
    position: relative !important;
    z-index: 1 !important;

    width: calc(100% - 32px) !important;
    max-width: 1280px !important;

    margin-right: auto !important;
    margin-left: auto !important;
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* ---- Main footer columns -------------------------------------------- */

footer.ftco-footer
> .container
> .row:first-child {
    display: flex !important;
    align-items: flex-start !important;
    flex-wrap: wrap !important;

    gap: 38px !important;

    margin: 0 !important;
    padding: 0 0 42px !important;
}

footer.ftco-footer
> .container
> .row:first-child
> .col-md {
    flex: 1 1 180px !important;
    width: auto !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;
}

footer.ftco-footer
> .container
> .row:first-child
> .col-md:first-child {
    flex: 1.1 1 230px !important;
}

footer.ftco-footer
> .container
> .row:first-child
> .col-md:last-child {
    flex: 1.65 1 340px !important;
}

footer.ftco-footer .ftco-footer-widget,
footer.ftco-footer .ftco-footer-widget.mb-4 {
    height: auto !important;
    min-height: 0 !important;

    margin: 0 !important;
    padding: 0 !important;
}

/* ---- Premium logo card ---------------------------------------------- */

footer.ftco-footer h2.logo {
    margin: 0 !important;
    padding: 0 !important;
}

footer.ftco-footer h2.logo > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    max-width: 100% !important;

    margin: 0 !important;
    padding: 14px 17px !important;

    color: #16364b !important;
    background:
        linear-gradient(
            145deg,
            #ffffff 0%,
            #f6fafc 100%
        ) !important;

    border: 1px solid rgba(213, 229, 237, 0.95) !important;
    border-radius: 15px !important;

    box-shadow:
        0 15px 34px rgba(3, 16, 26, 0.2),
        inset 0 1px 0 #ffffff !important;

    text-decoration: none !important;
}

footer.ftco-footer h2.logo img {
    display: block !important;

    width: auto !important;
    max-width: 220px !important;
    height: auto !important;
    max-height: 90px !important;

    margin: 0 !important;
    object-fit: contain !important;
}

/* ---- Column headings ------------------------------------------------ */

footer.ftco-footer .ftco-heading-2 {
    position: relative !important;

    margin: 0 0 18px !important;
    padding: 0 0 12px !important;

    color: #ffffff !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    letter-spacing: -0.01em !important;
    text-transform: none !important;
}

footer.ftco-footer .ftco-heading-2::after {
    content: "" !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;

    width: 36px !important;
    height: 2px !important;

    border-radius: 999px !important;

    background:
        linear-gradient(
            90deg,
            #25b6d2 0%,
            rgba(37, 182, 210, 0.2) 100%
        ) !important;
}

/* ---- Lists and links ------------------------------------------------ */

footer.ftco-footer ul,
footer.ftco-footer ul.list-unstyled {
    margin: 0 !important;
    padding: 0 !important;
}

footer.ftco-footer ul li {
    margin: 0 0 8px !important;
    padding: 0 !important;

    color: #bed0da !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.48 !important;

    list-style: none !important;
    break-inside: avoid !important;
}

footer.ftco-footer ul li:last-child {
    margin-bottom: 0 !important;
}

footer.ftco-footer ul li > a {
    display: inline-flex !important;
    align-items: flex-start !important;

    max-width: 100% !important;

    color: #d8e5eb !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.48 !important;
    letter-spacing: 0 !important;
    text-decoration: none !important;

    transition:
        color 0.17s ease,
        transform 0.17s ease !important;
}

footer.ftco-footer ul li > a:hover,
footer.ftco-footer ul li > a:focus {
    color: #ffffff !important;
    text-decoration: none !important;
    transform: translateX(3px) !important;
}

/* Existing arrow icon becomes a refined teal indicator. */
footer.ftco-footer
ul li > a
.ion-ios-arrow-forward {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    flex: 0 0 18px !important;

    width: 18px !important;
    height: 18px !important;

    margin: 1px 9px 0 0 !important;

    color: #5cc6dc !important;
    background: rgba(39, 173, 204, 0.11) !important;
    border: 1px solid rgba(92, 198, 220, 0.18) !important;
    border-radius: 50% !important;

    font-size: 9px !important;
    line-height: 1 !important;

    transition:
        color 0.17s ease,
        background-color 0.17s ease,
        border-color 0.17s ease !important;
}

footer.ftco-footer
ul li > a:hover
.ion-ios-arrow-forward {
    color: #ffffff !important;
    background: #0788a8 !important;
    border-color: #0788a8 !important;
}

/* ---- Product list compact desktop columns --------------------------- */

@media (min-width: 1200px) {
    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:last-child
    ul {
        columns: 2 !important;
        column-gap: 28px !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:last-child
    ul li {
        break-inside: avoid-column !important;
        page-break-inside: avoid !important;
    }
}

/* ---- Contact fallback block ----------------------------------------- */

footer.ftco-footer .opening-hours h4 {
    margin: 0 0 5px !important;

    color: #ffffff !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 12px !important;
    font-weight: 600 !important;
    line-height: 1.4 !important;
}

footer.ftco-footer .opening-hours p,
footer.ftco-footer .opening-hours p.pl-3 {
    margin: 0 0 13px !important;
    padding: 0 !important;

    color: #c7d7df !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
}

/* ---- Copyright bar -------------------------------------------------- */

footer.ftco-footer
> .container
> .row:last-child {
    margin: 0 !important;
    padding: 19px 0 21px !important;

    border-top: 1px solid rgba(190, 219, 231, 0.14) !important;
}

footer.ftco-footer
> .container
> .row:last-child
> .col-md-12 {
    margin: 0 !important;
    padding: 0 !important;
}

footer.ftco-footer
> .container
> .row:last-child p {
    margin: 0 !important;
    padding: 0 !important;

    color: #93aab6 !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-weight: 400 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;
    text-align: center !important;
}

/* ---- Tablet --------------------------------------------------------- */

@media (max-width: 991.98px) {
    footer.ftco-footer.ftco-bg-dark.ftco-section {
        padding-top: 48px !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child {
        gap: 34px 30px !important;
        padding-bottom: 35px !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md {
        flex: 1 1 calc(50% - 20px) !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:first-child,
    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:last-child {
        flex: 1 1 calc(50% - 20px) !important;
    }
}

/* ---- Mobile --------------------------------------------------------- */

@media (max-width: 767.98px) {
    footer.ftco-footer.ftco-bg-dark.ftco-section {
        padding-top: 42px !important;
    }

    footer.ftco-footer.ftco-bg-dark.ftco-section > .container {
        width: calc(100% - 28px) !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child {
        display: block !important;
        padding-bottom: 30px !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md {
        width: 100% !important;
        margin-bottom: 30px !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:last-child {
        margin-bottom: 0 !important;
    }

    footer.ftco-footer
    > .container
    > .row:first-child
    > .col-md:last-child
    ul {
        columns: 1 !important;
    }

    footer.ftco-footer h2.logo > a {
        padding: 12px 15px !important;
    }

    footer.ftco-footer h2.logo img {
        max-width: 205px !important;
        max-height: 82px !important;
    }

    footer.ftco-footer .ftco-heading-2 {
        margin-bottom: 15px !important;
    }

    footer.ftco-footer
    > .container
    > .row:last-child {
        padding: 17px 0 19px !important;
    }
}

/* ===== CQ-PREMIUM-PUBLIC-FOOTER-7 END ===== */

/* ===== CQ-DROPDOWN-FOOTER-LOGO-FIX-7B START =====
   Public questionnaire only.
   Fixes dropdown pointer gap and removes footer logo double-card effect.
   No Blade, routes, authentication or footer-link logic changed.
======================================================================= */

/* ---- Header dropdown stability ------------------------------------- */

#ftco-navbar .nav-item.dropdown {
    position: relative !important;
}

/*
   Reduce the visual gap introduced by Header 6B.
   The pseudo-element below creates a pointer-safe bridge.
*/
#ftco-navbar .dropdown-menu {
    top: calc(100% + 3px) !important;
    margin-top: 0 !important;

    visibility: visible;
    pointer-events: auto !important;
}

/* Invisible bridge between account button and menu. */
#ftco-navbar .dropdown-menu::before {
    content: "" !important;
    position: absolute !important;

    top: -12px !important;
    right: 0 !important;
    left: 0 !important;

    display: block !important;
    width: 100% !important;
    height: 12px !important;

    background: transparent !important;
    pointer-events: auto !important;
}

/* Keep menu available during click, hover and keyboard focus. */
#ftco-navbar .nav-item.dropdown.show > .dropdown-menu,
#ftco-navbar .nav-item.dropdown:hover > .dropdown-menu,
#ftco-navbar .nav-item.dropdown:focus-within > .dropdown-menu,
#ftco-navbar .dropdown-menu.show {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Make the complete menu and its links safely clickable. */
#ftco-navbar .dropdown-menu,
#ftco-navbar .dropdown-menu .dropdown-item {
    pointer-events: auto !important;
}

#ftco-navbar .dropdown-item {
    position: relative !important;
    z-index: 2 !important;
}

/* ---- Footer logo: one clean surface only ---------------------------- */

/*
   The logo image already contains a white canvas.
   Remove the second white card from its parent anchor.
*/
footer.ftco-footer h2.logo > a {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;

    box-shadow: none !important;
    overflow: visible !important;
}

/* Use the image itself as the single premium logo panel. */
footer.ftco-footer h2.logo img {
    display: block !important;

    width: auto !important;
    max-width: 220px !important;
    height: auto !important;
    max-height: 96px !important;

    margin: 0 !important;
    padding: 11px 14px !important;

    background: #ffffff !important;
    border: 1px solid rgba(211, 229, 237, 0.95) !important;
    border-radius: 14px !important;

    box-shadow:
        0 14px 30px rgba(3, 16, 26, 0.2),
        inset 0 1px 0 #ffffff !important;

    object-fit: contain !important;
}

@media (max-width: 767.98px) {
    #ftco-navbar .dropdown-menu {
        top: auto !important;
        margin-top: 4px !important;
    }

    #ftco-navbar .dropdown-menu::before {
        top: -8px !important;
        height: 8px !important;
    }

    footer.ftco-footer h2.logo img {
        max-width: 205px !important;
        max-height: 88px !important;
        padding: 10px 12px !important;
    }
}

/* ===== CQ-DROPDOWN-FOOTER-LOGO-FIX-7B END ===== */

/* ===== LG-CLIENT-PROFILE-PREMIUM-8A START =====
   Legalgen Profile page only.
   Every rule is scoped through #userdetailForm or :has(#userdetailForm).
   No Blade, form values, field IDs, AJAX, Google Places or Dropzone logic changed.
======================================================================= */

/* ---- Profile workspace --------------------------------------------- */

body:has(#userdetailForm) {
    background:
        radial-gradient(
            700px 360px at 8% 0%,
            rgba(7, 136, 168, 0.08),
            transparent 68%
        ),
        linear-gradient(
            180deg,
            #f5fafc 0%,
            #edf4f8 100%
        ) !important;

    color: #182b3d !important;
    font-family: "Inter", Arial, sans-serif !important;
}

body:has(#userdetailForm)
section.container:has(#userdetailForm) {
    width: calc(100% - 32px) !important;
    max-width: 1280px !important;

    margin: 32px auto 0 !important;
    padding: 0 0 52px !important;
}

body:has(#userdetailForm)
section.container:has(#userdetailForm)
> .row {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

body:has(#userdetailForm)
section.container:has(#userdetailForm)
> .row
> .col-md-12 {
    padding-right: 0 !important;
    padding-left: 0 !important;
}

/* ---- Main profile card --------------------------------------------- */

#userdetailForm {
    width: 100% !important;
    margin: 0 !important;

    color: #1d3144 !important;
    font-family: "Inter", Arial, sans-serif !important;
}

#userdetailForm > .card {
    overflow: visible !important;

    margin: 0 !important;

    background: rgba(255, 255, 255, 0.98) !important;
    border: 1px solid #d9e5ec !important;
    border-radius: 18px !important;

    box-shadow:
        0 18px 46px rgba(25, 57, 77, 0.09),
        inset 0 1px 0 #ffffff !important;
}

#userdetailForm > .card > .card-body {
    padding: 34px 36px 38px !important;
}

/* ---- Main title ----------------------------------------------------- */

#userdetailForm h2.font-Merriweather {
    position: relative !important;

    margin: 0 0 28px !important;
    padding: 0 0 15px 17px !important;

    color: #142d41 !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: clamp(24px, 2.2vw, 31px) !important;
    font-weight: 750 !important;
    line-height: 1.25 !important;
    letter-spacing: -0.035em !important;
    text-transform: none !important;
}

#userdetailForm h2.font-Merriweather::before {
    content: "" !important;
    position: absolute !important;

    top: 2px !important;
    bottom: 17px !important;
    left: 0 !important;

    width: 4px !important;

    background: linear-gradient(
        180deg,
        #0788a8 0%,
        #38b8cf 100%
    ) !important;

    border-radius: 999px !important;
}

#userdetailForm h2.font-Merriweather::after {
    content: "" !important;
    position: absolute !important;

    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    height: 1px !important;

    background: linear-gradient(
        90deg,
        #d6e5ec 0%,
        rgba(214, 229, 236, 0) 100%
    ) !important;
}

/* ---- Section headings ---------------------------------------------- */

#userdetailForm .attorney-box {
    margin: 8px 0 18px !important;
    padding-right: 8px !important;
    padding-left: 8px !important;
}

#userdetailForm .attorney-box h4 {
    display: flex !important;
    align-items: center !important;

    min-height: 46px !important;
    margin: 0 !important;
    padding: 11px 15px !important;

    color: #17364b !important;
    background:
        linear-gradient(
            135deg,
            #f4fafc 0%,
            #eaf5f8 100%
        ) !important;

    border: 1px solid #d5e7ed !important;
    border-left: 4px solid #0788a8 !important;
    border-radius: 10px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* ---- Grid rhythm ---------------------------------------------------- */

#userdetailForm .card-body .row {
    margin-right: -8px !important;
    margin-left: -8px !important;
}

#userdetailForm .card-body .row > [class*="col-"] {
    padding-right: 8px !important;
    padding-left: 8px !important;
}

#userdetailForm .mb-3 {
    margin-bottom: 19px !important;
}

/* ---- Labels --------------------------------------------------------- */

#userdetailForm label {
    display: block !important;

    margin: 0 0 7px !important;
    padding: 0 !important;

    color: #2a3e50 !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 12.5px !important;
    font-style: normal !important;
    font-weight: 650 !important;
    line-height: 1.45 !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
}

/* ---- Inputs, selects and textareas ---------------------------------- */

#userdetailForm .form-control,
#userdetailForm input.form-control,
#userdetailForm select.form-control,
#userdetailForm textarea.form-control {
    min-height: 45px !important;
    padding: 10px 13px !important;

    color: #172b3e !important;
    background-color: #ffffff !important;

    border: 1px solid #cad9e3 !important;
    border-radius: 9px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    line-height: 1.45 !important;

    box-shadow:
        0 1px 2px rgba(24, 52, 71, 0.025) !important;

    transition:
        border-color 0.16s ease,
        box-shadow 0.16s ease,
        background-color 0.16s ease !important;
}

#userdetailForm textarea.form-control {
    min-height: 112px !important;
    resize: vertical !important;
}

#userdetailForm .form-control:hover {
    border-color: #adc2d0 !important;
}

#userdetailForm .form-control:focus {
    color: #172b3e !important;
    background: #ffffff !important;

    border-color: #0788a8 !important;
    outline: 0 !important;

    box-shadow:
        0 0 0 3px rgba(7, 136, 168, 0.12) !important;
}

#userdetailForm .form-control::placeholder {
    color: #91a1b0 !important;
    opacity: 1 !important;
}

#userdetailForm select.form-control {
    cursor: pointer !important;
}

/* ---- Input group icons --------------------------------------------- */

#userdetailForm .input-group {
    display: flex !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
}

#userdetailForm .input-group-prepend {
    display: flex !important;
    margin-right: 0 !important;
}

#userdetailForm .input-group-text {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 43px !important;
    min-width: 43px !important;
    min-height: 45px !important;
    padding: 0 10px !important;

    color: #087d99 !important;
    background: #eff7f9 !important;

    border: 1px solid #cad9e3 !important;
    border-right: 0 !important;
    border-radius: 9px 0 0 9px !important;

    font-size: 13px !important;
}

#userdetailForm
.input-group
> .input-group-prepend
+ .form-control {
    flex: 1 1 0% !important;
    min-width: 0 !important;

    border-left-color: #d9e5eb !important;
    border-radius: 0 9px 9px 0 !important;
}

#userdetailForm .input-group:focus-within .input-group-text {
    color: #ffffff !important;
    background: #0788a8 !important;
    border-color: #0788a8 !important;
}

#userdetailForm .input-group > p {
    flex: 0 0 100% !important;

    width: 100% !important;
    margin: 5px 0 0 !important;
    padding: 0 !important;
}

/* ---- Validation ----------------------------------------------------- */

#userdetailForm .form-control.is-invalid {
    border-color: #dc5968 !important;

    box-shadow:
        0 0 0 3px rgba(220, 89, 104, 0.09) !important;
}

#userdetailForm .invalid-feedback {
    display: block !important;

    margin-top: 5px !important;

    color: #c33e4f !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 11.5px !important;
    font-weight: 500 !important;
    line-height: 1.4 !important;
}

/* ---- Profile image Dropzone ---------------------------------------- */

#userdetailForm #image.dropzone {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 155px !important;
    padding: 22px !important;

    cursor: pointer !important;

    background:
        linear-gradient(
            135deg,
            #f8fbfc 0%,
            #eef7f9 100%
        ) !important;

    border: 1.5px dashed #91bdca !important;
    border-radius: 12px !important;

    transition:
        border-color 0.16s ease,
        background-color 0.16s ease,
        box-shadow 0.16s ease !important;
}

#userdetailForm #image.dropzone:hover,
#userdetailForm #image.dropzone.dz-drag-hover {
    background: #eaf6f9 !important;
    border-color: #0788a8 !important;

    box-shadow:
        0 0 0 4px rgba(7, 136, 168, 0.08) !important;
}

#userdetailForm #image.dropzone::before {
    content: "\2191" !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 40px !important;
    height: 40px !important;
    margin-right: 12px !important;

    color: #087d99 !important;
    background: #ffffff !important;

    border: 1px solid #cfe4ea !important;
    border-radius: 11px !important;

    font-size: 20px !important;
    font-weight: 700 !important;

    box-shadow:
        0 5px 14px rgba(22, 61, 81, 0.08) !important;
}

#userdetailForm #image.dropzone:empty::after,
#userdetailForm #image.dropzone > div:empty::after {
    content: "Drop a profile image here or click to browse" !important;

    color: #4e6577 !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 1.45 !important;
}

#userdetailForm #image .dz-preview {
    margin: 8px !important;
}

#userdetailForm #image .dz-image {
    overflow: hidden !important;
    border-radius: 10px !important;
}

/* ---- Google Places suggestion panel -------------------------------- */

body:has(#userdetailForm) .pac-container {
    margin-top: 5px !important;

    background: #ffffff !important;
    border: 1px solid #d5e3ea !important;
    border-radius: 10px !important;

    box-shadow:
        0 14px 34px rgba(25, 55, 74, 0.16) !important;

    font-family: "Inter", Arial, sans-serif !important;
}

body:has(#userdetailForm) .pac-item {
    padding: 9px 12px !important;

    color: #42576a !important;
    border-top-color: #edf2f5 !important;

    font-size: 12px !important;
    line-height: 1.45 !important;
}

body:has(#userdetailForm) .pac-item:hover {
    background: #eef7f9 !important;
}

/* ---- Update / Create / Cancel actions ------------------------------- */

#userdetailForm > .pb-5.pt-3 {
    display: flex !important;
    align-items: center !important;
    gap: 10px !important;

    margin: 22px 0 0 !important;
    padding: 22px 0 0 !important;

    border-top: 1px solid #dfe8ee !important;
}

#userdetailForm > .pb-5.pt-3 .btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 94px !important;
    min-height: 43px !important;
    margin: 0 !important;
    padding: 10px 18px !important;

    border-radius: 9px !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 650 !important;
    line-height: 1.3 !important;
    letter-spacing: 0 !important;

    text-decoration: none !important;

    transition:
        background-color 0.16s ease,
        border-color 0.16s ease,
        color 0.16s ease,
        box-shadow 0.16s ease,
        transform 0.16s ease !important;
}

#userdetailForm > .pb-5.pt-3 .btn-primary {
    color: #ffffff !important;

    background:
        linear-gradient(
            135deg,
            #173b50 0%,
            #087d99 100%
        ) !important;

    border: 1px solid #126079 !important;

    box-shadow:
        0 7px 17px rgba(17, 81, 105, 0.19) !important;
}

#userdetailForm > .pb-5.pt-3 .btn-primary:hover {
    color: #ffffff !important;
    background:
        linear-gradient(
            135deg,
            #123247 0%,
            #0795b5 100%
        ) !important;

    transform: translateY(-1px) !important;
}

#userdetailForm > .pb-5.pt-3 .btn-outline-dark {
    color: #42586b !important;
    background: #ffffff !important;

    border: 1px solid #bfced8 !important;
}

#userdetailForm > .pb-5.pt-3 .btn-outline-dark:hover {
    color: #16364c !important;
    background: #f0f6f8 !important;
    border-color: #9fb8c7 !important;
}

/* ---- Responsive ----------------------------------------------------- */

@media (max-width: 767.98px) {
    body:has(#userdetailForm)
    section.container:has(#userdetailForm) {
        width: calc(100% - 20px) !important;
        margin-top: 20px !important;
        padding-bottom: 34px !important;
    }

    #userdetailForm > .card {
        border-radius: 14px !important;
    }

    #userdetailForm > .card > .card-body {
        padding: 24px 18px 27px !important;
    }

    #userdetailForm h2.font-Merriweather {
        margin-bottom: 22px !important;
        font-size: 24px !important;
    }

    #userdetailForm .card-body .row {
        margin-right: -5px !important;
        margin-left: -5px !important;
    }

    #userdetailForm .card-body .row > [class*="col-"] {
        padding-right: 5px !important;
        padding-left: 5px !important;
    }

    #userdetailForm #image.dropzone {
        flex-direction: column !important;
        text-align: center !important;
    }

    #userdetailForm #image.dropzone::before {
        margin: 0 0 10px !important;
    }

    #userdetailForm > .pb-5.pt-3 {
        flex-wrap: wrap !important;
    }
}

/* ===== LG-CLIENT-PROFILE-PREMIUM-8A END ===== */

/* ===== LG-LEGALGEN-HEADER-OFFSET-GUARD-8B START =====
   Shared Legalgen client pages only.
   Reserves document space below the existing fixed public header.
   No Blade, navigation, form, route or JavaScript logic changed.
======================================================================= */

:root {
    --lg-public-fixed-header-height: 86px;
    --lg-public-anchor-offset: 104px;
}

/*
   This stylesheet is conditionally loaded only for the Legalgen
   customtheme shell. The body padding reserves space that a fixed
   header does not occupy in normal document flow.
*/
body {
    padding-top: var(--lg-public-fixed-header-height) !important;
}

/* Keep the approved header anchored consistently. */
#ftco-navbar {
    top: 0 !important;
    right: 0 !important;
    left: 0 !important;
    width: 100% !important;
}

/*
   Prevent anchor links, validation focus and browser scrolling from
   positioning content underneath the fixed header.
*/
html {
    scroll-padding-top: var(--lg-public-anchor-offset) !important;
}

body [id] {
    scroll-margin-top: var(--lg-public-anchor-offset);
}

/* Remove accidental negative positioning from main client workspaces. */
.lg-public-questionnaire-page,
.lg-client-applications-page,
body:has(#userdetailForm) section.container:has(#userdetailForm) {
    position: relative;
    z-index: 1;
}

/* Tablet/mobile header is shorter. */
@media (max-width: 991.98px) {
    :root {
        --lg-public-fixed-header-height: 74px;
        --lg-public-anchor-offset: 92px;
    }
}

/* Small mobile safety. */
@media (max-width: 575.98px) {
    :root {
        --lg-public-fixed-header-height: 72px;
        --lg-public-anchor-offset: 88px;
    }
}

/* ===== LG-LEGALGEN-HEADER-OFFSET-GUARD-8B END ===== */

/* ===== LG-UNIFIED-BOTTOM-NOTIFICATIONS-10 START =====
   Shared Legalgen public/client pages only.
   Unifies AJAX Toastr and Laravel session notifications at bottom-center.
   No controllers, AJAX responses, routes or notification calls changed.
======================================================================= */

:root {
    --lg-toast-width: 440px;
    --lg-toast-bottom: 24px;
    --lg-toast-radius: 14px;
    --lg-toast-shadow:
        0 18px 46px rgba(5, 27, 41, 0.20),
        0 4px 12px rgba(5, 27, 41, 0.10);
}

/* ---- Toastr container: force every position class to bottom-center -- */

body #toast-container,
body #toast-container.toast-top-right,
body #toast-container.toast-top-left,
body #toast-container.toast-top-center,
body #toast-container.toast-top-full-width,
body #toast-container.toast-bottom-right,
body #toast-container.toast-bottom-left,
body #toast-container.toast-bottom-center,
body #toast-container.toast-bottom-full-width {
    position: fixed !important;

    top: auto !important;
    right: auto !important;
    bottom: max(
        var(--lg-toast-bottom),
        env(safe-area-inset-bottom)
    ) !important;
    left: 50% !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 11px !important;

    width: min(
        var(--lg-toast-width),
        calc(100vw - 28px)
    ) !important;
    max-width: none !important;

    margin: 0 !important;
    padding: 0 !important;

    transform: translateX(-50%) !important;

    pointer-events: none !important;
    z-index: 12050 !important;
}

/* ---- Individual Toastr card ---------------------------------------- */

body #toast-container > .toast {
    position: relative !important;

    display: block;

    width: 100% !important;
    min-height: 64px !important;

    margin: 0 !important;
    padding: 14px 46px 14px 56px !important;

    overflow: hidden !important;

    color: #162b3d !important;
    background-color: rgba(255, 255, 255, 0.98) !important;
    background-image: none !important;

    border: 1px solid #d8e4eb !important;
    border-left: 4px solid #648092 !important;
    border-radius: var(--lg-toast-radius) !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    line-height: 1.5 !important;
    letter-spacing: 0 !important;

    opacity: 1;

    box-shadow: var(--lg-toast-shadow) !important;

    pointer-events: auto !important;

    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

/* ---- Notification icon --------------------------------------------- */

body #toast-container > .toast::before {
    content: "i" !important;

    position: absolute !important;

    top: 50% !important;
    left: 14px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;

    color: #ffffff !important;
    background: #648092 !important;

    border-radius: 50% !important;

    font-family: Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1 !important;

    transform: translateY(-50%) !important;

    box-shadow:
        0 5px 12px rgba(26, 59, 78, 0.18) !important;
}

body #toast-container > .toast-success {
    border-left-color: #18a66a !important;
}

body #toast-container > .toast-success::before {
    content: "\2713" !important;
    background: #18a66a !important;
}

body #toast-container > .toast-error {
    border-left-color: #d94e5d !important;
}

body #toast-container > .toast-error::before {
    content: "!" !important;
    background: #d94e5d !important;
}

body #toast-container > .toast-warning {
    border-left-color: #e79a16 !important;
}

body #toast-container > .toast-warning::before {
    content: "!" !important;
    background: #e79a16 !important;
}

body #toast-container > .toast-info {
    border-left-color: #0788a8 !important;
}

body #toast-container > .toast-info::before {
    content: "i" !important;
    background: #0788a8 !important;
}

/* ---- Message typography -------------------------------------------- */

body #toast-container .toast-title {
    margin: 0 0 3px !important;

    color: #142e42 !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
}

body #toast-container .toast-message {
    margin: 0 !important;
    padding: 0 !important;

    color: #40576a !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    line-height: 1.5 !important;

    overflow-wrap: anywhere !important;
}

body #toast-container .toast-message a {
    color: #087d99 !important;
    font-weight: 600 !important;
    text-decoration: underline !important;
}

/* ---- Close button --------------------------------------------------- */

body #toast-container .toast-close-button {
    position: absolute !important;

    top: 10px !important;
    right: 10px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;

    margin: 0 !important;
    padding: 0 !important;

    color: #607487 !important;
    background: #eef4f7 !important;

    border: 1px solid #dbe6ec !important;
    border-radius: 8px !important;

    font-family: Arial, sans-serif !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: 1 !important;
    text-shadow: none !important;

    opacity: 1 !important;

    transition:
        color 0.16s ease,
        background-color 0.16s ease,
        border-color 0.16s ease !important;
}

body #toast-container .toast-close-button:hover,
body #toast-container .toast-close-button:focus {
    color: #ffffff !important;
    background: #173b50 !important;
    border-color: #173b50 !important;

    opacity: 1 !important;
    outline: 0 !important;
}

/* ---- Progress indicator -------------------------------------------- */

body #toast-container .toast-progress {
    position: absolute !important;

    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;

    height: 3px !important;

    background: currentColor !important;

    border-radius: 0 999px 999px 0 !important;

    opacity: 0.34 !important;
}

body #toast-container .toast-success .toast-progress {
    color: #18a66a !important;
}

body #toast-container .toast-error .toast-progress {
    color: #d94e5d !important;
}

body #toast-container .toast-warning .toast-progress {
    color: #e79a16 !important;
}

body #toast-container .toast-info .toast-progress {
    color: #0788a8 !important;
}

/* ---- Existing Laravel session toast alignment ---------------------- */

body .lg-toast-region {
    position: fixed !important;

    top: auto !important;
    right: auto !important;
    bottom: max(
        var(--lg-toast-bottom),
        env(safe-area-inset-bottom)
    ) !important;
    left: 50% !important;

    width: min(
        var(--lg-toast-width),
        calc(100vw - 28px)
    ) !important;

    gap: 11px !important;

    transform: translateX(-50%) !important;

    z-index: 12060 !important;
}

body .lg-toast {
    min-height: 64px !important;

    padding: 14px 44px 14px 15px !important;

    border-radius: var(--lg-toast-radius) !important;

    box-shadow: var(--lg-toast-shadow) !important;
}

body .lg-toast__content {
    color: #40576a !important;

    font-family: "Inter", Arial, sans-serif !important;
    font-size: 13px !important;
    font-weight: 450 !important;
    line-height: 1.5 !important;
}

body .lg-toast__close {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: 29px !important;
    height: 29px !important;

    margin-top: -4px !important;
    margin-right: -3px !important;

    color: #607487 !important;
    background: #eef4f7 !important;

    border: 1px solid #dbe6ec !important;
    border-radius: 8px !important;

    opacity: 1 !important;
}

/* ---- Multiple simultaneous notification safety -------------------- */

body:has(#toast-container > .toast)
.lg-toast-region {
    bottom: calc(
        var(--lg-toast-bottom) + 82px
    ) !important;
}

/* ---- Mobile --------------------------------------------------------- */

@media (max-width: 575.98px) {
    :root {
        --lg-toast-bottom: 14px;
    }

    body #toast-container,
    body .lg-toast-region {
        width: calc(100vw - 20px) !important;
    }

    body #toast-container > .toast {
        min-height: 60px !important;
        padding: 13px 42px 13px 51px !important;

        border-radius: 12px !important;

        font-size: 12.5px !important;
    }

    body #toast-container > .toast::before {
        left: 12px !important;


       width: 27px !important;
        height: 27px !important;
    }

    body #toast-container .toast-message,
    body .lg-toast__content {
        font-size: 12.5px !important;
    }
}

/* ===== LG-UNIFIED-BOTTOM-NOTIFICATIONS-10 END ===== */

/* ===== LG-TOAST-CLOSE-FIX-10B START =====
   Ensures the Toastr close control stays above message content
   and always receives mouse/touch interaction.
======================================================================= */

body #toast-container > .toast {
    isolation: isolate !important;
}

body #toast-container .toast-close-button {
    position: absolute !important;
    z-index: 20 !important;

    pointer-events: auto !important;
    cursor: pointer !important;
    touch-action: manipulation !important;
    user-select: none !important;
    -webkit-user-select: none !important;
}

body #toast-container .toast-title,
body #toast-container .toast-message {
    position: relative !important;
    z-index: 1 !important;
}

body #toast-container .toast-close-button::before,
body #toast-container .toast-close-button::after {
    pointer-events: none !important;
}

/* ===== LG-TOAST-CLOSE-FIX-10B END ===== */