/* Tawjieh shared header/drawer/mobile navigation - V91 */ :root{--navy:#07192d;--navy2:#0d2948;--gold:#b58f4b;--gold2:#d5ad66;--cream:#fff8ed;--line:#dfcfb2;--muted:#667085;--shadow:0 14px 32px rgba(7,25,45,.12)} body.tawjeeh-layout-ready{font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important} body.tawjeeh-layout-ready .topbar, body.tawjeeh-layout-ready .customer-header{font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important} .tawjeeh-layout-slot{display:contents!important}.tawjeeh-shared-hidden{display:none!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"]{background:rgba(255,250,242,.97)!important;border-bottom:1px solid rgba(181,143,75,.28)!important;position:sticky!important;top:0!important;z-index:70!important;box-shadow:0 8px 22px rgba(7,25,45,.05)!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .wrap, body.tawjeeh-layout-ready .customer-header .wrap{width:min(1180px,calc(100% - 32px))!important;margin:auto!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav{min-height:86px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:18px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand{display:flex!important;align-items:center!important;background:var(--navy)!important;border-radius:14px!important;padding:6px 10px!important;text-decoration:none!important;flex:0 0 auto!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img{width:220px!important;height:64px!important;object-fit:contain!important;display:block!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links{display:flex!important;align-items:center!important;justify-content:center!important;gap:18px!important;font-weight:600!important;margin-inline:auto!important;flex:1 1 auto!important;min-width:0!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links a, body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links button{font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;font-size:15px!important;line-height:1.3!important;color:var(--navy)!important;text-decoration:none!important;white-space:nowrap!important;border:0!important;background:transparent!important;cursor:pointer!important;padding:6px 4px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links a:hover{color:var(--gold)!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .customer-portal-link{display:none!important}.customer-portal-link.show{display:inline-flex!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .lang-toggle{display:none!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions{display:flex!important;align-items:center!important;gap:10px!important;flex:0 0 auto!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .login-nav{border:1px solid var(--line)!important;background:#fff!important;color:var(--navy)!important;border-radius:999px!important;min-height:42px!important;padding:8px 16px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;cursor:pointer!important;text-decoration:none!important;box-shadow:none!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .login-nav:hover{background:var(--cream)!important} body.tawjeeh-layout-ready .site-settings-btn, body.tawjeeh-layout-ready .customer-settings-btn{width:42px!important;height:42px!important;border:1px solid var(--line)!important;border-radius:50%!important;background:#fff!important;color:var(--navy)!important;display:inline-grid!important;place-items:center!important;cursor:pointer!important;box-shadow:0 8px 18px rgba(7,25,45,.08)!important;padding:0!important} body.tawjeeh-layout-ready .site-settings-btn svg, body.tawjeeh-layout-ready .customer-settings-btn svg{width:20px!important;height:20px!important;stroke:currentColor!important;fill:none!important;stroke-width:2!important;stroke-linecap:round!important;stroke-linejoin:round!important} body.tawjeeh-layout-ready .client-session{display:none!important;position:relative!important}.client-session.show{display:block!important} body.tawjeeh-layout-ready .client-chip{border:1px solid var(--line)!important;background:#fff!important;color:var(--navy)!important;border-radius:999px!important;min-height:42px!important;padding:8px 14px!important;display:flex!important;align-items:center!important;gap:9px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;cursor:pointer!important;max-width:260px!important} body.tawjeeh-layout-ready .client-avatar{width:28px!important;height:28px!important;border-radius:50%!important;background:var(--navy)!important;color:var(--gold)!important;display:grid!important;place-items:center!important;font-weight:700!important;overflow:hidden!important;flex:0 0 auto!important} body.tawjeeh-layout-ready .client-avatar img{width:100%!important;height:100%!important;object-fit:cover!important;display:block!important} body.tawjeeh-layout-ready .client-menu{display:none!important;position:absolute!important;top:calc(100% + 8px)!important;left:0!important;background:#fff!important;border:1px solid var(--line)!important;border-radius:14px!important;min-width:180px!important;padding:8px!important;box-shadow:var(--shadow)!important;z-index:95!important}.client-session.open .client-menu{display:grid!important;gap:6px!important} body.tawjeeh-layout-ready .client-menu button{border:0!important;background:#fff!important;color:var(--navy)!important;padding:10px 12px!important;border-radius:10px!important;text-align:right!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;cursor:pointer!important}.client-menu button:hover{background:var(--cream)!important} body.tawjeeh-layout-ready .my-requests-link{display:none!important;border:0!important;background:var(--navy)!important;color:#fff!important;border-radius:999px!important;min-height:42px!important;padding:8px 18px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-size:14px!important;font-weight:600!important;cursor:pointer!important;box-shadow:0 8px 20px rgba(7,25,45,.14)!important;white-space:nowrap!important}.my-requests-link.show{display:inline-flex!important;align-items:center!important;justify-content:center!important} body.tawjeeh-layout-ready .customer-header{background:linear-gradient(180deg,#fffaf2,#fff4e4)!important;border-bottom:1px solid var(--line)!important;position:sticky!important;top:0!important;z-index:70!important;box-shadow:0 8px 20px rgba(7,25,45,.04)!important} body.tawjeeh-layout-ready .customer-nav{min-height:82px!important;display:flex!important;align-items:center!important;justify-content:space-between!important;gap:16px!important}.portal-brand{display:flex!important;align-items:center!important;gap:12px!important;color:var(--navy)!important;font-weight:700!important;font-size:20px!important}.portal-brand-logo{height:62px!important;max-width:210px!important;object-fit:contain!important;background:var(--navy)!important;border-radius:10px!important;padding:6px 18px!important}.portal-separator{color:var(--line)!important}.customer-account{position:relative!important;display:flex!important;align-items:center!important;gap:10px!important}.customer-chip{border:1px solid var(--line)!important;background:#fff!important;border-radius:999px!important;color:var(--navy)!important;padding:8px 12px!important;min-height:44px!important;display:flex!important;align-items:center!important;gap:6px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;cursor:pointer!important}.customer-avatar{width:30px!important;height:30px!important;border-radius:50%!important;background:var(--navy)!important;color:var(--gold)!important;display:grid!important;place-items:center!important;overflow:hidden!important}.customer-avatar img{width:100%!important;height:100%!important;object-fit:cover!important}.customer-menu{display:none!important;position:absolute!important;top:calc(100% + 8px)!important;left:0!important;background:#fff!important;border:1px solid var(--line)!important;border-radius:14px!important;min-width:180px!important;padding:8px!important;box-shadow:var(--shadow)!important;z-index:95!important}.customer-menu.show{display:grid!important;gap:6px!important}.customer-menu a,.customer-menu button{border:0!important;background:#fff!important;color:var(--navy)!important;padding:10px 12px!important;border-radius:10px!important;text-align:right!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;text-decoration:none!important;cursor:pointer!important}.customer-menu a:hover,.customer-menu button:hover{background:var(--cream)!important} .customer-tabs-wrap{position:sticky!important;top:82px!important;z-index:62!important;background:#fff!important;border-bottom:1px solid var(--line)!important}.customer-tabs{display:flex!important;align-items:center!important;gap:8px!important;overflow:auto!important;padding:10px 0!important}.customer-tabs a{flex:0 0 auto!important;text-decoration:none!important;color:var(--navy)!important;background:#fff!important;border:1px solid var(--line)!important;border-radius:999px!important;padding:9px 15px!important;font-weight:600!important;font-size:14px!important}.customer-tabs a.active{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important}.customer-calculator-tab{color:#17803d!important}.customer-calculator-tab.active{color:#fff!important}.customer-home-tab{background:#fff8ed!important} .site-settings-backdrop{position:fixed!important;inset:0!important;background:rgba(7,25,45,.42)!important;z-index:800!important;display:none!important;backdrop-filter:blur(2px)!important}.site-settings-backdrop.show{display:block!important}.site-settings-drawer{position:fixed!important;top:0!important;right:0!important;bottom:0!important;width:min(390px,86vw)!important;z-index:801!important;background:linear-gradient(180deg,var(--navy),var(--navy2))!important;color:#fff!important;transform:translateX(105%)!important;transition:.24s ease!important;box-shadow:-22px 0 46px rgba(0,0,0,.25)!important;border-left:1px solid rgba(213,173,102,.45)!important;padding:28px 20px!important;display:flex!important;flex-direction:column!important;gap:14px!important;overflow:auto!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important}.site-settings-drawer.show{transform:translateX(0)!important}.drawer-close{position:absolute!important;left:14px!important;top:14px!important;width:36px!important;height:36px!important;border:1px solid rgba(255,255,255,.24)!important;border-radius:50%!important;background:rgba(255,255,255,.08)!important;color:#fff!important;font-size:24px!important;line-height:1!important;display:grid!important;place-items:center!important;cursor:pointer!important}.settings-title{font-size:24px!important;font-weight:700!important;margin-top:14px!important;color:#fff!important}.drawer-title{font-size:22px!important;font-weight:700!important;margin:16px 0 4px!important;color:#fff!important}.drawer-account-box{border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.065)!important;border-radius:18px!important;padding:14px!important;display:grid!important;gap:10px!important}.drawer-account-box b{color:#fff!important;font-size:17px!important;font-weight:700!important}.drawer-account-box p{margin:0!important;color:#c7d8ea!important;font-size:12.5px!important;line-height:1.7!important;font-weight:500!important}.drawer-login-stage{display:none!important}.drawer-login-stage.active{display:grid!important;gap:9px!important}.drawer-login-methods{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important}.drawer-login-methods button,.drawer-primary-btn,.drawer-forgot-link,.drawer-link-btn,.drawer-register-btn,.drawer-settings-toggle,.drawer-settings-link,.settings-wide-btn,.settings-options button{border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;border-radius:12px!important;padding:10px 12px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-weight:600!important;cursor:pointer!important;text-decoration:none!important;text-align:center!important}.drawer-login-methods button.active,.drawer-primary-btn{background:var(--gold)!important;border-color:var(--gold)!important;color:#fff!important}.drawer-account-box label{color:#fff!important;font-size:12px!important;font-weight:600!important}.drawer-account-box input{width:100%!important;min-height:42px!important;border:1px solid rgba(255,255,255,.18)!important;border-radius:12px!important;background:rgba(255,255,255,.95)!important;color:var(--navy)!important;padding:9px 12px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important}.drawer-password-wrap{display:grid!important;grid-template-columns:1fr 42px!important}.drawer-password-wrap input{border-radius:0 12px 12px 0!important}.drawer-password-wrap button{border:1px solid rgba(255,255,255,.18)!important;border-right:0!important;border-radius:12px 0 0 12px!important;background:#fff!important;color:var(--navy)!important}.drawer-login-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}.drawer-login-message{display:none!important;border-radius:12px!important;padding:9px!important;background:#fff4e4!important;color:#7a4c00!important;font-size:12px!important;font-weight:600!important}.drawer-login-message.show{display:block!important}.drawer-register-btn{display:block!important}.drawer-logged-box{display:none!important}.drawer-logged-box.show{display:grid!important}.drawer-logged-box a,.drawer-nav-links a{color:#fff!important;padding:12px 14px!important;border-radius:14px!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.1)!important;font-weight:600!important;text-decoration:none!important}.logout-link{background:rgba(180,35,24,.22)!important;color:#fff!important;border-color:rgba(255,255,255,.16)!important}.drawer-nav-links{display:grid!important;gap:8px!important}.drawer-settings-toggle{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:10px!important;text-align:right!important}.drawer-settings-panel{display:none!important;gap:12px!important}.drawer-settings-panel.show{display:grid!important}.settings-section{border:1px solid rgba(255,255,255,.12)!important;background:rgba(255,255,255,.065)!important;border-radius:18px!important;padding:14px!important;display:grid!important;gap:11px!important}.settings-section b{color:#fff!important;font-size:15px!important;font-weight:700!important}.settings-options{display:grid!important;grid-template-columns:repeat(3,1fr)!important;gap:8px!important}.settings-toggle{display:flex!important;align-items:center!important;gap:10px!important;color:#fff!important;font-weight:600!important}.mobile-drawer-backdrop,.mobile-side-drawer{display:none!important} .mobile-app-nav{display:none!important}.mobile-app-nav-global{display:none!important}@media(max-width:930px){body{padding-bottom:84px!important}.topbar{position:sticky!important;top:0!important}.nav{min-height:72px!important}.brand img{height:58px!important;width:170px!important;padding:5px 14px!important}.links,.nav-actions .login-nav,.site-settings-btn,.customer-settings-btn{display:none!important}.nav-actions{margin-right:auto!important}.client-session.show{display:block!important}.client-chip{min-height:38px!important;padding:6px 10px!important;font-size:12px!important}.customer-header{position:sticky!important}.customer-nav{min-height:70px!important}.portal-brand{font-size:15px!important}.portal-brand-logo{height:52px!important;max-width:150px!important;padding:4px 10px!important}.portal-separator{display:none!important}.customer-tabs-wrap{top:70px!important}.customer-tabs a{font-size:12px!important;padding:8px 12px!important}.mobile-app-nav{position:fixed!important;right:10px!important;left:10px!important;bottom:10px!important;z-index:740!important;display:grid!important;grid-template-columns:42px repeat(3,1fr)!important;gap:7px!important;background:rgba(7,25,45,.96)!important;border:1px solid rgba(213,173,102,.5)!important;border-radius:22px!important;padding:8px!important;box-shadow:0 18px 36px rgba(7,25,45,.28)!important;backdrop-filter:blur(12px)!important}.mobile-app-nav a,.mobile-app-nav button{display:grid!important;gap:3px!important;place-items:center!important;color:#fff!important;font-size:11px!important;font-weight:600!important;padding:6px 4px!important;border-radius:16px!important;border:0!important;background:transparent!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;cursor:pointer!important;text-decoration:none!important}.mobile-app-nav a:hover,.mobile-app-nav a.active,.mobile-app-nav button:hover{background:rgba(181,143,75,.2)!important}.mobile-app-nav svg{width:22px!important;height:22px!important;stroke:var(--gold)!important;fill:none!important;stroke-width:2.2!important;stroke-linecap:round!important;stroke-linejoin:round!important}.site-settings-drawer{width:min(92vw,390px)!important;padding-bottom:100px!important}.drawer-login-actions{grid-template-columns:1fr!important}.drawer-login-methods{grid-template-columns:repeat(3,1fr)!important}.mobile-drawer-backdrop{display:none!important;position:fixed!important;inset:0!important;background:rgba(7,25,45,.42)!important;z-index:790!important}.mobile-drawer-backdrop.show{display:block!important}.mobile-side-drawer{display:flex!important;position:fixed!important;top:0!important;right:0!important;bottom:0!important;width:min(330px,88vw)!important;background:linear-gradient(180deg,var(--navy),var(--navy2))!important;z-index:791!important;transform:translateX(105%)!important;transition:.24s ease!important;box-shadow:-22px 0 46px rgba(0,0,0,.25)!important;border-left:1px solid rgba(213,173,102,.45)!important;padding:28px 20px 100px!important;flex-direction:column!important;gap:10px!important;overflow:auto!important}.mobile-side-drawer.show{transform:translateX(0)!important}.mobile-side-drawer a,.mobile-side-drawer button.drawer-settings-link{color:#fff!important;padding:12px 14px!important;border-radius:14px!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.1)!important;font-weight:600!important;text-decoration:none!important;text-align:right!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important}} /* Patch V61: shared header hard-clean/unified weight */ .tawjeeh-layout-slot .topbar .links a, .tawjeeh-layout-slot .topbar .links button, .tawjeeh-layout-slot .nav-actions button, .tawjeeh-layout-slot .nav-actions a, .tawjeeh-layout-slot .customer-tabs a, .tawjeeh-layout-slot .site-settings-drawer, .tawjeeh-layout-slot .site-settings-drawer *{font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif!important;font-weight:600!important} .tawjeeh-layout-slot .brand img{display:block!important} /* Always use the same main side drawer; do not use the limited mobile drawer */ .mobile-drawer-backdrop,.mobile-side-drawer{display:none!important} /* Patch V63: match the side drawer exactly with the home page drawer */ .site-settings-drawer .drawer-nav-links, .site-settings-drawer #drawerNavLinks{display:none!important;visibility:hidden!important;height:0!important;margin:0!important;padding:0!important;overflow:hidden!important} .site-settings-drawer{width:min(390px,86vw)!important;padding:28px 20px!important;gap:14px!important} .site-settings-drawer .settings-title{font-size:24px!important;line-height:1.35!important;font-weight:700!important;margin:14px 0 4px!important;text-align:right!important} .site-settings-drawer .drawer-account-box{padding:14px!important;border-radius:18px!important;gap:10px!important} .site-settings-drawer .drawer-account-box b{font-size:17px!important;line-height:1.4!important;font-weight:700!important} .site-settings-drawer .drawer-account-box p{font-size:12.5px!important;line-height:1.7!important;font-weight:500!important} .site-settings-drawer .drawer-login-stage.active{gap:9px!important} .site-settings-drawer .drawer-login-methods{grid-template-columns:repeat(3,1fr)!important;gap:8px!important} .site-settings-drawer .drawer-login-methods button{min-height:40px!important;padding:8px 9px!important;font-size:12.5px!important;line-height:1.25!important;white-space:nowrap!important;border-radius:12px!important;font-weight:600!important} .site-settings-drawer .drawer-account-box label{font-size:12px!important;line-height:1.35!important;font-weight:600!important;margin:0!important} .site-settings-drawer .drawer-account-box input{min-height:42px!important;padding:9px 12px!important;font-size:13px!important;line-height:1.3!important;border-radius:12px!important} .site-settings-drawer .drawer-password-wrap{grid-template-columns:1fr 42px!important} .site-settings-drawer .drawer-login-actions{grid-template-columns:1fr 1fr!important;gap:8px!important} .site-settings-drawer .drawer-primary-btn, .site-settings-drawer .drawer-forgot-link, .site-settings-drawer .drawer-link-btn, .site-settings-drawer .drawer-register-btn, .site-settings-drawer .drawer-settings-toggle, .site-settings-drawer .settings-wide-btn, .site-settings-drawer .settings-options button{min-height:42px!important;padding:9px 12px!important;font-size:13px!important;line-height:1.3!important;border-radius:12px!important;font-weight:600!important} .site-settings-drawer .drawer-register-btn{display:grid!important;place-items:center!important} .site-settings-drawer .drawer-settings-toggle{grid-template-columns:auto 1fr auto!important;align-items:center!important;text-align:right!important;margin-top:0!important} .site-settings-drawer .drawer-settings-panel{gap:12px!important} .site-settings-drawer .settings-section{padding:14px!important;gap:11px!important;border-radius:18px!important} .site-settings-drawer .settings-section b{font-size:15px!important;font-weight:700!important} @media(max-width:930px){ .site-settings-drawer{width:min(390px,92vw)!important;padding:28px 20px 100px!important;gap:14px!important} .site-settings-drawer .drawer-login-actions{grid-template-columns:1fr 1fr!important} .site-settings-drawer .drawer-login-methods{grid-template-columns:repeat(3,1fr)!important} .site-settings-drawer .drawer-login-methods button{font-size:12.5px!important;white-space:nowrap!important} } /* V65 - Drawer password field alignment fix */ body.tawjeeh-layout-ready .side-drawer .drawer-password-wrap, .side-drawer .drawer-password-wrap, #siteSideDrawer .drawer-password-wrap, #tawjeehSideDrawer .drawer-password-wrap{ display:flex!important; flex-direction:row!important; direction:rtl!important; align-items:stretch!important; width:100%!important; height:42px!important; min-height:42px!important; border-radius:12px!important; overflow:hidden!important; background:rgba(255,255,255,.95)!important; box-sizing:border-box!important; gap:0!important; padding:0!important; } body.tawjeeh-layout-ready .side-drawer .drawer-password-wrap input, .side-drawer .drawer-password-wrap input, #siteSideDrawer .drawer-password-wrap input, #tawjeehSideDrawer .drawer-password-wrap input{ flex:1 1 auto!important; min-width:0!important; width:auto!important; height:42px!important; min-height:42px!important; margin:0!important; border:0!important; border-radius:0 12px 12px 0!important; background:rgba(255,255,255,.95)!important; padding:9px 12px!important; box-sizing:border-box!important; } body.tawjeeh-layout-ready .side-drawer .drawer-password-wrap button, .side-drawer .drawer-password-wrap button, #siteSideDrawer .drawer-password-wrap button, #tawjeehSideDrawer .drawer-password-wrap button{ flex:0 0 46px!important; width:46px!important; min-width:46px!important; max-width:46px!important; height:42px!important; min-height:42px!important; margin:0!important; padding:0!important; display:grid!important; place-items:center!important; border:0!important; border-right:1px solid rgba(7,25,45,.08)!important; border-radius:12px 0 0 12px!important; background:#fff!important; color:#07192d!important; line-height:1!important; box-sizing:border-box!important; overflow:hidden!important; cursor:pointer!important; } /* V65 - restore logged client state + working settings */ body.tawjeeh-client-logged-in #sideGuestLoginBox{display:none!important} body.tawjeeh-client-logged-in #drawerLoggedAccountBox{display:grid!important} body.tawjeeh-client-guest #drawerLoggedAccountBox{display:none!important} body.tawjeeh-client-guest #sideGuestLoginBox{display:grid!important} body.tawjeeh-client-logged-in #loginNavBtn, body.tawjeeh-client-logged-in #registerNavBtn{display:none!important} body.tawjeeh-client-logged-in #clientSession{display:block!important} body.tawjeeh-client-logged-in #customerPortalNavBtn, body.tawjeeh-client-logged-in #myRequestsNavBtn{display:inline-flex!important} #drawerLoggedAccountBox{gap:8px!important} #drawerLoggedAccountBox b{font-size:17px!important;font-weight:700!important;color:#fff!important} #drawerLoggedAccountBox a,#drawerLoggedAccountBox button{min-height:42px!important;padding:9px 12px!important;border-radius:12px!important;font-size:13px!important;line-height:1.3!important;font-weight:600!important;text-align:right!important;font-family:'Cairo','Segoe UI',Tahoma,Arial,sans-serif!important} #drawerLoggedAccountBox .logout-link{background:rgba(180,35,24,.22)!important;border:1px solid rgba(255,255,255,.16)!important;color:#fff!important;cursor:pointer!important} body.tawjeeh-layout-ready .site-settings-drawer .drawer-password-wrap{ display:flex!important;flex-direction:row!important;direction:rtl!important;align-items:stretch!important;width:100%!important;height:42px!important;min-height:42px!important;border-radius:12px!important;overflow:hidden!important;background:rgba(255,255,255,.95)!important;box-sizing:border-box!important;gap:0!important;padding:0!important; } body.tawjeeh-layout-ready .site-settings-drawer .drawer-password-wrap input{ flex:1 1 auto!important;min-width:0!important;width:auto!important;height:42px!important;min-height:42px!important;margin:0!important;border:0!important;border-radius:0 12px 12px 0!important;background:rgba(255,255,255,.95)!important;padding:9px 12px!important;box-sizing:border-box!important; } body.tawjeeh-layout-ready .site-settings-drawer .drawer-password-wrap button{ flex:0 0 46px!important;width:46px!important;min-width:46px!important;max-width:46px!important;height:42px!important;min-height:42px!important;margin:0!important;padding:0!important;display:grid!important;place-items:center!important;border:0!important;border-right:1px solid rgba(7,25,45,.08)!important;border-radius:12px 0 0 12px!important;background:#fff!important;color:#07192d!important;line-height:1!important;box-sizing:border-box!important;overflow:hidden!important;cursor:pointer!important; } html.tawjeeh-font-small body{zoom:.94} html.tawjeeh-font-large body{zoom:1.06} html.comfortable-reading body :is(p,li,label,input,textarea,select,button,a,span,div){line-height:1.85!important} html.comfortable-reading main{letter-spacing:.01em!important} html.reduce-motion *, body.reduce-motion *{animation:none!important;transition:none!important;scroll-behavior:auto!important} .settings-options button.active{background:var(--gold)!important;border-color:var(--gold)!important;color:#fff!important} /* V67 - header nav polish/dropdown fix */ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .customer-portal-link{display:inline-flex!important;align-items:center!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .blog-nav-link{display:inline-flex!important;align-items:center!important;gap:5px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-blog-icon{width:18px!important;height:18px!important;border-radius:50%!important;background:rgba(181,143,75,.14)!important;color:var(--gold)!important;border:1px solid rgba(181,143,75,.35)!important;display:grid!important;place-items:center!important;font-size:11px!important;line-height:1!important;flex:0 0 18px!important} body.tawjeeh-layout-ready .my-requests-link{gap:7px!important;background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important} body.tawjeeh-layout-ready .my-requests-link .my-requests-icon{width:22px!important;height:22px!important;border-radius:50%!important;background:rgba(255,255,255,.12)!important;color:#fff!important;display:grid!important;place-items:center!important;font-size:12px!important;line-height:1!important;flex:0 0 22px!important} body.tawjeeh-layout-ready .my-requests-link span:last-child{color:#fff!important} body.tawjeeh-login-page #loginNavBtn, body.tawjeeh-login-page #siteSettingsNavBtn{display:none!important} body.tawjeeh-register-page #registerNavBtn{display:none!important} /* V67 - final header fixes */ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links a, body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links button{ font-weight:600!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links a[data-active-path="contact"]:not(:last-of-type){display:inline-flex!important} body.tawjeeh-layout-ready .my-requests-link, body.tawjeeh-layout-ready #myRequestsNavBtn{ background:#07192d!important; color:#fff!important; border:1px solid #07192d!important; gap:7px!important; } body.tawjeeh-layout-ready #myRequestsNavBtn span{color:#fff!important} body.tawjeeh-layout-ready #myRequestsNavBtn .my-requests-icon{ width:22px!important;height:22px!important;border-radius:50%!important; background:rgba(255,255,255,.12)!important;color:#fff!important; display:grid!important;place-items:center!important;flex:0 0 22px!important; } body.tawjeeh-layout-ready .client-session{position:relative!important;z-index:900!important} body.tawjeeh-layout-ready .client-session.open .client-menu, body.tawjeeh-layout-ready .client-session.open > .client-menu{ display:grid!important; visibility:visible!important; opacity:1!important; pointer-events:auto!important; gap:6px!important; z-index:9999!important; } body.tawjeeh-layout-ready .client-menu{ min-width:190px!important; z-index:9999!important; } /* V68 - My Requests button polish */ body.tawjeeh-layout-ready .my-requests-link, body.tawjeeh-layout-ready #myRequestsNavBtn{ min-height:44px!important; padding:8px 22px!important; border-radius:999px!important; font-size:14px!important; font-weight:400!important; gap:9px!important; letter-spacing:0!important; line-height:1.2!important; } body.tawjeeh-layout-ready #myRequestsNavBtn span:last-child{font-weight:400!important;color:#fff!important;white-space:nowrap!important} body.tawjeeh-layout-ready #myRequestsNavBtn .my-requests-icon{ width:22px!important;height:22px!important;flex:0 0 22px!important;font-size:12px!important; } /* V70 - logout confirmation/home redirect polish + login remember layout */ body.tawjeeh-layout-ready .client-menu .client-logout-menu, body.tawjeeh-layout-ready .customer-menu .client-logout-menu, body.tawjeeh-layout-ready .client-menu button[onclick*="Logout"], body.tawjeeh-layout-ready .client-menu button[onclick*="logout"], body.tawjeeh-layout-ready .customer-menu button[onclick*="Logout"], body.tawjeeh-layout-ready .customer-menu button[onclick*="logout"]{ color:#b42318!important; background:#fff5f5!important; border:1px solid #ffd1d1!important; font-weight:600!important; } body.tawjeeh-layout-ready .client-menu .client-logout-menu:hover, body.tawjeeh-layout-ready .customer-menu .client-logout-menu:hover, body.tawjeeh-layout-ready .client-menu button[onclick*="Logout"]:hover, body.tawjeeh-layout-ready .client-menu button[onclick*="logout"]:hover, body.tawjeeh-layout-ready .customer-menu button[onclick*="Logout"]:hover, body.tawjeeh-layout-ready .customer-menu button[onclick*="logout"]:hover{ background:#ffe8e8!important; } body.tawjeeh-layout-ready .customer-home-tab{ display:inline-flex!important; align-items:center!important; gap:7px!important; background:#fff6e4!important; border-color:rgba(181,143,75,.75)!important; color:#07192d!important; font-weight:700!important; box-shadow:0 8px 18px rgba(181,143,75,.10)!important; } body.tawjeeh-layout-ready .customer-home-tab .home-tab-icon{ width:22px!important; height:22px!important; border-radius:50%!important; background:#b58f4b!important; color:#07192d!important; display:grid!important; place-items:center!important; font-size:13px!important; line-height:1!important; flex:0 0 22px!important; font-weight:700!important; } body.tawjeeh-layout-ready .customer-home-tab.active{ background:#b58f4b!important; color:#07192d!important; border-color:#b58f4b!important; } body.tawjeeh-layout-ready .customer-home-tab.active .home-tab-icon{ background:#07192d!important; color:#fff!important; } .login-card #loginForm .remember-line, .auth-card.login-card #loginForm .remember-line{ display:inline-flex!important; align-items:center!important; justify-content:flex-start!important; gap:8px!important; width:max-content!important; max-width:100%!important; margin:0 0 4px auto!important; padding:0!important; color:#07192d!important; font-size:14px!important; font-weight:500!important; line-height:1.5!important; } .login-card #loginForm .remember-line input, .auth-card.login-card #loginForm .remember-line input{ width:16px!important; height:16px!important; margin:0!important; flex:0 0 16px!important; } /* V70 - in-site logout confirmation + login remember alignment */ .tawjeeh-modal-open{overflow:hidden!important} .tawjeeh-confirm-modal{position:fixed!important;inset:0!important;z-index:99999!important;background:rgba(7,25,45,.58)!important;backdrop-filter:blur(4px)!important;display:none!important;align-items:center!important;justify-content:center!important;padding:20px!important;direction:rtl!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important} .tawjeeh-confirm-modal.show{display:flex!important} .tawjeeh-confirm-card{width:min(420px,calc(100vw - 32px))!important;background:linear-gradient(180deg,#fffaf2,#fff)!important;border:1px solid var(--line,#dfcfb2)!important;border-radius:24px!important;box-shadow:0 24px 70px rgba(7,25,45,.26)!important;padding:24px 22px 20px!important;text-align:center!important;position:relative!important;animation:tawjeehConfirmIn .18s ease-out both!important} @keyframes tawjeehConfirmIn{from{transform:translateY(12px) scale(.96);opacity:0}to{transform:translateY(0) scale(1);opacity:1}} .tawjeeh-confirm-close{position:absolute!important;top:12px!important;left:12px!important;width:36px!important;height:36px!important;border-radius:50%!important;border:1px solid rgba(223,207,178,.9)!important;background:#fff!important;color:var(--navy,#07192d)!important;font-size:22px!important;line-height:1!important;cursor:pointer!important;display:grid!important;place-items:center!important;padding:0!important;font-weight:500!important} .tawjeeh-confirm-icon{width:56px!important;height:56px!important;border-radius:18px!important;margin:0 auto 12px!important;background:var(--navy,#07192d)!important;color:var(--gold,#b58f4b)!important;display:grid!important;place-items:center!important;font-size:26px!important;box-shadow:0 10px 24px rgba(7,25,45,.18)!important} .tawjeeh-confirm-card h3{margin:0 0 8px!important;color:var(--navy,#07192d)!important;font-size:24px!important;line-height:1.4!important;font-weight:700!important} .tawjeeh-confirm-card p{margin:0 0 18px!important;color:#667085!important;font-size:15px!important;line-height:1.8!important;font-weight:500!important} .tawjeeh-confirm-actions{display:grid!important;grid-template-columns:1fr 1.25fr!important;gap:10px!important} .tawjeeh-confirm-actions button{min-height:46px!important;border-radius:14px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-size:15px!important;cursor:pointer!important;font-weight:600!important} .tawjeeh-confirm-cancel{border:1px solid var(--line,#dfcfb2)!important;background:#fff!important;color:var(--navy,#07192d)!important} .tawjeeh-confirm-ok{border:0!important;background:#c0392b!important;color:#fff!important;box-shadow:0 10px 22px rgba(192,57,43,.18)!important} body.tawjeeh-layout-ready .client-logout-menu, body.tawjeeh-layout-ready .logout-link{color:#c0392b!important;font-weight:600!important} body.tawjeeh-layout-ready.login-page .login-card .remember-line, body.tawjeeh-layout-ready.page-login .login-card .remember-line, .login-card .remember-line{display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;width:100%!important;margin:10px 0 12px!important;color:var(--navy,#07192d)!important;font-size:14px!important;line-height:1.5!important;font-weight:500!important;clear:both!important} .login-card .remember-line input{width:16px!important;height:16px!important;margin:0!important;flex:0 0 auto!important;accent-color:var(--gold,#b58f4b)!important} .login-card .remember-line span{font-weight:500!important;white-space:nowrap!important} .login-card .btn.primary[type="submit"]{margin-top:0!important} /* V71 - login page remember line final alignment */ body.page-login .auth-card.login-card #loginForm, body.login-page .auth-card.login-card #loginForm{ display:block!important; } body.page-login .auth-card.login-card #loginForm > .remember-line, body.login-page .auth-card.login-card #loginForm > .remember-line, body.page-login .login-card #loginForm > .remember-line, body.login-page .login-card #loginForm > .remember-line{ display:flex!important; width:100%!important; max-width:100%!important; align-items:center!important; justify-content:flex-start!important; gap:8px!important; margin:10px 0 10px!important; padding:0!important; clear:both!important; font-size:15px!important; line-height:1.6!important; font-weight:500!important; color:var(--navy,#07192d)!important; } body.page-login .auth-card.login-card #loginForm > .remember-line input, body.login-page .auth-card.login-card #loginForm > .remember-line input{ width:16px!important; height:16px!important; flex:0 0 16px!important; margin:0!important; accent-color:var(--gold,#b58f4b)!important; } body.page-login .auth-card.login-card #loginForm > .remember-line span, body.login-page .auth-card.login-card #loginForm > .remember-line span{ white-space:nowrap!important; font-weight:500!important; } body.page-login .auth-card.login-card #loginForm > .btn.primary[type="submit"], body.login-page .auth-card.login-card #loginForm > .btn.primary[type="submit"]{ display:flex!important; width:100%!important; align-items:center!important; justify-content:center!important; margin:0!important; clear:both!important; float:none!important; } body.page-login .auth-card.login-card #loginForm > .btn.light, body.login-page .auth-card.login-card #loginForm > .btn.light{ display:flex!important; width:100%!important; align-items:center!important; justify-content:center!important; margin:10px 0 0!important; clear:both!important; float:none!important; } @media (min-width: 720px){ body.page-login .auth-card.login-card #loginForm > .remember-line, body.login-page .auth-card.login-card #loginForm > .remember-line{ margin-top:10px!important; } } /* Branding V80 */ body.tawjeeh-layout-ready .client-avatar,body.tawjeeh-layout-ready .customer-avatar{background:#fff!important;border:1px solid var(--line)!important} body.tawjeeh-layout-ready .client-avatar img,body.tawjeeh-layout-ready .customer-avatar img{object-fit:contain!important;background:#fff!important} /* Branding V80 - logo sits directly on beige background, no card/highlight */ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] a.brand, .tawjeeh-layout-slot header.topbar[data-shared-layout="header"] .brand{ background:transparent!important; border:0!important; border-radius:0!important; padding:0!important; box-shadow:none!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, .tawjeeh-layout-slot header.topbar[data-shared-layout="header"] .brand img{ width:auto!important; height:70px!important; max-width:none!important; max-height:70px!important; object-fit:contain!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; } body.tawjeeh-layout-ready .portal-brand-logo, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{ width:auto!important; background:transparent!important; border:0!important; border-radius:0!important; padding:0!important; box-shadow:none!important; height:70px!important; max-width:none!important; object-fit:contain!important; } body.tawjeeh-layout-ready .footer-logo{ background:transparent!important; border:0!important; box-shadow:none!important; } @media(max-width:930px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, .tawjeeh-layout-slot header.topbar[data-shared-layout="header"] .brand img{ width:auto!important; height:58px!important; max-width:none!important; max-height:58px!important; padding:0!important; } body.tawjeeh-layout-ready .portal-brand-logo, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{ width:auto!important; height:56px!important; max-width:none!important; padding:0!important; } } /* V80 - Mobile header: clean app-style header with menu + logo + auth/client only */ body.tawjeeh-layout-ready .header-menu-btn{ display:none!important; width:42px!important;height:42px!important;min-width:42px!important; border:1px solid var(--line)!important;border-radius:14px!important; background:#fff!important;color:var(--navy)!important; align-items:center!important;justify-content:center!important; padding:0!important;cursor:pointer!important;box-shadow:0 8px 18px rgba(7,25,45,.08)!important; } body.tawjeeh-layout-ready .header-menu-btn svg{width:23px!important;height:23px!important;stroke:currentColor!important;fill:none!important;stroke-width:2.4!important;stroke-linecap:round!important;stroke-linejoin:round!important} @media(max-width:930px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .wrap.nav, body.tawjeeh-layout-ready .customer-header .wrap.customer-nav{ width:calc(100% - 22px)!important; min-height:68px!important; height:68px!important; display:flex!important; flex-direction:row!important; direction:rtl!important; align-items:center!important; justify-content:flex-start!important; gap:8px!important; padding:0!important; margin:auto!important; overflow:visible!important; } body.tawjeeh-layout-ready .header-menu-btn{display:inline-flex!important;order:0!important;flex:0 0 42px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready .customer-header .portal-brand{ order:1!important;flex:0 0 auto!important;margin:0!important;background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important;gap:0!important;text-decoration:none!important;color:var(--navy)!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{ width:148px!important;max-width:148px!important;height:48px!important;max-height:48px!important;object-fit:contain!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important;padding:0!important;margin:0!important;display:block!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links{display:none!important;visibility:hidden!important;width:0!important;height:0!important;overflow:hidden!important} body.tawjeeh-layout-ready .customer-tabs-wrap{display:none!important;visibility:hidden!important;height:0!important;overflow:hidden!important} body.tawjeeh-layout-ready .customer-header .portal-separator, body.tawjeeh-layout-ready .customer-header .portal-brand > span:not(.portal-separator){display:none!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions, body.tawjeeh-layout-ready .customer-header .customer-account{ order:2!important;margin-inline-start:auto!important;margin-inline-end:0!important;display:flex!important;align-items:center!important;gap:6px!important;flex:0 1 auto!important;min-width:0!important;direction:rtl!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions .login-nav{ display:inline-flex!important;align-items:center!important;justify-content:center!important; min-height:34px!important;height:34px!important;padding:6px 10px!important;border-radius:999px!important; font-size:11.5px!important;line-height:1!important;font-weight:600!important;white-space:nowrap!important; background:#fff!important;color:var(--navy)!important;border:1px solid var(--line)!important;box-shadow:none!important; } body.tawjeeh-layout-ready.tawjeeh-client-logged-in header.topbar[data-shared-layout="header"] .nav-actions .login-nav{display:none!important} body.tawjeeh-layout-ready.tawjeeh-login-page header.topbar[data-shared-layout="header"] #loginNavBtn, body.tawjeeh-layout-ready.tawjeeh-login-page header.topbar[data-shared-layout="header"] #siteSettingsNavBtn{display:none!important} body.tawjeeh-layout-ready.tawjeeh-register-page header.topbar[data-shared-layout="header"] #registerNavBtn{display:none!important} body.tawjeeh-layout-ready .site-settings-btn, body.tawjeeh-layout-ready .customer-settings-btn{display:none!important} body.tawjeeh-layout-ready .client-session.show{display:block!important;max-width:158px!important;min-width:0!important} body.tawjeeh-layout-ready .client-chip, body.tawjeeh-layout-ready .customer-chip{ min-height:36px!important;height:36px!important;padding:5px 8px!important;border-radius:999px!important;font-size:11.5px!important;font-weight:600!important;gap:6px!important;max-width:158px!important;min-width:0!important;background:#fff!important;border:1px solid var(--line)!important;color:var(--navy)!important; } body.tawjeeh-layout-ready .client-avatar, body.tawjeeh-layout-ready .customer-avatar{width:26px!important;height:26px!important;min-width:26px!important} body.tawjeeh-layout-ready #clientNameTop, body.tawjeeh-layout-ready #customerChipName{display:block!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:88px!important;font-weight:600!important} body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{left:0!important;right:auto!important;top:calc(100% + 7px)!important;min-width:176px!important;z-index:999!important} body.tawjeeh-layout-ready .client-menu .client-logout-menu, body.tawjeeh-layout-ready .customer-menu .client-logout-menu{color:#b42318!important;font-weight:700!important} } @media(max-width:380px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{width:124px!important;max-width:124px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions .login-nav{font-size:10.5px!important;padding:5px 8px!important} body.tawjeeh-layout-ready .client-chip, body.tawjeeh-layout-ready .customer-chip{max-width:138px!important} } /* V81 - mobile header/logo clickable area + menu button + bottom menu icon only */ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] a.brand, .tawjeeh-layout-slot header.topbar[data-shared-layout="header"] .brand{ display:inline-flex!important; align-items:center!important; justify-content:center!important; width:fit-content!important; max-width:fit-content!important; min-width:0!important; height:auto!important; line-height:0!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; overflow:visible!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, .tawjeeh-layout-slot header.topbar[data-shared-layout="header"] .brand img{ display:block!important; flex:0 0 auto!important; width:auto!important; height:70px!important; max-width:none!important; max-height:70px!important; object-fit:contain!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; } body.tawjeeh-layout-ready .customer-header .portal-brand{ display:inline-flex!important; width:fit-content!important; max-width:fit-content!important; min-width:0!important; height:auto!important; line-height:0!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; box-shadow:none!important; } body.tawjeeh-layout-ready .mobile-app-nav .mobile-menu-button span{display:none!important} body.tawjeeh-layout-ready .mobile-app-nav .mobile-menu-button{gap:0!important;min-width:42px!important;width:42px!important;padding:6px!important} @media(max-width:930px){ body.tawjeeh-layout-ready .header-menu-btn{display:inline-flex!important;order:0!important;flex:0 0 40px!important;width:40px!important;height:40px!important;min-width:40px!important;border-radius:13px!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready .customer-header .portal-brand{order:1!important;flex:0 0 auto!important;width:fit-content!important;max-width:fit-content!important;line-height:0!important;overflow:visible!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{ width:auto!important; max-width:none!important; height:46px!important; max-height:46px!important; object-fit:contain!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; box-shadow:none!important; display:block!important; } body.tawjeeh-layout-ready .mobile-app-nav{grid-template-columns:42px repeat(3,1fr)!important} } @media(max-width:380px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready .customer-header .portal-brand-logo{width:auto!important;max-width:none!important;height:42px!important;max-height:42px!important} } /* V83 - desktop header order: settings far-left, client/auth beside it, requests beside client */ @media(min-width:931px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions, body.tawjeeh-layout-ready .customer-header .customer-account{ display:flex!important; align-items:center!important; gap:10px!important; direction:rtl!important; flex:0 0 auto!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions #myRequestsNavBtn, body.tawjeeh-layout-ready .customer-header .customer-account #myRequestsNavBtn{order:1!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions #loginNavBtn{order:2!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions #registerNavBtn{order:3!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions #clientSession, body.tawjeeh-layout-ready .customer-header .customer-account #customerChip{order:4!important} body.tawjeeh-layout-ready .customer-header .customer-account #customerMenu{order:5!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .nav-actions #siteSettingsNavBtn, body.tawjeeh-layout-ready .customer-header .customer-account .customer-settings-btn{order:6!important} body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .links #myRequestsNavBtn{display:none!important} } @media(max-width:930px){ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] #myRequestsNavBtn, body.tawjeeh-layout-ready .customer-header #myRequestsNavBtn{display:none!important} } /* V86 - homepage-only My Requests in desktop/header + logo always links home */ body.tawjeeh-layout-ready:not(.tawjeeh-home-page) #myRequestsNavBtn, body.tawjeeh-layout-ready .customer-header #myRequestsNavBtn{ display:none!important; visibility:hidden!important; } body.tawjeeh-layout-ready.tawjeeh-home-page #myRequestsNavBtn.show{ display:inline-flex!important; visibility:visible!important; } body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready .customer-header .portal-brand{cursor:pointer!important;} /* V87 - mobile customer menu, dashboard stats and customer tabs */ html,body{overflow-x:hidden!important} @media(max-width:930px){ body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ position:fixed!important; top:76px!important; left:12px!important; right:auto!important; width:172px!important; min-width:172px!important; max-width:calc(100vw - 24px)!important; z-index:1200!important; transform:none!important; box-sizing:border-box!important; } body.tawjeeh-layout-ready .customer-menu.show, body.tawjeeh-layout-ready .client-session.open .client-menu{display:grid!important;gap:6px!important} body.tawjeeh-layout-ready .dash-quick{ display:grid!important; grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:10px!important; width:100%!important; align-items:stretch!important; } body.tawjeeh-layout-ready .dash-quick .stat{ min-width:0!important; min-height:96px!important; padding:14px 12px!important; border-radius:18px!important; } body.tawjeeh-layout-ready .dash-quick .stat span{font-size:12px!important;line-height:1.35!important} body.tawjeeh-layout-ready .dash-quick .stat b{font-size:24px!important;line-height:1.2!important} body.tawjeeh-layout-ready .customer-tabs-wrap{ display:block!important; visibility:visible!important; height:auto!important; overflow:hidden!important; position:sticky!important; top:68px!important; z-index:640!important; background:rgba(251,248,242,.98)!important; border-bottom:1px solid rgba(181,143,75,.22)!important; box-shadow:0 10px 22px rgba(7,25,45,.06)!important; } body.tawjeeh-layout-ready .customer-tabs-wrap .customer-tabs{ display:flex!important; flex-direction:row!important; flex-wrap:nowrap!important; gap:8px!important; overflow-x:auto!important; overflow-y:hidden!important; -webkit-overflow-scrolling:touch!important; scroll-snap-type:x proximity!important; padding:9px 34px!important; width:100%!important; max-width:100%!important; scrollbar-width:none!important; } body.tawjeeh-layout-ready .customer-tabs-wrap .customer-tabs::-webkit-scrollbar{display:none!important} body.tawjeeh-layout-ready .customer-tabs a{ flex:0 0 auto!important; white-space:nowrap!important; min-height:34px!important; height:34px!important; padding:7px 13px!important; border-radius:999px!important; border:1px solid rgba(181,143,75,.35)!important; background:#fff!important; color:var(--navy)!important; font-size:12px!important; font-weight:600!important; text-decoration:none!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; scroll-snap-align:start!important; } body.tawjeeh-layout-ready .customer-tabs a.active, body.tawjeeh-layout-ready .customer-tabs a:hover{background:var(--navy)!important;color:#fff!important;border-color:var(--navy)!important} body.tawjeeh-layout-ready .customer-tabs-wrap:before, body.tawjeeh-layout-ready .customer-tabs-wrap:after{ content:""!important; position:absolute!important; top:0!important; bottom:0!important; width:34px!important; z-index:2!important; pointer-events:none!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:before{right:0!important;background:linear-gradient(90deg,rgba(251,248,242,0),rgba(251,248,242,.98))!important} body.tawjeeh-layout-ready .customer-tabs-wrap:after{left:0!important;background:linear-gradient(270deg,rgba(251,248,242,0),rgba(251,248,242,.98))!important} } @media(max-width:370px){ body.tawjeeh-layout-ready .dash-quick{gap:8px!important} body.tawjeeh-layout-ready .dash-quick .stat{padding:12px 9px!important;min-height:88px!important} body.tawjeeh-layout-ready .dash-quick .stat b{font-size:21px!important} } /* V88 - Mobile portal final cleanup */ @media(max-width:930px){ html,body{overflow-x:hidden!important;max-width:100%!important;} body.tawjeeh-layout-ready{padding-bottom:0!important;} /* Client dropdown must stay inside the viewport */ body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ position:fixed!important; top:74px!important; left:12px!important; right:auto!important; width:min(188px,calc(100vw - 24px))!important; min-width:0!important; max-width:calc(100vw - 24px)!important; transform:none!important; box-sizing:border-box!important; overflow:hidden!important; } /* Dashboard stats centered */ body.tawjeeh-layout-ready .dash-quick .stat{ display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; text-align:center!important; gap:8px!important; } body.tawjeeh-layout-ready .dash-quick .stat span, body.tawjeeh-layout-ready .dash-quick .stat b{ display:block!important; width:100%!important; text-align:center!important; margin:0!important; } /* Customer secondary tabs: clean swipe bar + visible arrow hints */ body.tawjeeh-layout-ready .customer-tabs-wrap{ display:block!important; overflow:hidden!important; isolation:isolate!important; } body.tawjeeh-layout-ready .customer-tabs-wrap .customer-tabs{ padding:9px 32px!important; position:relative!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:before, body.tawjeeh-layout-ready .customer-tabs-wrap:after{ position:absolute!important; top:50%!important; bottom:auto!important; width:24px!important; height:30px!important; transform:translateY(-50%)!important; display:grid!important; place-items:center!important; color:#b58f4b!important; background:rgba(251,248,242,.92)!important; font-size:22px!important; font-weight:800!important; line-height:1!important; z-index:3!important; pointer-events:none!important; border:0!important; border-radius:0!important; box-shadow:none!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:before{content:'›'!important;right:3px!important;left:auto!important;} body.tawjeeh-layout-ready .customer-tabs-wrap:after{content:'‹'!important;left:3px!important;right:auto!important;} body.tawjeeh-layout-ready .customer-home-tab .home-tab-icon{ overflow:hidden!important; position:relative!important; z-index:0!important; } } /* V89 - mobile dropdown above tabs + centered request stats */ @media(max-width:930px){ body.tawjeeh-layout-ready header.topbar, body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready .customer-header{ z-index:5000!important; overflow:visible!important; } body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ position:fixed!important; top:70px!important; left:12px!important; right:auto!important; width:min(190px,calc(100vw - 24px))!important; min-width:0!important; max-width:calc(100vw - 24px)!important; z-index:999999!important; overflow:visible!important; transform:none!important; } body.tawjeeh-layout-ready .customer-menu.show, body.tawjeeh-layout-ready .client-session.open .client-menu{ display:grid!important; gap:6px!important; } body.tawjeeh-layout-ready .customer-tabs-wrap{ z-index:900!important; overflow:hidden!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:before, body.tawjeeh-layout-ready .customer-tabs-wrap:after{ top:50%!important; bottom:auto!important; width:22px!important; height:30px!important; transform:translateY(-50%)!important; display:grid!important; place-items:center!important; background:transparent!important; color:#b58f4b!important; font-size:24px!important; font-weight:700!important; line-height:1!important; border:0!important; border-radius:0!important; box-shadow:none!important; z-index:5!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:before{ content:'›'!important; right:4px!important; left:auto!important; } body.tawjeeh-layout-ready .customer-tabs-wrap:after{ content:'‹'!important; left:4px!important; right:auto!important; } body.tawjeeh-layout-ready .customer-home-tab .home-tab-icon{ position:static!important; overflow:hidden!important; transform:none!important; z-index:auto!important; } body.tawjeeh-layout-ready .orders-stats{ grid-template-columns:repeat(2,minmax(0,1fr))!important; gap:9px!important; } body.tawjeeh-layout-ready .orders-stat{ min-height:92px!important; padding:12px 10px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; text-align:center!important; gap:7px!important; } body.tawjeeh-layout-ready .orders-stat:before{display:none!important} body.tawjeeh-layout-ready .orders-stat span, body.tawjeeh-layout-ready .orders-stat b{ display:block!important; width:100%!important; text-align:center!important; margin:0!important; } body.tawjeeh-layout-ready .orders-stat span{font-size:11.5px!important;line-height:1.35!important} body.tawjeeh-layout-ready .orders-stat b{font-size:24px!important;line-height:1.15!important} } /* V91 - mobile-only drawer structure */ body.tawjeeh-layout-ready .mobile-login-toggle, body.tawjeeh-layout-ready .drawer-mobile-main-links{display:none!important} @media(max-width:930px){ body.tawjeeh-layout-ready .site-settings-drawer{gap:10px!important} body.tawjeeh-layout-ready .mobile-login-toggle{display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:10px!important;width:100%!important;min-height:46px!important;border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.08)!important;color:#fff!important;border-radius:14px!important;padding:10px 12px!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;font-size:14px!important;font-weight:700!important;text-align:right!important;cursor:pointer!important} body.tawjeeh-layout-ready.tawjeeh-client-logged-in .mobile-login-toggle{display:none!important} body.tawjeeh-layout-ready.tawjeeh-client-guest #sideGuestLoginBox.mobile-login-panel:not(.open){display:none!important} body.tawjeeh-layout-ready.tawjeeh-client-guest #sideGuestLoginBox.mobile-login-panel.open{display:grid!important} body.tawjeeh-layout-ready.tawjeeh-client-logged-in #sideGuestLoginBox.mobile-login-panel{display:none!important} body.tawjeeh-layout-ready .drawer-mobile-main-links{display:grid!important;gap:8px!important;border-top:1px solid rgba(255,255,255,.12)!important;margin-top:4px!important;padding-top:10px!important} body.tawjeeh-layout-ready .drawer-mobile-main-links a{display:flex!important;align-items:center!important;justify-content:flex-start!important;color:#fff!important;padding:12px 14px!important;border-radius:14px!important;background:rgba(255,255,255,.07)!important;border:1px solid rgba(255,255,255,.1)!important;font-weight:600!important;text-decoration:none!important;text-align:right!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important;min-height:42px!important} body.tawjeeh-layout-ready .drawer-mobile-main-links a:hover{background:rgba(181,143,75,.18)!important} body.tawjeeh-layout-ready #drawerLoggedAccountBox{margin-bottom:2px!important} body.tawjeeh-layout-ready .drawer-settings-toggle{margin-top:0!important} } /* V91 - final drawer layer, compact icon links, sticky portal headers */ body.tawjeeh-layout-ready .site-settings-backdrop{ z-index:2147483200!important; } body.tawjeeh-layout-ready .site-settings-drawer{ z-index:2147483201!important; top:0!important; } body.tawjeeh-layout-ready .drawer-close{ z-index:2147483202!important; } /* Keep the main header and customer subheader fixed while scrolling */ body.tawjeeh-layout-ready header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready .customer-header{ position:sticky!important; top:0!important; z-index:900!important; } body.tawjeeh-layout-ready .customer-tabs-wrap{ position:sticky!important; top:82px!important; z-index:880!important; } @media(max-width:930px){ body.tawjeeh-layout-ready .customer-tabs-wrap{ top:68px!important; z-index:880!important; } } /* Compact drawer links with icons: desktop + mobile */ body.tawjeeh-layout-ready .drawer-icon-link, body.tawjeeh-layout-ready .drawer-logged-box a.drawer-icon-link, body.tawjeeh-layout-ready .drawer-logged-box button.drawer-icon-link, body.tawjeeh-layout-ready .drawer-mobile-main-links a.drawer-icon-link, body.tawjeeh-layout-ready .drawer-register-btn.drawer-icon-link{ display:grid!important; grid-template-columns:24px 1fr!important; align-items:center!important; justify-items:stretch!important; gap:8px!important; min-height:38px!important; padding:8px 10px!important; border-radius:12px!important; line-height:1.25!important; text-align:right!important; } body.tawjeeh-layout-ready .drawer-link-icon{ width:24px!important; height:24px!important; min-width:24px!important; border-radius:9px!important; display:grid!important; place-items:center!important; color:var(--gold)!important; background:rgba(255,255,255,.075)!important; font-size:14px!important; line-height:1!important; } body.tawjeeh-layout-ready .drawer-icon-link span:last-child{ min-width:0!important; white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important; } body.tawjeeh-layout-ready .drawer-logged-box a, body.tawjeeh-layout-ready .drawer-mobile-main-links a, body.tawjeeh-layout-ready .drawer-register-btn, body.tawjeeh-layout-ready .drawer-settings-toggle{ min-height:38px!important; padding-top:8px!important; padding-bottom:8px!important; } body.tawjeeh-layout-ready .drawer-account-box{ padding:12px!important; gap:8px!important; } body.tawjeeh-layout-ready .drawer-mobile-main-links{ gap:7px!important; } body.tawjeeh-layout-ready .drawer-settings-toggle{ border-radius:12px!important; } /* Make sure opened drawer always appears above fixed headers/subheaders on mobile */ @media(max-width:930px){ body.tawjeeh-layout-ready .site-settings-backdrop.show{ z-index:2147483200!important; } body.tawjeeh-layout-ready .site-settings-drawer.show{ z-index:2147483201!important; transform:translateX(0)!important; } } /* V92 - fixed header slot, clean floating compatibility, and centered customer statistics */ body.tawjeeh-layout-ready #tawjeehSharedTop{ position:sticky!important; top:0!important; z-index:100000!important; isolation:isolate!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header{ position:relative!important; top:auto!important; z-index:2!important; } body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{ position:relative!important; top:auto!important; z-index:1!important; } body.tawjeeh-layout-ready .site-settings-backdrop{z-index:2147483200!important} body.tawjeeh-layout-ready .site-settings-drawer{z-index:2147483201!important} html{scroll-padding-top:130px!important} @media(max-width:930px){html{scroll-padding-top:116px!important}} /* Customer dashboard + orders counters centered inside cards */ body.tawjeeh-layout-ready .dash-quick .stat, body.tawjeeh-layout-ready .orders-stats .orders-stat{ display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; text-align:center!important; gap:8px!important; } body.tawjeeh-layout-ready .dash-quick .stat span, body.tawjeeh-layout-ready .dash-quick .stat b, body.tawjeeh-layout-ready .orders-stats .orders-stat span, body.tawjeeh-layout-ready .orders-stats .orders-stat b{ display:block!important; width:100%!important; margin:0!important; text-align:center!important; } @media(max-width:520px){ body.tawjeeh-layout-ready .orders-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important} body.tawjeeh-layout-ready .dash-quick{grid-template-columns:repeat(2,minmax(0,1fr))!important} } /* V93 FINAL: sticky headers, top dropdown, centered counters */ body.tawjeeh-layout-ready #tawjeehSharedTop{ position:sticky!important; top:0!important; z-index:2147482500!important; isolation:isolate!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{ position:relative!important; top:auto!important; z-index:auto!important; overflow:visible!important; } body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{ overflow-x:hidden!important; overflow-y:visible!important; } body.tawjeeh-layout-ready .client-session, body.tawjeeh-layout-ready .customer-account{ position:relative!important; z-index:2147483200!important; overflow:visible!important; } body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ z-index:2147483300!important; isolation:isolate!important; box-shadow:0 18px 42px rgba(7,25,45,.18)!important; } @media(max-width:930px){ body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ position:fixed!important; top:74px!important; left:12px!important; right:auto!important; width:min(188px,calc(100vw - 24px))!important; z-index:2147483300!important; } } body.tawjeeh-layout-ready .dash-quick, body.tawjeeh-layout-ready .orders-stats{ align-items:stretch!important; } body.tawjeeh-layout-ready .dash-quick .stat, body.tawjeeh-layout-ready .orders-stats .orders-stat{ min-height:96px!important; display:flex!important; flex-direction:column!important; align-items:center!important; justify-content:center!important; text-align:center!important; gap:7px!important; padding:12px 10px!important; } body.tawjeeh-layout-ready .dash-quick .stat span, body.tawjeeh-layout-ready .dash-quick .stat b, body.tawjeeh-layout-ready .orders-stats .orders-stat span, body.tawjeeh-layout-ready .orders-stats .orders-stat b{ display:block!important; width:100%!important; margin:0!important; text-align:center!important; line-height:1.35!important; } body.tawjeeh-layout-ready .dash-quick .stat b, body.tawjeeh-layout-ready .orders-stats .orders-stat b{ font-size:24px!important; } @media(max-width:520px){ body.tawjeeh-layout-ready .dash-quick, body.tawjeeh-layout-ready .orders-stats{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important} body.tawjeeh-layout-ready .dash-quick .stat, body.tawjeeh-layout-ready .orders-stats .orders-stat{min-height:88px!important} } html{scroll-padding-top:130px!important} @media(max-width:930px){html{scroll-padding-top:118px!important}} /* V95 - Final fix: real sticky shared header + front-of-all account menus */ body.tawjeeh-layout-ready #tawjeehSharedTop.tawjeeh-layout-slot{ display:block!important; position:sticky!important; top:0!important; z-index:2147482500!important; isolation:isolate!important; overflow:visible!important; contain:none!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header{ position:relative!important; top:auto!important; z-index:30!important; overflow:visible!important; } body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{ position:relative!important; top:auto!important; z-index:10!important; } body.tawjeeh-layout-ready .client-session, body.tawjeeh-layout-ready .customer-account{ position:relative!important; z-index:2147483200!important; overflow:visible!important; } body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ z-index:2147483400!important; overflow:visible!important; transform:none!important; will-change:top,left!important; } body.tawjeeh-layout-ready .customer-menu.show, body.tawjeeh-layout-ready .client-session.open .client-menu{ display:grid!important; gap:6px!important; } html{scroll-padding-top:132px!important} @media(max-width:930px){html{scroll-padding-top:118px!important}} /* V95 - hard fixed shared header: main site + customer portal */ html{scroll-padding-top:var(--tawjeeh-fixed-header-height,132px)!important} body.tawjeeh-layout-ready{ padding-top:var(--tawjeeh-fixed-header-height,86px)!important; } body.tawjeeh-layout-ready.tawjeeh-customer-page{ padding-top:var(--tawjeeh-fixed-header-height,132px)!important; } body.tawjeeh-layout-ready #tawjeehSharedTop, body.tawjeeh-layout-ready #tawjeehSharedTop.tawjeeh-layout-slot{ display:block!important; position:fixed!important; top:0!important; left:0!important; right:0!important; width:100%!important; z-index:2147482500!important; overflow:visible!important; isolation:isolate!important; contain:none!important; transform:translateZ(0)!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{ position:relative!important; top:auto!important; left:auto!important; right:auto!important; width:100%!important; z-index:auto!important; overflow:visible!important; } body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header{z-index:30!important} body.tawjeeh-layout-ready #tawjeehSharedTop .customer-tabs-wrap{z-index:20!important} body.tawjeeh-layout-ready .client-menu, body.tawjeeh-layout-ready .customer-menu{ z-index:2147483400!important; } body.tawjeeh-layout-ready .site-settings-backdrop{z-index:2147483500!important} body.tawjeeh-layout-ready .site-settings-drawer{z-index:2147483501!important} @media(max-width:930px){ body.tawjeeh-layout-ready{padding-top:var(--tawjeeh-fixed-header-height,72px)!important} body.tawjeeh-layout-ready.tawjeeh-customer-page{padding-top:var(--tawjeeh-fixed-header-height,118px)!important} } /* V98 - unify all shared headers with the homepage header + prevent logo alt/broken flash */ body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header{ background:rgba(255,250,242,.96)!important; -webkit-backdrop-filter:blur(14px)!important; backdrop-filter:blur(14px)!important; border-bottom:1px solid rgba(181,143,75,.28)!important; box-shadow:0 8px 22px rgba(7,25,45,.05)!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .wrap.nav, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .wrap.customer-nav{ min-height:86px!important; height:86px!important; display:flex!important; align-items:center!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .brand, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .portal-brand{ background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; padding:0!important; margin:0!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .portal-brand-logo{ width:auto!important; max-width:none!important; height:70px!important; max-height:70px!important; object-fit:contain!important; display:block!important; padding:0!important; margin:0!important; background:transparent!important; border:0!important; border-radius:0!important; box-shadow:none!important; color:transparent!important; font-size:0!important; line-height:0!important; } body.tawjeeh-layout-ready #tawjeehSharedTop img:not([src]), body.tawjeeh-layout-ready #tawjeehSharedTop img[src=""], body.tawjeeh-layout-ready #tawjeehSharedFooter img:not([src]), body.tawjeeh-layout-ready #tawjeehSharedFooter img[src=""]{ visibility:hidden!important; color:transparent!important; font-size:0!important; } body.tawjeeh-layout-ready #tawjeehSharedTop img, body.tawjeeh-layout-ready #tawjeehSharedFooter img{ color:transparent!important; text-indent:-9999px!important; } @media(max-width:930px){ body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"], body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header{ background:rgba(255,250,242,.96)!important; -webkit-backdrop-filter:blur(14px)!important; backdrop-filter:blur(14px)!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .wrap.nav, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .wrap.customer-nav{ min-height:68px!important; height:68px!important; } body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .portal-brand-logo{ width:auto!important; max-width:none!important; height:46px!important; max-height:46px!important; } } @media(max-width:380px){ body.tawjeeh-layout-ready #tawjeehSharedTop header.topbar[data-shared-layout="header"] .brand img, body.tawjeeh-layout-ready #tawjeehSharedTop .customer-header .portal-brand-logo{ width:auto!important; max-width:none!important; height:42px!important; max-height:42px!important; } } /* V101 - compact remember checkbox inside mobile side drawer */ body.tawjeeh-layout-ready .site-settings-drawer .drawer-account-box label.drawer-remember-line, body.tawjeeh-layout-ready .site-settings-drawer label.remember-line.drawer-remember-line, .site-settings-drawer .drawer-account-box label.drawer-remember-line, .site-settings-drawer label.remember-line.drawer-remember-line{ display:inline-flex!important; align-items:center!important; justify-content:flex-start!important; gap:6px!important; width:auto!important; max-width:max-content!important; min-height:0!important; margin:0 0 8px!important; padding:0!important; line-height:1.2!important; cursor:pointer!important; color:#fff!important; } body.tawjeeh-layout-ready .site-settings-drawer .drawer-account-box label.drawer-remember-line input[type="checkbox"], body.tawjeeh-layout-ready .site-settings-drawer label.remember-line.drawer-remember-line input[type="checkbox"], .site-settings-drawer .drawer-account-box label.drawer-remember-line input[type="checkbox"], .site-settings-drawer label.remember-line.drawer-remember-line input[type="checkbox"]{ appearance:auto!important; -webkit-appearance:checkbox!important; width:16px!important; height:16px!important; min-width:16px!important; max-width:16px!important; min-height:16px!important; max-height:16px!important; flex:0 0 16px!important; margin:0!important; padding:0!important; border-radius:4px!important; background:#fff!important; box-sizing:border-box!important; accent-color:var(--gold,#b58f4b)!important; } body.tawjeeh-layout-ready .site-settings-drawer .drawer-account-box label.drawer-remember-line span, body.tawjeeh-layout-ready .site-settings-drawer label.remember-line.drawer-remember-line span, .site-settings-drawer .drawer-account-box label.drawer-remember-line span, .site-settings-drawer label.remember-line.drawer-remember-line span{ display:inline!important; font-size:12.5px!important; line-height:1.2!important; white-space:nowrap!important; font-weight:600!important; } /* V111 - Drawer onboarding password setup */ .site-settings-drawer .drawer-password-rules{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:7px!important;margin:6px 0 2px!important} .site-settings-drawer .drawer-password-rules div{display:flex!important;align-items:center!important;gap:6px!important;border:1px solid rgba(255,255,255,.16)!important;background:rgba(255,255,255,.08)!important;color:#dce6f2!important;border-radius:10px!important;padding:7px 8px!important;font-size:11.5px!important;font-weight:700!important} .site-settings-drawer .drawer-password-rules span{width:18px!important;height:18px!important;border-radius:50%!important;display:inline-grid!important;place-items:center!important;background:#fff1f0!important;color:#b42318!important;font-weight:900!important;flex:0 0 auto!important} .site-settings-drawer .drawer-password-rules div.valid{background:rgba(232,247,239,.13)!important;border-color:rgba(167,223,189,.55)!important;color:#dff7e8!important} .site-settings-drawer .drawer-password-rules div.valid span{background:#dff7e8!important;color:#067647!important} .site-settings-drawer .drawer-login-actions{grid-template-columns:1fr!important} @media(min-width:420px){.site-settings-drawer .drawer-login-actions{grid-template-columns:1fr 1fr!important}.site-settings-drawer .drawer-login-actions .drawer-link-btn{grid-column:1/-1!important}} /* V114 - Customer in-site notifications */ body.tawjeeh-layout-ready .customer-notifications-wrap, body .customer-notifications-wrap{ position:relative!important; display:inline-flex!important; align-items:center!important; justify-content:center!important; order:5!important; z-index:120!important; } body:not(.tawjeeh-client-logged-in) .customer-notifications-wrap{display:none!important} body.tawjeeh-layout-ready header.topbar .nav-actions #clientSession, body.tawjeeh-layout-ready .customer-account #customerChip{order:4!important} body.tawjeeh-layout-ready header.topbar .nav-actions #siteSettingsNavBtn, body.tawjeeh-layout-ready .customer-account .customer-settings-btn{order:7!important} body.tawjeeh-layout-ready .customer-account #customerMenu{order:8!important} .customer-notifications-btn{ width:44px!important;height:44px!important;border:1px solid rgba(195,145,61,.45)!important; border-radius:14px!important;background:#fff!important;color:#07192d!important;display:inline-flex!important; align-items:center!important;justify-content:center!important;position:relative!important;cursor:pointer!important; box-shadow:0 8px 20px rgba(7,25,45,.07)!important;transition:.2s ease!important;font:inherit!important; } .customer-notifications-btn:hover,.customer-notifications-btn.is-open{background:#07192d!important;color:#fff!important;transform:translateY(-1px)!important} .customer-notifications-ico{font-size:20px!important;line-height:1!important;filter:grayscale(.05)} .customer-notifications-count{position:absolute!important;top:-6px!important;left:-6px!important;min-width:19px!important;height:19px!important;padding:0 5px!important;border-radius:999px!important;background:#c3913d!important;color:#fff!important;font-size:11px!important;font-weight:900!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:2px solid #fff!important;box-sizing:border-box!important} .customer-notifications-count[hidden]{display:none!important} .customer-notifications-panel{position:fixed!important;top:calc(var(--tawjeeh-fixed-header-height, 78px) + 10px)!important;left:18px!important;width:min(380px,calc(100vw - 28px))!important;max-height:68vh!important;background:rgba(255,253,248,.98)!important;border:1px solid rgba(195,145,61,.35)!important;border-radius:22px!important;box-shadow:0 24px 55px rgba(7,25,45,.16)!important;z-index:2147483600!important;display:none!important;overflow:hidden!important;backdrop-filter:blur(16px)!important;direction:rtl!important;color:#07192d!important} .customer-notifications-panel.show{display:grid!important;grid-template-rows:auto minmax(0,1fr)!important} .customer-notifications-head{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;padding:14px 16px!important;border-bottom:1px solid rgba(195,145,61,.22)!important;background:linear-gradient(135deg,#fff,#fff8ec)!important} .customer-notifications-head strong{font-size:15px!important;font-weight:900!important} .customer-notifications-head button{border:0!important;background:transparent!important;color:#c3913d!important;font-weight:900!important;font-size:12px!important;cursor:pointer!important;padding:6px 0!important} .customer-notifications-list{padding:10px!important;overflow:auto!important;display:grid!important;gap:9px!important} .customer-notifications-empty{padding:20px 12px!important;text-align:center!important;color:#6b7280!important;font-weight:800!important;border:1px dashed rgba(195,145,61,.28)!important;border-radius:16px!important;background:#fff!important} .customer-notifications-item{border:1px solid rgba(195,145,61,.22)!important;border-radius:17px!important;background:#fff!important;padding:11px 12px!important;display:grid!important;gap:5px!important;cursor:pointer!important;transition:.18s ease!important;position:relative!important;overflow:hidden!important} .customer-notifications-item:hover{transform:translateY(-1px)!important;border-color:rgba(195,145,61,.55)!important;box-shadow:0 12px 28px rgba(7,25,45,.08)!important} .customer-notifications-item.unread{background:linear-gradient(135deg,#fff,#fff7e8)!important;border-color:rgba(195,145,61,.55)!important} .customer-notifications-item.unread::before{content:'';position:absolute;right:0;top:0;bottom:0;width:4px;background:#c3913d} .customer-notifications-title{font-weight:950!important;font-size:13px!important;color:#07192d!important;display:flex!important;align-items:center!important;gap:7px!important} .customer-notifications-title span{font-size:16px!important} .customer-notifications-message{font-size:12.5px!important;line-height:1.75!important;color:#334155!important;font-weight:700!important} .customer-notifications-meta{font-size:11.5px!important;color:#64748b!important;font-weight:800!important;display:flex!important;justify-content:space-between!important;gap:10px!important} @media(max-width:930px){ body .customer-notifications-wrap{order:5!important} .customer-notifications-btn{width:40px!important;height:40px!important;border-radius:13px!important} .customer-notifications-ico{font-size:18px!important} .customer-notifications-panel{top:74px!important;left:10px!important;right:10px!important;width:auto!important;max-height:70vh!important;border-radius:20px!important} } /* Patch V18: side drawer OTP boxes + compact login actions */ .site-settings-drawer .drawer-login-stage{gap:8px!important} .site-settings-drawer .drawer-login-stage p{font-size:11.5px!important;line-height:1.55!important;margin:0!important;font-weight:500!important;color:rgba(255,255,255,.78)!important} .site-settings-drawer .tawjeeh-otp-boxes{display:flex!important;direction:ltr!important;gap:6px!important;justify-content:center!important;align-items:center!important;margin:6px 0 8px!important;flex-wrap:nowrap!important} .site-settings-drawer .tawjeeh-otp-digit{width:38px!important;height:42px!important;border-radius:12px!important;border:1px solid rgba(213,173,102,.55)!important;background:#fff!important;color:#07192d!important;text-align:center!important;font-size:17px!important;font-weight:900!important;box-shadow:0 8px 18px rgba(7,25,45,.08)!important;padding:0!important;font-family:"Cairo","Segoe UI",Tahoma,Arial,sans-serif!important} .site-settings-drawer .tawjeeh-otp-digit:focus{outline:none!important;border-color:#c89a47!important;box-shadow:0 0 0 3px rgba(200,154,71,.22)!important} .site-settings-drawer .tawjeeh-otp-source{position:absolute!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important;overflow:hidden!important;min-height:1px!important;padding:0!important;margin:0!important;border:0!important} .site-settings-drawer #drawerLoginOtpStage .drawer-primary-btn, .site-settings-drawer #drawerOnboardingOtpStage .drawer-primary-btn{background:var(--gold)!important;color:#fff!important;border-color:transparent!important} .site-settings-drawer #drawerLoginOtpStage, .site-settings-drawer #drawerOnboardingOtpStage{display:none!important} .site-settings-drawer #drawerLoginOtpStage.active, .site-settings-drawer #drawerOnboardingOtpStage.active{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important} .site-settings-drawer #drawerLoginOtpStage>label, .site-settings-drawer #drawerLoginOtpStage>.tawjeeh-otp-boxes, .site-settings-drawer #drawerLoginOtpStage>.drawer-login-message, .site-settings-drawer #drawerOnboardingOtpStage>p, .site-settings-drawer #drawerOnboardingOtpStage>label, .site-settings-drawer #drawerOnboardingOtpStage>.tawjeeh-otp-boxes, .site-settings-drawer #drawerOnboardingOtpStage>.drawer-login-message{grid-column:1/-1!important} .site-settings-drawer #drawerLoginOtpStage .drawer-primary-btn, .site-settings-drawer #drawerOnboardingOtpStage .drawer-primary-btn{grid-column:1/-1!important} .site-settings-drawer #drawerLoginOtpStage .drawer-link-btn, .site-settings-drawer #drawerOnboardingOtpStage .drawer-link-btn{min-height:38px!important;font-size:12px!important;padding:8px 9px!important} @media(max-width:420px){.site-settings-drawer .tawjeeh-otp-digit{width:34px!important;height:39px!important;font-size:16px!important}.site-settings-drawer #drawerLoginOtpStage.active,.site-settings-drawer #drawerOnboardingOtpStage.active{grid-template-columns:1fr!important}} /* Patch V19: side drawer OTP edit button full width */ .site-settings-drawer #drawerLoginOtpStage.active > button:last-of-type{grid-column:1/-1!important;width:100%!important;justify-self:stretch!important} .site-settings-drawer #drawerOnboardingOtpStage.active > button:last-of-type{grid-column:1/-1!important;width:100%!important;justify-self:stretch!important} /* V29 customer notifications stable stack */ body .customer-notifications-panel{display:none!important;grid-template-rows:auto minmax(0,1fr)!important;max-height:min(72vh,620px)!important;overflow:hidden!important} body .customer-notifications-panel.show{display:grid!important} body .customer-notifications-list{display:grid!important;grid-template-columns:1fr!important;gap:10px!important;align-content:start!important;max-height:calc(min(72vh,620px) - 62px)!important;overflow-y:auto!important;padding:12px!important;scrollbar-gutter:stable!important} body .customer-notifications-item{display:grid!important;grid-template-columns:1fr!important;gap:6px!important;min-height:auto!important;height:auto!important;line-height:1.65!important;white-space:normal!important;overflow:visible!important;padding:12px 14px!important} body .customer-notifications-title,body .customer-notifications-message,body .customer-notifications-meta{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;min-width:0!important} body .customer-notifications-title{align-items:flex-start!important;line-height:1.55!important} @media(max-width:760px){body .customer-notifications-panel{top:74px!important;left:10px!important;right:10px!important;width:auto!important;max-height:70vh!important}body .customer-notifications-list{max-height:calc(70vh - 62px)!important}} /* V130 - Mobile Jouri must never render inside footer/body flow */ @media(max-width:930px){ body:not(.tawjeeh-floating-ready) .jouri-ai-root, body:not(.tawjeeh-floating-ready) .tawjieh-float-stack{display:none!important;visibility:hidden!important;opacity:0!important;pointer-events:none!important} body .jouri-ai-root{position:fixed!important;left:14px!important;right:auto!important;top:auto!important;bottom:calc(150px + env(safe-area-inset-bottom))!important;width:46px!important;height:46px!important;min-width:46px!important;min-height:46px!important;max-width:46px!important;max-height:46px!important;z-index:2147483000!important;margin:0!important;padding:0!important;overflow:visible!important;float:none!important;clear:none!important;transform:none!important} body .tawjieh-float-stack{position:fixed!important;left:14px!important;right:auto!important;top:auto!important;bottom:calc(96px + env(safe-area-inset-bottom))!important;width:46px!important;z-index:2147483000!important;overflow:visible!important} body .tawjieh-float-stack>.jouri-ai-root{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;flex:0 0 auto!important} body .jouri-ai-toggle,body .jouri-ai-toggle img{width:100%!important;height:100%!important;max-width:100%!important;max-height:100%!important;display:block!important;object-fit:cover!important;float:none!important;clear:none!important} }