/* Mobile app safe areas and responsive shell. */
@media(max-width:768px){
 body{--tf-navbar-h:calc(64px + env(safe-area-inset-top,0px))}
 body .tf-navbar{box-sizing:border-box;height:var(--tf-navbar-h);padding-top:env(safe-area-inset-top,0px);padding-left:max(10px,env(safe-area-inset-left,0px));padding-right:max(10px,env(safe-area-inset-right,0px))}
 body .tf-main,body .tf-content{min-width:0;max-width:100%}
 body[data-user-type="Clint"] .tf-content,body[data-user-type="Guied"] .tf-content{padding:12px 10px calc(78px + env(safe-area-inset-bottom,0px))}
 body .tf-navbar-links .tf-nav-chat,body .tf-navbar-links .tf-nav-orders,body .tf-navbar-user{display:none!important}
 body .tf-navbar-brand-area{min-width:0;gap:4px}body .tf-brand-name{font-size:16px}body .tf-brand img{width:32px;height:32px}
 body .tf-brand small,body[data-user-type="Clint"] .tf-sidebar-toggle,body[data-user-type="Guied"] .tf-sidebar-toggle{display:none}
 body .tf-navbar-actions,body .tf-navbar-links{gap:5px;flex-shrink:0}
 body .tf-nav-logout,body .tf-nav-login{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;min-width:40px;min-height:44px;padding:5px 8px;font-size:11px}
 body .tf-navbar-links .tf-nav-language #currentLang{display:inline;font-size:10px;margin-inline-start:3px}
 body .tf-navbar-links .tf-nav-language{width:48px;min-width:48px;flex-basis:48px}
 body .tf-notif-dropdown{position:fixed;top:calc(var(--tf-navbar-h) + 8px);inset-inline:10px;width:auto;max-width:calc(100vw - 20px);max-height:65dvh;overflow:auto}
 body[data-user-type="Clint"] .tf-client-bottom-nav{grid-template-columns:repeat(4,minmax(0,1fr))}
 body[data-user-type="Guied"] .tf-guide-bottom-nav{grid-template-columns:repeat(3,minmax(0,1fr))}
 body .guide-section,body .guide-section .tf-card-body,body .guide-table-wrap,body .table-responsive{min-width:0;max-width:100%}
 body .guide-table-wrap,body .table-responsive{overflow-x:auto;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
 body .guide-summary{gap:8px}body .guide-summary span{flex:1;padding:10px;font-size:13px}
 body .tf-page-header{flex-wrap:wrap;gap:10px}body .tf-page-title{min-width:0}body .tf-page-title h1{font-size:22px;overflow-wrap:anywhere}
 body.tf-client-app .client-journey{padding:0 0 12px;min-width:0}
 body.tf-client-app .journey-service-info>div{min-width:0;overflow-wrap:anywhere}
 body.tf-client-app .journey-service-title,body.tf-client-app .journey-service h3{overflow-wrap:anywhere}
 body.tf-client-app .tf-customer-redesign .tf-customer-hero-copy{max-width:100%;min-width:0;padding-top:36px}
 body.tf-client-app .tf-customer-redesign .tf-customer-hero h1{font-size:28px;overflow-wrap:anywhere}
 body .chat-embed{height:calc(100dvh - var(--tf-navbar-h) - 86px - env(safe-area-inset-bottom,0px));min-height:250px;display:flex;flex-direction:column;min-width:0}
 body .chat-embed .wa,body .chat-embed:has(.soundbar:not([hidden])) .wa{height:auto;flex:1;min-height:0}
 body .chat-embed .soundbar{flex-shrink:0;flex-wrap:wrap;font-size:11px;padding:7px}
 body .chat-embed .side,body .chat-embed .chat,body .chat-embed .list,body .chat-embed .msgs{min-height:0}
 body .chat-embed .bar,body .chat-embed .ch,body .chat-embed .preview{flex-shrink:0}
 body .chat-embed .bar .inp{min-width:0;width:0;font-size:16px;padding:10px 8px}
 body .chat-embed .bar{gap:3px;padding:7px 5px}body .chat-embed .ibtn{padding:4px;min-width:32px;min-height:40px;font-size:19px}body .chat-embed .send{flex:0 0 40px}
 body .chat-embed .b{max-width:88%;overflow-wrap:anywhere}body .chat-embed .b img{max-width:100%;height:auto}
 body .chat-embed .preview #previewName{min-width:0;overflow-wrap:anywhere}
 body .chat-embed .call{z-index:12000}body .chat-embed .callbox{min-width:0;width:calc(100% - 24px);max-width:380px;padding:22px 14px}
}
@media(min-width:701px) and (max-width:768px){body .chat-embed .side{width:100%;max-width:100%}body .chat-embed .chat{display:none}body .chat-embed .wa.chat-open .side{display:none}body .chat-embed .wa.chat-open .chat{display:flex}body .chat-embed .chat-back{display:inline-block}}
@media(max-width:768px){body .tf-nav-logout span,body .tf-nav-login span{display:inline!important}body .tf-nav-logout{width:auto}body .guide-table-wrap:before{content:"اسحب الجدول أفقيًا لعرض بقية الأعمدة";display:block;font-size:11px;color:var(--theme-muted,#64748b);padding:8px 4px}}
/* Keep the login label inside a full-width button, including compact navbars. */
body .tf-navbar-actions > .tf-nav-login{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex:0 0 auto;width:auto;min-width:94px;height:40px;min-height:40px;padding:0 14px;margin-inline-start:10px;border:1px solid #d99a19;border-radius:10px;background:#d99a19;color:var(--theme-secondary,#101725);font-size:13px;font-weight:700;line-height:1;text-decoration:none;white-space:nowrap}
body .tf-navbar-actions > .tf-nav-login span{display:inline!important}
body .tf-navbar-actions > .tf-nav-login i{font-size:14px;flex-shrink:0}
body .tf-navbar-actions > .tf-nav-login:hover{background:#e8ac35;border-color:#e8ac35;color:var(--theme-secondary,#101725)}
body .tf-navbar-actions > .tf-nav-login:focus-visible{outline:2px solid white;outline-offset:3px}
@media(max-width:768px){body .tf-navbar-actions > .tf-nav-login{min-width:82px;padding:0 10px;margin-inline-start:6px;height:40px;min-height:40px;font-size:12px;gap:6px}}

/* لا انتقالات أثناء التحميل الأولي: يمنع ارتجاف القائمة الجانبية والمحتوى عند كل فتح صفحة */
html.tf-preinit .tf-sidebar,html.tf-preinit .tf-sidebar *,html.tf-preinit .tf-main,html.tf-preinit .tf-navbar,html.tf-preinit .tf-app-drawer{transition:none!important;animation:none!important}

/* وضع التضمين: النموذج داخل نافذة بلا شريط علوي أو قائمة جانبية أو تذييل */
html.tf-embed .tf-navbar,html.tf-embed .tf-sidebar,html.tf-embed .tf-footer,html.tf-embed .sidebar-overlay,html.tf-embed .tf-staff-bottom-nav,html.tf-embed .tf-app-drawer,html.tf-embed .tf-app-overlay,html.tf-embed #tf-webpush-banner{display:none!important}
html.tf-embed body,html.tf-embed .tf-main,html.tf-embed .tf-content{margin:0!important;padding-top:0!important;padding-inline:0!important;min-height:0!important}
html.tf-embed .tf-content{padding:10px 12px 16px!important}
/* التضمين: لا نترك عرض القائمة الجانبية محجوزًا (كان يترك فراغًا ويحصر المحتوى). */
html.tf-embed .tf-main{width:100%!important;max-width:100%!important;flex:1 1 auto!important}