
/* ==========================================================
   PADIDAR HEADER REDESIGN V4
   Compact corporate header inspired by new references
   Desktop redesign / existing mobile drawer preserved
   ========================================================== */


/* ==========================================================
   DESKTOP
   ========================================================== */

@media (min-width:801px){


    /* ------------------------------------------------------
       HEADER ROOT
       ------------------------------------------------------ */

    body.pf-site .pf-header{
        position:relative;
        z-index:1000;
        width:100%;
        background:#fff;
    }


    /* ------------------------------------------------------
       TOP BAR
       slim corporate information bar
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-topbar{
        height:38px !important;
        min-height:38px !important;

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

        display:flex !important;
        align-items:center !important;

        background:
            linear-gradient(
                110deg,
                #062943 0%,
                #07385f 100%
            ) !important;

        border:0 !important;
        border-bottom:
            1px solid rgba(255,255,255,.08) !important;
    }


    body.pf-site .pf-header .pf-topbar-inner{
        width:min(
            1320px,
            calc(100% - 48px)
        ) !important;

        height:38px !important;
        min-height:38px !important;

        margin:auto !important;

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

        gap:20px !important;
    }


    /* contact */

    body.pf-site .pf-header .pf-contact-mini{
        display:flex !important;
        align-items:center !important;

        gap:15px !important;

        flex:0 0 auto !important;

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

        white-space:nowrap !important;
    }


    body.pf-site .pf-header .pf-contact-mini a,
    body.pf-site .pf-header .pf-contact-mini span{
        color:
            rgba(255,255,255,.90) !important;

        font-size:14px !important;
        font-weight:700 !important;
        line-height:1 !important;
    }


    body.pf-site .pf-header .pf-phone{
        direction:ltr !important;
        unicode-bidi:isolate !important;

        font-weight:900 !important;
    }


    body.pf-site .pf-header .pf-wa{
        color:#4ee18a !important;
        font-weight:900 !important;
    }


    /* top actions */

    body.pf-site .pf-header .pf-top-actions{
        display:flex !important;
        align-items:center !important;

        flex:0 0 auto !important;

        gap:17px !important;
    }


    body.pf-site .pf-header .pf-login,
    body.pf-site .pf-header .pf-cart{
        width:auto !important;
        min-width:0 !important;
        min-height:0 !important;

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

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

        background:transparent !important;

        box-shadow:none !important;

        color:
            rgba(255,255,255,.92) !important;

        font-size:14px !important;
        font-weight:800 !important;
        line-height:38px !important;

        white-space:nowrap !important;

        transition:
            color .18s ease !important;
    }


    body.pf-site .pf-header .pf-login:hover,
    body.pf-site .pf-header .pf-cart:hover{
        color:#ff7180 !important;
        transform:none !important;
        filter:none !important;
    }


    /* ------------------------------------------------------
       MAIN NAVBAR
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-navbar{
        position:relative !important;

        height:74px !important;
        min-height:74px !important;

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

        background:
            rgba(255,255,255,.98) !important;

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

        box-shadow:
            0 5px 22px rgba(3,36,65,.055) !important;
    }


    body.pf-site .pf-header .pf-nav-inner{
        width:min(
            1320px,
            calc(100% - 48px)
        ) !important;

        height:74px !important;
        min-height:74px !important;

        margin:auto !important;

        display:flex !important;
        align-items:center !important;

        gap:16px !important;
    }


    /* ------------------------------------------------------
       BRAND
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-brand{
        flex:0 0 224px !important;

        width:224px !important;
        min-width:224px !important;
        max-width:224px !important;

        margin:0 !important;

        display:flex !important;
        align-items:center !important;

        gap:9px !important;

        color:#072f55 !important;
    }


    body.pf-site .pf-header .pf-brand-mark{
        width:50px !important;
        height:50px !important;

        flex:0 0 50px !important;

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

        overflow:hidden !important;
    }


    body.pf-site .pf-header .pf-brand-logo{
        width:50px !important;
        height:50px !important;

        max-width:50px !important;
        max-height:50px !important;

        object-fit:contain !important;
    }


    body.pf-site .pf-header .pf-brand-copy{
        min-width:0 !important;
    }


    body.pf-site .pf-header .pf-brand-copy strong{
        display:block !important;

        margin:0 !important;

        color:#072f55 !important;

        font-size:19px !important;
        line-height:1.35 !important;
        font-weight:900 !important;

        white-space:nowrap !important;
    }


    body.pf-site .pf-header .pf-brand-copy small{
        display:block !important;

        margin-top:1px !important;

        color:#7c8d9d !important;

        font-family:
            Arial,
            sans-serif !important;

        font-size:8.5px !important;
        line-height:1.2 !important;
        font-weight:600 !important;

        white-space:nowrap !important;
    }


    /* ------------------------------------------------------
       MAIN MENU
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-nav{
        flex:1 1 auto !important;

        min-width:0 !important;
        height:74px !important;

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

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

        gap:1px !important;
    }


    body.pf-site .pf-header .pf-nav > a{
        position:relative !important;

        height:74px !important;

        padding:
            0 10px !important;

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

        color:#173e60 !important;

        background:transparent !important;

        font-size:18px !important;
        line-height:1 !important;
        font-weight:800 !important;

        white-space:nowrap !important;

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

        transition:
            color .18s ease !important;
    }


    body.pf-site .pf-header .pf-nav > a:hover,
    body.pf-site .pf-header .pf-nav > a.is-active{
        color:#e51e35 !important;
    }


    /*
     * red underline
     */

    body.pf-site .pf-header .pf-nav > a::after{
        content:"" !important;

        display:block !important;

        position:absolute !important;

        right:11px !important;
        left:11px !important;
        bottom:9px !important;

        height:3px !important;

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

        background:#e51e35 !important;

        opacity:0 !important;
        visibility:hidden !important;

        transform:
            scaleX(.45) !important;

        transform-origin:
            center !important;

        transition:
            opacity .18s ease,
            transform .18s ease !important;

        pointer-events:none !important;
    }


    body.pf-site .pf-header .pf-nav > a:hover::after,
    body.pf-site .pf-header .pf-nav > a:focus-visible::after,
    body.pf-site .pf-header .pf-nav > a.is-active::after{
        opacity:1 !important;
        visibility:visible !important;

        transform:
            scaleX(1) !important;
    }


    /* mobile-only items */

    body.pf-site .pf-header .pf-menu-close,
    body.pf-site .pf-header .pf-mobile-nav-brand,
    body.pf-site .pf-header .pf-mobile-inquiry{
        display:none !important;
    }


    /* ------------------------------------------------------
       NAV TOOLS
       search + CTA
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-nav-tools{
        flex:0 0 auto !important;

        display:flex !important;
        align-items:center !important;

        gap:9px !important;
    }


    body.pf-site .pf-header .pf-nav-tools .pf-search{
        position:relative !important;

        width:245px !important;
        min-width:245px !important;
        height:42px !important;

        margin:0 !important;

        display:flex !important;
        align-items:center !important;

        overflow:hidden !important;

        background:#f5f8fb !important;

        border:
            1px solid #dce5ed !important;

        border-radius:9px !important;

        box-shadow:
            inset 0 1px 2px rgba(5,38,64,.025) !important;
    }


    body.pf-site .pf-header .pf-nav-tools
    .pf-search input{
        flex:1 !important;

        width:100% !important;
        height:40px !important;

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

        border:0 !important;
        outline:0 !important;

        background:transparent !important;

        box-shadow:none !important;

        color:#173e60 !important;

        font-size:16px !important;
        font-weight:600 !important;
    }


    body.pf-site .pf-header .pf-nav-tools
    .pf-search input::placeholder{
        color:#8b9aa8 !important;
        opacity:1 !important;
    }


    body.pf-site .pf-header .pf-nav-tools
    .pf-search button{
        flex:0 0 42px !important;

        width:42px !important;
        height:40px !important;

        padding:0 !important;

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

        border:0 !important;
        border-right:
            1px solid #e0e7ed !important;

        background:#fff !important;

        color:#e51e35 !important;

        font-family:
            Arial,
            sans-serif !important;

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

        cursor:pointer !important;
    }


    /* ------------------------------------------------------
       MAIN CTA
       ------------------------------------------------------ */

    body.pf-site .pf-header .pf-nav-cta{
        min-height:42px !important;

        padding:
            0 15px !important;

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

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

        background:
            #e51e35 !important;

        color:#fff !important;

        box-shadow:
            0 7px 16px rgba(229,30,53,.15) !important;

        font-size:16px !important;
        line-height:1 !important;
        font-weight:900 !important;

        white-space:nowrap !important;

        transition:
            transform .18s ease,
            box-shadow .18s ease,
            background .18s ease !important;
    }


    body.pf-site .pf-header .pf-nav-cta:hover{
        background:#cb162c !important;

        color:#fff !important;

        transform:
            translateY(-1px) !important;

        box-shadow:
            0 9px 19px rgba(229,30,53,.20) !important;
    }


    /* hamburger remains desktop-hidden */

    body.pf-site .pf-header .pf-menu-toggle{
        display:none !important;
    }

}


/* ==========================================================
   MEDIUM DESKTOP / TABLET LANDSCAPE
   ========================================================== */

@media (min-width:801px) and (max-width:1240px){

    body.pf-site .pf-header .pf-nav-tools .pf-search{
        display:none !important;
    }


    body.pf-site .pf-header .pf-brand{
        flex-basis:205px !important;

        width:205px !important;
        min-width:205px !important;
        max-width:205px !important;
    }


    body.pf-site .pf-header .pf-nav > a{
        padding:
            0 8px !important;

        font-size:17px !important;
    }

}


/* ==========================================================
   MOBILE
   Existing padidar-mobile-r3 drawer intentionally preserved.
   Only make the empty nav-tools wrapper harmless.
   ========================================================== */

@media (max-width:800px){

    body.pf-site .pf-header .pf-nav-tools{
        display:none !important;
    }

}



/* ==========================================================
   PADIDAR HEADER MENU WIDTH V5
   Desktop: use available header width and distribute nav items
   Mobile remains untouched
   ========================================================== */

@media (min-width:1241px){

    /*
     * Use almost all available desktop width.
     * Still keep a small safe margin on both sides.
     */

    body.pf-site
    .pf-header
    .pf-nav-inner{

        width:
            min(
                1720px,
                calc(100% - 32px)
            ) !important;

        max-width:none !important;

        gap:18px !important;
    }


    /*
     * Brand stays fixed and clean.
     */

    body.pf-site
    .pf-header
    .pf-brand{

        flex:
            0 0 224px !important;

        width:224px !important;
        min-width:224px !important;
        max-width:224px !important;
    }


    /*
     * The menu receives ALL remaining flexible space
     * between brand and tools.
     */

    body.pf-site
    .pf-header
    .pf-nav{

        flex:
            1 1 0 !important;

        width:auto !important;
        min-width:0 !important;
        max-width:none !important;

        display:flex !important;

        align-items:stretch !important;

        justify-content:
            stretch !important;

        gap:5px !important;
    }


    /*
     * Six main links share the available width equally.
     */

    body.pf-site
    .pf-header
    .pf-nav > a:not(.pf-mobile-inquiry){

        flex:
            1 1 0 !important;

        width:auto !important;
        min-width:0 !important;

        padding:
            0 12px !important;

        display:flex !important;

        align-items:center !important;
        justify-content:center !important;

        text-align:center !important;

        font-size:
            18px !important;

        white-space:
            nowrap !important;
    }


    /*
     * Keep underline proportional to each menu item.
     */

    body.pf-site
    .pf-header
    .pf-nav > a::after{

        right:
            20% !important;

        left:
            20% !important;

        bottom:
            8px !important;
    }


    /*
     * Tools remain compact.
     * Do not allow them to consume menu width.
     */

    body.pf-site
    .pf-header
    .pf-nav-tools{

        flex:
            0 0 auto !important;

        gap:10px !important;
    }


    body.pf-site
    .pf-header
    .pf-nav-tools
    .pf-search{

        width:
            245px !important;

        min-width:
            245px !important;
    }

}


/* ==========================================================
   DESKTOP 1241–1500
   Slightly tighter but still evenly distributed
   ========================================================== */

@media (min-width:1241px) and (max-width:1500px){

    body.pf-site
    .pf-header
    .pf-nav-inner{

        width:
            calc(100% - 28px) !important;

        gap:
            12px !important;
    }


    body.pf-site
    .pf-header
    .pf-brand{

        flex-basis:
            205px !important;

        width:
            205px !important;

        min-width:
            205px !important;

        max-width:
            205px !important;
    }


    body.pf-site
    .pf-header
    .pf-nav > a:not(.pf-mobile-inquiry){

        padding:
            0 8px !important;

        font-size:
            17px !important;
    }


    body.pf-site
    .pf-header
    .pf-nav-tools
    .pf-search{

        width:
            220px !important;

        min-width:
            220px !important;
    }

}

