/* TravBizz CRM responsive overrides
   Existing CRM CSS files are intentionally untouched. All responsive fixes live here. */

@media (max-width: 1280px){
  .tb-dash-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important;}
  .tb-dash-wide,.tb-span-3,.tb-span-4{grid-column:span 6!important;}
  .query-title-line h2{max-width:420px!important;}
  .query-stagebar{padding-left:18px!important;padding-right:18px!important;}
  .query-stagebar-line{left:30px!important;right:30px!important;}
  .itinerary-builder-layout,.itinerary-view-layout,.itinerary-cost-layout{grid-template-columns:minmax(0,1fr)!important;}
}

@media (max-width: 1100px){
  .content-toolbar,.client-toolbar,.settings-user-toolbar,.tb-website-list-toolbar,.query-toolbar,.itinerary-toolbar,.payments-toolbar,.marketing-toolbar,.reports-toolbar{gap:10px!important;}
  .left-tools,.right-tools,.settings-user-actions,.query-toolbar .left-tools,.query-toolbar .right-tools,.client-toolbar .left-tools,.client-toolbar .right-tools{flex-wrap:wrap!important;}
  .settings-layout{display:flex!important;min-width:0!important;}
  .client-detail-layout,.query-detail-page .query-detail-layout,.query-bigin-body,.activity-detail-layout{grid-template-columns:1fr!important;}
  .client-detail-sidebar,.query-bigin-left,.activity-detail-side{border-right:0!important;border-bottom:1px solid #dfe7ef!important;max-height:310px!important;overflow:auto!important;}
  .query-bigin-main,.client-detail-main{min-height:560px!important;}
  .query-stagebar{overflow-x:auto!important;overflow-y:hidden!important;}
  .query-stagebar-list{min-width:820px!important;}
  .query-stagebar-line{min-width:760px!important;right:auto!important;width:760px!important;}
  .drawer-grid-2,.drawer-grid-3,.drawer-grid-4,.query-grid-2,.query-pax-row,.quote-grid-2,.quote-grid-3,.quote-grid-4,.quote-tax-row,.quote-total-grid,.query-quotation-summary,.query-billing-summary,.query-live-total,.bigin-supplier-values,.bigin-invoice-values,.tb-website-form-grid,.tb-website-option-grid,.mtm-form-grid,.automation-form-grid,.automation-condition-row,.automation-action-row,.google-sheet-form-grid,.gs-summary-grid,.da-storage-split,.tb-wa-settings-grid,.tb-wa-status-grid{grid-template-columns:1fr!important;}
  .quote-item-card .quote-grid-3,.quote-item-card .quote-grid-4{grid-template-columns:1fr!important;}
  .quote-field,.activity-detail-grid,.organization-row,.email-field-row{grid-template-columns:1fr!important;display:grid!important;}
  .quote-field label,.activity-detail-grid b,.organization-row label,.email-field-row label{text-align:left!important;padding:0 0 6px!important;width:100%!important;min-width:0!important;}
  .table-wrap,.client-table-wrap,.settings-table-wrap,.tb-website-pages-table-wrap,.stage-table-card,.detail-table-wrap,.report-table-wrap,.payment-table-wrap,.itinerary-list-body-wrap,.query-table-wrap,.bigin-table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
  .crm-table,.client-table,.settings-table,.detail-table,.tb-website-pages-table,.itinerary-table,.payments-table,.report-table,.marketing-table,.stage-table-head,.stage-row{min-width:920px!important;}
}

@media (max-width: 991px){
  html,body{max-width:100%!important;}
  .crm-header{gap:8px!important;padding:0 10px!important;min-width:0!important;}
  .crm-brand{width:auto!important;min-width:48px!important;max-width:76px!important;flex:0 0 auto!important;}
  .crm-brand .brand-name{font-size:14px!important;max-width:72px!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;}
  .header-right{gap:7px!important;min-width:0!important;}
  .crm-search{display:none!important;}
  .plan-text{display:none!important;}
  .tb-live-head-btn{height:30px!important;min-width:30px!important;width:30px!important;padding:0!important;border-radius:50%!important;justify-content:center!important;}
  .tb-live-head-btn span{display:none!important;}
  .top-icon,.top-add{width:30px!important;height:30px!important;min-width:30px!important;}
  .profile-badge{width:30px!important;height:30px!important;min-width:30px!important;}
  .tb-attendance-pill{height:30px!important;padding:0 8px!important;}
  .tb-attendance-pill span{font-size:11px!important;}

  .crm-layout{height:calc(100dvh - 47px)!important;max-height:none!important;min-height:0!important;overflow:hidden!important;}
  .content-area{height:calc(100dvh - 47px)!important;overflow:auto!important;-webkit-overflow-scrolling:touch!important;min-width:0!important;}
  .main-menu{width:58px!important;flex:0 0 58px!important;overflow-y:auto!important;overflow-x:hidden!important;}
  .main-menu-item{width:58px!important;min-height:58px!important;height:58px!important;font-size:10px!important;}
  .main-menu-item i{font-size:16px!important;}
  .sub-menu{display:none!important;}

  .settings-left,.tb-website-left{width:184px!important;flex-basis:184px!important;min-width:184px!important;}
  .settings-left-link{font-size:13px!important;padding:0 8px!important;}
  .settings-tabs,.settings-email-tabs,.client-detail-tabs,.query-bigin-tabs,.activity-detail-tabs,.organization-tabs,.tb-wa-tabs{overflow-x:auto!important;white-space:nowrap!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;}
  .settings-tabs::-webkit-scrollbar,.settings-email-tabs::-webkit-scrollbar,.client-detail-tabs::-webkit-scrollbar,.query-bigin-tabs::-webkit-scrollbar,.activity-detail-tabs::-webkit-scrollbar,.organization-tabs::-webkit-scrollbar,.tb-wa-tabs::-webkit-scrollbar{display:none!important;}
  .settings-user-toolbar,.client-toolbar,.content-toolbar,.query-tab-head,.bigin-quote-head,.bigin-billing-head,.bigin-invoice-head,.bigin-document-head,.stage-page-head,.tb-dash-head,.tb-website-list-head{height:auto!important;min-height:56px!important;align-items:flex-start!important;flex-direction:column!important;padding:12px 14px!important;}
  .right-tools,.left-tools,.settings-user-actions,.stage-main-actions,.bigin-quote-actions,.query-quotation-actions{width:100%!important;justify-content:flex-start!important;}
  .client-search,.query-search,.settings-search,.tb-website-search,.itinerary-top-search input{width:100%!important;max-width:100%!important;}

  .tb-dash-head{gap:12px!important;}
  .tb-dash-filter{width:100%!important;justify-content:flex-start!important;}
  .tb-dash-filter select,.tb-dash-filter input,.tb-dash-custom-dates input{width:100%!important;max-width:100%!important;}
  .tb-dash-custom-dates{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;}
  .tb-dash-custom-dates button{grid-column:1 / -1!important;}
  .tb-dash-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .tb-dash-grid{grid-template-columns:1fr!important;}
  .tb-span-3,.tb-span-4,.tb-span-12,.tb-dash-wide{grid-column:1 / -1!important;}
  .tb-dash-donut-wrap{grid-template-columns:1fr!important;text-align:center!important;}
  .tb-dash-donut{margin:0 auto!important;}

  .right-drawer,.tb-web-page-drawer{width:min(100vw,760px)!important;max-width:100vw!important;}
  .right-drawer-header{padding:0 18px!important;}
  .drawer-form,.client-drawer-form,.mtm-popup-form,.query-drawer-form{padding-left:18px!important;padding-right:18px!important;}
  .drawer-field-row{display:block!important;margin-bottom:16px!important;}
  .drawer-field-row label{width:100%!important;min-width:0!important;text-align:left!important;padding:0 0 7px!important;white-space:normal!important;}
  .drawer-input-icon{width:100%!important;}
  .drawer-footer{margin-left:-18px!important;margin-right:-18px!important;padding-left:18px!important;padding-right:18px!important;}
}

@media (max-width: 767px){
  html,body{height:100%!important;overflow:hidden!important;}
  body{font-size:13px!important;}
  .crm-header{height:50px!important;position:relative!important;z-index:100!important;}
  .crm-brand .brand-name{max-width:58px!important;}
  .header-right{gap:5px!important;margin-left:auto!important;}
  .tb-live-head-btn{display:none!important;}
  .tb-attendance-wrap{display:none!important;}
  .top-icon[href],.header-right>a .top-icon{display:none!important;}

  .crm-layout{display:block!important;height:calc(100dvh - 50px)!important;overflow:hidden!important;background:#f4f8fb!important;}
  .content-area{height:calc(100dvh - 50px)!important;max-height:calc(100dvh - 50px)!important;overflow:auto!important;padding-bottom:76px!important;background:#f4f8fb!important;}
  .main-menu{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;height:66px!important;min-height:66px!important;flex:0 0 66px!important;z-index:1000!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:0!important;overflow-x:auto!important;overflow-y:hidden!important;background:#fff!important;border-right:0!important;border-top:1px solid #dfe7ef!important;box-shadow:0 -8px 24px rgba(15,23,42,.10)!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;padding:0 6px!important;}
  .main-menu::-webkit-scrollbar{display:none!important;}
  .main-menu-item{width:72px!important;min-width:72px!important;height:58px!important;min-height:58px!important;border-radius:14px!important;margin:0 2px!important;font-size:10px!important;gap:2px!important;color:#334155!important;}
  .main-menu-item i{font-size:18px!important;}
  .main-menu-item span{font-size:10px!important;line-height:12px!important;max-width:66px!important;}
  .main-menu-item.active{background:var(--tb-accent-soft)!important;color:var(--tb-accent)!important;}
  .main-menu-item.active i{color:var(--tb-accent)!important;}

  .login-page{height:100dvh!important;overflow:auto!important;}
  .login-right{padding:14px!important;}
  .login-card{padding:18px!important;}

  .content-toolbar,.client-toolbar,.settings-user-toolbar,.stage-page-head,.tb-website-list-toolbar,.automation-toolbar,.gs-toolbar,.da-page-head,.tb-dash-head{padding:12px!important;gap:10px!important;}
  .create-btn,.settings-add-btn,.stage-primary-btn,.drawer-save,.drawer-cancel,.settings-save-btn,.settings-test-btn,.query-green-btn,.query-outline-btn,.tb-wa-test-btn,.tb-wa-open-link{min-height:36px!important;}
  .create-btn span,.settings-add-btn span{display:none!important;}
  .right-tools button,.right-tools a,.left-tools button,.left-tools a{flex:0 0 auto!important;}

  .settings-layout,.tb-website-layout{display:block!important;height:auto!important;max-height:none!important;overflow:visible!important;background:#fff!important;}
  .settings-left,.tb-website-left{width:100%!important;min-width:0!important;flex-basis:auto!important;border-right:0!important;border-bottom:1px solid #dfe7ef!important;padding:8px!important;display:flex!important;gap:6px!important;overflow-x:auto!important;overflow-y:hidden!important;position:sticky!important;top:0!important;z-index:30!important;background:#fff!important;-webkit-overflow-scrolling:touch!important;scrollbar-width:none!important;}
  .settings-left::-webkit-scrollbar,.tb-website-left::-webkit-scrollbar{display:none!important;}
  .settings-left .settings-title,.tb-website-left .settings-title{display:none!important;}
  .settings-left-link{height:34px!important;white-space:nowrap!important;flex:0 0 auto!important;border:1px solid #e5edf3!important;border-radius:18px!important;margin:0!important;background:#fff!important;}
  .settings-main,.tb-website-main,.tb-website-form{height:auto!important;max-height:none!important;overflow:visible!important;}
  .settings-content-box,.tb-website-main>.settings-content-box.tb-website-box,.tb-website-form>.settings-content-box.tb-website-box,.tb-website-pages-box,.tb-website-markup-box{height:auto!important;max-height:none!important;min-height:calc(100dvh - 152px)!important;overflow:visible!important;padding-bottom:18px!important;}
  body.tb-website-page-open .content-area,body.tb-website-page-open .settings-main,body.tb-website-page-open .tb-website-main,body.tb-website-page-open .tb-website-layout,body.tb-website-page-open .tb-website-form{height:auto!important;max-height:none!important;overflow:visible!important;}
  body.tb-website-page-open .tb-website-main>.settings-content-box.tb-website-box,body.tb-website-page-open .tb-website-form>.settings-content-box.tb-website-box{height:auto!important;max-height:none!important;overflow:visible!important;}

  .settings-profile-info,.settings-email-head,.organization-head,.client-detail-header,.detail-topbar,.query-bigin-head{height:auto!important;min-height:0!important;padding:14px!important;display:block!important;}
  .client-detail-actions,.query-title-actions,.activity-detail-top-actions{margin-top:10px!important;display:flex!important;gap:8px!important;overflow-x:auto!important;}
  .client-detail-page,.activity-detail-page,.query-detail-page,.client-page,.fields-page,.stage-page{height:auto!important;min-height:calc(100dvh - 126px)!important;overflow:visible!important;}
  .client-detail-layout,.query-detail-page .query-detail-layout,.query-bigin-body,.activity-detail-layout{display:block!important;height:auto!important;min-height:0!important;overflow:visible!important;}
  .client-detail-sidebar,.query-bigin-left,.activity-detail-side{max-height:none!important;border-right:0!important;border-bottom:1px solid #dfe7ef!important;padding:14px!important;}
  .client-detail-main,.query-bigin-main,.activity-detail-main{min-height:0!important;overflow:visible!important;}
  .client-detail-tabs,.query-bigin-tabs,.activity-detail-tabs,.settings-email-tabs,.organization-tabs{height:43px!important;padding:0 12px!important;gap:16px!important;overflow-x:auto!important;}
  .client-detail-content,.query-bigin-content,.activity-detail-main{padding:12px!important;overflow:visible!important;background:#eef4f8!important;}
  .query-card-list,.query-document-list,.query-timeline-list{padding:12px!important;}
  .query-tab-head{padding:12px!important;}
  .query-tab-head h3{font-size:17px!important;}
  .query-stagebar{height:auto!important;padding:10px 12px!important;}
  .query-stagebar-list{min-width:780px!important;padding-bottom:6px!important;}
  .query-stagebar-name{white-space:normal!important;max-width:74px!important;}

  .client-page{display:block!important;background:#fff!important;}
  .client-list-body,.query-list-body,.itinerary-list-body{height:auto!important;overflow:visible!important;}
  .client-footer-bar,.query-footer-bar{display:none!important;}
  .client-filter-panel,.query-side-panel{display:none!important;}
  .client-table-wrap,.query-table-wrap,.table-wrap,.settings-table-wrap,.tb-website-pages-table-wrap,.itinerary-module-page .client-table-wrap{width:100%!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important;}
  .crm-table,.client-table,.query-table,.settings-table,.detail-table,.tb-website-pages-table,.itinerary-table,.payments-table,.report-table,.marketing-table{min-width:900px!important;}
  .crm-table th,.crm-table td,.client-table th,.client-table td,.settings-table th,.settings-table td,.detail-table th,.detail-table td{font-size:12px!important;padding-left:10px!important;padding-right:10px!important;}

  .drawer-form,.query-drawer-form,.activity-form,.client-drawer-form,.mtm-popup-form,.tb-website-content-form{width:100%!important;max-width:100%!important;min-height:100dvh!important;padding:16px 14px 0!important;}
  .right-drawer{width:100%!important;max-width:100vw!important;height:100dvh!important;top:0!important;right:0!important;transform:translateX(110%)!important;border-top:0!important;}
  .right-drawer.show{transform:translateX(0)!important;}
  .right-drawer-header{height:52px!important;padding:0 14px!important;}
  .right-drawer-header h3{font-size:16px!important;}
  .right-drawer-body{height:calc(100dvh - 52px)!important;overflow:auto!important;}
  .drawer-form-body,.query-form-body,.activity-form .drawer-form-body{padding:14px 0 88px!important;}
  .drawer-top-owner,.owner-field,.query-type-row,.query-radio-row,.activity-inline-options,.activity-repeat-controls{display:block!important;}
  .owner-select{width:100%!important;min-width:0!important;margin-top:7px!important;}
  .drawer-control,input.drawer-control,select.drawer-control,textarea.drawer-control,.query-drawer-form input,.query-drawer-form select,.query-drawer-form textarea,.email-control{font-size:14px!important;min-height:38px!important;}
  .drawer-field-row{margin-bottom:14px!important;}
  .drawer-footer,.query-drawer-form .drawer-form-foot,.activity-form .drawer-footer{position:sticky!important;bottom:0!important;height:auto!important;min-height:58px!important;padding:10px 14px!important;margin:0 -14px!important;background:#fff!important;display:flex!important;justify-content:flex-end!important;gap:8px!important;border-top:1px solid #edf1f5!important;z-index:50!important;}
  .drawer-footer-actions{display:flex!important;gap:8px!important;flex-wrap:wrap!important;justify-content:flex-end!important;}
  .drawer-footer .drawer-cancel,.drawer-footer .drawer-save{min-width:84px!important;}

  .query-grid-2,.query-drawer-form .drawer-field-grid.two,.query-drawer-form .drawer-field-grid.three,.query-pax-row,.age-grid,.tb-website-form-grid,.tb-website-form-grid.one,.tb-website-form-grid.image-text,.tb-website-option-grid,.mtm-form-grid,.mtm-form-grid.three,.fields-custom-grid,.fields-editor-main,.organization-row,.organization-row.url-row,.email-field-row,.activity-form .drawer-row,.activity-detail-grid,.hotel-single-supplier-row{grid-template-columns:1fr!important;}
  .age-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
  .fields-editor{height:auto!important;min-height:100dvh!important;}
  .fields-editor-top{height:auto!important;min-height:64px!important;padding:12px 14px!important;align-items:flex-start!important;flex-direction:column!important;}
  .fields-board{height:auto!important;display:flex!important;overflow-x:auto!important;padding:12px!important;}
  .field-module-card{width:86vw!important;min-width:86vw!important;}
  .fields-used-panel,.fields-unused-panel{padding:14px!important;}
  .fields-editor-footer{height:auto!important;min-height:58px!important;gap:8px!important;flex-wrap:wrap!important;}

  .stage-layout{display:block!important;overflow:visible!important;}
  .stage-pipeline-panel{height:auto!important;max-height:230px!important;border-right:0!important;border-bottom:1px solid #dfe7ef!important;}
  .stage-main-panel{padding:12px!important;overflow:visible!important;}
  .stage-main-top,.stage-bottom-actions{display:block!important;}
  .stage-main-actions,.stage-bottom-actions>div{margin-top:10px!important;justify-content:flex-start!important;}

  .tb-whatsapp-page{display:block!important;height:calc(100dvh - 126px)!important;min-height:0!important;overflow:hidden!important;border-radius:0!important;border-left:0!important;border-right:0!important;}
  .tb-wa-left{height:42%!important;min-height:230px!important;border-right:0!important;border-bottom:1px solid #e2e8f0!important;}
  .tb-wa-center{height:58%!important;min-height:330px!important;}
  .tb-wa-chat-head{height:58px!important;padding:0 12px!important;}
  .tb-wa-messages{padding:14px 12px!important;}
  .tb-wa-bubble{max-width:90%!important;}
  .tb-wa-compose{height:62px!important;padding:9px 10px!important;}
  .tb-wa-contact-panel{left:8px!important;right:8px!important;width:auto!important;top:60px!important;}

  .tb-live-modal-box{width:100vw!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;}
  .tb-live-modal-body{padding:12px!important;}
  .tbo-global-search-row,.tbo-global-hotel .tbo-hotel-search-row,.tbo-flight-global-main,.tbo-global-results.show,.tbo-hotel-detail-top{grid-template-columns:1fr!important;}
  .tbo-flight-card,.tbo-hotel-card{grid-template-columns:1fr!important;}
  .tbo-fare-box,.tbo-hotel-price{text-align:left!important;align-items:flex-start!important;}

  .tb-web-page-drawer{width:100%!important;max-width:100vw!important;}
  .tb-web-page-form-wrap{padding:14px!important;}
  .tb-web-page-form-wrap .tb-website-actions{margin:16px -14px -14px!important;padding:10px 14px!important;}
  .tb-website-search{width:100%!important;}
  .tb-web-page-cell b,.tb-web-page-cell small{max-width:150px!important;}

  .itinerary-table{min-width:980px!important;}
  .itinerary-service-quote-form .quote-pro-head-actions{justify-content:flex-start!important;flex-wrap:wrap!important;}
  #itineraryMasterModal .quote-master-modal-card{width:94vw!important;max-height:88dvh!important;}
  #itineraryMasterModal .quote-master-search{display:block!important;}
  #itineraryMasterModal .quote-master-search button{margin-top:8px!important;width:100%!important;height:38px!important;}
  #itineraryMasterModal .quote-master-card{display:block!important;}
  #itineraryMasterModal .quote-master-card button{margin-top:10px!important;width:100%!important;height:36px!important;}

  .ui-datepicker{max-width:calc(100vw - 18px)!important;left:9px!important;}
  .select2-container{max-width:100%!important;}
  .select2-dropdown{max-width:calc(100vw - 16px)!important;}
  .tb-alert-modal{width:calc(100vw - 28px)!important;max-width:calc(100vw - 28px)!important;}
  .tb-toast-stack{left:10px!important;right:10px!important;top:58px!important;width:auto!important;}
  .tb-toast{width:100%!important;}
}

@media (max-width: 575px){
  .crm-header{padding:0 8px!important;}
  .crm-brand{min-width:42px!important;max-width:58px!important;}
  .crm-brand .brand-name{font-size:13px!important;max-width:54px!important;}
  .top-add,.top-icon,.profile-badge{width:28px!important;height:28px!important;min-width:28px!important;}
  .tbhsr-reminder-badge{right:-4px!important;top:-5px!important;}
  .content-area{padding-bottom:72px!important;}
  .main-menu{height:62px!important;min-height:62px!important;padding:0 4px!important;}
  .main-menu-item{width:64px!important;min-width:64px!important;height:54px!important;min-height:54px!important;border-radius:12px!important;}
  .main-menu-item span{font-size:9px!important;max-width:58px!important;}
  .main-menu-item i{font-size:17px!important;}

  .tb-dash-kpi-grid{grid-template-columns:1fr!important;}
  .tb-dash-kpi{min-height:92px!important;grid-template-columns:40px minmax(0,1fr) 20px!important;padding:14px!important;}
  .tb-dash-kpi b{font-size:22px!important;}
  .tb-dash-card-head{height:auto!important;min-height:54px!important;padding:10px 12px!important;}
  .tb-dash-bar-row{grid-template-columns:82px minmax(0,1fr) 34px!important;}
  .tb-dash-list-row{align-items:flex-start!important;flex-direction:column!important;padding:8px 0!important;gap:2px!important;}
  .tb-dash-list-row b,.tb-dash-list-row span{max-width:100%!important;}

  .settings-left-link{font-size:12px!important;padding:0 10px!important;}
  .settings-status-tabs{width:100%!important;overflow-x:auto!important;justify-content:flex-start!important;}
  .settings-status-tabs a{white-space:nowrap!important;}
  .settings-user-actions,.right-tools,.left-tools{align-items:stretch!important;}
  .settings-user-actions>*{max-width:100%!important;}
  .settings-user-license{width:100%!important;min-width:0!important;}

  .client-detail-title h2,.query-title-line h2,.detail-title-wrap h2{font-size:18px!important;line-height:24px!important;}
  .query-bigin-tabs a,.client-detail-tabs a,.activity-detail-tabs a{font-size:13px!important;}
  .query-stagebar-list{min-width:720px!important;}
  .query-stagebar-name{font-size:10px!important;line-height:12px!important;max-width:64px!important;}
  .query-quotation-top,.bigin-supplier-row,.bigin-invoice-row,.query-timeline-item,.query-document-person-head{display:block!important;}
  .query-quotation-actions,.bigin-supplier-action,.bigin-invoice-action{margin-top:10px!important;justify-content:flex-start!important;}
  .query-doc-grid{grid-template-columns:1fr!important;}

  .drawer-form,.query-drawer-form,.client-drawer-form,.mtm-popup-form{padding-left:12px!important;padding-right:12px!important;}
  .drawer-footer,.query-drawer-form .drawer-form-foot,.activity-form .drawer-footer{margin-left:-12px!important;margin-right:-12px!important;padding-left:12px!important;padding-right:12px!important;}
  .drawer-footer-actions,.query-drawer-form .drawer-form-foot{width:100%!important;}
  .drawer-cancel,.drawer-save,.query-drawer-form .btn-light,.query-drawer-form .btn-green{flex:1 1 auto!important;min-width:0!important;}
  .drawer-section-title{font-size:16px!important;white-space:normal!important;}

  .tb-wa-left-head{padding:12px!important;}
  .tb-wa-left-title{font-size:17px!important;}
  .tb-wa-search{padding:10px 12px!important;}
  .tb-wa-tabs{padding:0 12px 10px!important;overflow-x:auto!important;}
  .tb-wa-tabs button{white-space:nowrap!important;padding:0 10px!important;}
  .tb-wa-chat-row{padding:10px 12px!important;}
  .tb-wa-compose button.tb-wa-attach{width:36px!important;height:36px!important;}
  .tb-wa-compose button.tb-wa-send{width:40px!important;height:38px!important;}
  .tb-wa-compose textarea{height:40px!important;padding:10px 13px!important;}

  .tbinvtpl-head,.tbinvtpl-grid,.tbinvtpl-note,.tbqv-head,.tbqv-meta-grid{display:block!important;}
  .tbinvtpl-pad{padding:18px!important;}
  .tbinvtpl-title{text-align:left!important;margin-top:14px!important;}
  .tbinvtpl-totalbox{width:100%!important;}

  .crm-table,.client-table,.query-table,.settings-table,.detail-table,.tb-website-pages-table,.itinerary-table,.payments-table,.report-table,.marketing-table{min-width:820px!important;}
}

@media (max-width: 420px){
  .header-right{gap:4px!important;}
  .top-add,.top-icon,.profile-badge{width:27px!important;height:27px!important;min-width:27px!important;}
  .crm-brand{max-width:48px!important;}
  .crm-brand .brand-name{max-width:44px!important;}
  .main-menu-item{width:60px!important;min-width:60px!important;}
  .main-menu-item span{display:none!important;}
  .main-menu-item i{font-size:19px!important;}
  .main-menu{height:58px!important;min-height:58px!important;}
  .content-area{padding-bottom:66px!important;}
  .tb-dash-title h1{font-size:21px!important;line-height:26px!important;}
  .tb-dash-title-icon{width:36px!important;height:36px!important;}
  .crm-table,.client-table,.query-table,.settings-table,.detail-table,.tb-website-pages-table,.itinerary-table,.payments-table,.report-table,.marketing-table{min-width:780px!important;}
}

/* Mobile header/menu refinement requested on 20 Jun 2026
   Keep desktop CSS untouched: hide selected mobile menu items, keep compact global search visible, and hide live Flight/Hotel search buttons. */
@media (max-width: 991px){
  body .main-menu a.main-menu-item[href*="ga=website_settings"],
  body .main-menu a.main-menu-item[href*="ga=attendance"],
  body .main-menu a.main-menu-item[href*="ga=marketing"]{
    display:none!important;
  }

  html body .crm-header .header-right button.tb-live-head-btn,
  html body .crm-header .header-right .tb-live-head-btn{
    display:none!important;
  }

  body .crm-header{
    gap:8px!important;
  }
  body .crm-header .crm-search.tbhsr-search-wrap{
    display:flex!important;
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:260px!important;
    height:100%!important;
    align-items:center!important;
    margin:0!important;
    z-index:110!important;
  }
  body .crm-header .crm-search .search-filter,
  body .crm-header .crm-search .tbhsr-filter-btn,
  body .crm-header .crm-search .tbhsr-filter-menu{
    display:none!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box{
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    border-radius:18px!important;
    margin:0!important;
    padding:0 10px 0 12px!important;
    border:1px solid #d7e0e8!important;
    background:#fff!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box input{
    width:100%!important;
    min-width:0!important;
    font-size:12px!important;
    padding:0!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box i,
  body .crm-header .crm-search .tbhsr-search-icon{
    flex:0 0 auto!important;
    font-size:15px!important;
  }
  body .crm-header .crm-search .tbhsr-search-panel{
    left:0!important;
    right:auto!important;
    top:42px!important;
    width:min(360px,calc(100vw - 16px))!important;
    min-width:0!important;
    max-height:65dvh!important;
  }
}

@media (max-width: 767px){
  body .crm-header .crm-search.tbhsr-search-wrap{
    max-width:190px!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box{
    height:31px!important;
    padding-left:10px!important;
    padding-right:9px!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box input{
    font-size:12px!important;
  }
}

@media (max-width: 575px){
  body .crm-header .crm-search.tbhsr-search-wrap{
    max-width:158px!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box input::placeholder{
    color:transparent!important;
  }
}

@media (max-width: 420px){
  body .crm-header .crm-search.tbhsr-search-wrap{
    max-width:132px!important;
  }
  body .crm-header .crm-search .search-box.tbhsr-search-box{
    height:30px!important;
    padding-left:9px!important;
    padding-right:8px!important;
  }
}

/* Mobile responsive pass 3 - 20 Jun 2026
   No original CSS file touched. This block fixes mobile input zoom, hides AI bot on mobile,
   keeps bottom menu above content, and styles the mobile navigation loader. */
@media (max-width: 991px){
  html body .tb-ai-assistant,
  html body .tb-ai-float,
  html body .tb-ai-panel,
  html body .tb-ai-nudge,
  html body .tb-ai-resize{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
  }
}

@media (max-width: 767px){
  html{
    -webkit-text-size-adjust:100%!important;
    text-size-adjust:100%!important;
  }

  /* iPhone/Safari zoom रोकने के लिए mobile fields में 16px font जरूरी है. */
  input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
  select,
  textarea,
  .drawer-control,
  input.drawer-control,
  select.drawer-control,
  textarea.drawer-control,
  .query-drawer-form input,
  .query-drawer-form select,
  .query-drawer-form textarea,
  .email-control,
  .form-control,
  .form-select,
  .settings-control,
  .organization-control,
  .tb-website-control,
  .quote-control,
  .quote-field input,
  .quote-field select,
  .quote-field textarea,
  .tb-wa-compose input,
  .tb-wa-compose textarea,
  .crm-search input,
  .search-box input{
    font-size:16px!important;
    line-height:20px!important;
  }

  .select2-container .select2-selection--single .select2-selection__rendered,
  .select2-container .select2-search__field,
  .select2-container--default .select2-search--dropdown .select2-search__field{
    font-size:16px!important;
  }

  body .crm-header .crm-search .search-box.tbhsr-search-box input{
    font-size:16px!important;
  }

  /* Bottom mobile menu should stay above page content while normal browsing. */
  body .main-menu{
    z-index:99960!important;
    transform:translateZ(0)!important;
    backface-visibility:hidden!important;
    will-change:transform!important;
  }
  body .main-menu .main-menu-item{
    position:relative!important;
    z-index:1!important;
  }
  body .content-area{
    padding-bottom:86px!important;
  }

  .tb-mobile-page-loader{
    position:fixed!important;
    inset:0!important;
    z-index:99999!important;
    display:none;
    align-items:center!important;
    justify-content:center!important;
    background:rgba(248,251,252,.54)!important;
    -webkit-backdrop-filter:blur(4px)!important;
    backdrop-filter:blur(4px)!important;
    opacity:0;
    transition:opacity .12s ease;
  }
  .tb-mobile-page-loader.show{
    display:flex!important;
    opacity:1;
  }
  .tb-mobile-loader-card{
    width:74px!important;
    min-height:74px!important;
    border-radius:22px!important;
    background:rgba(255,255,255,.92)!important;
    border:1px solid rgba(226,232,240,.92)!important;
    box-shadow:0 18px 46px rgba(15,23,42,.20)!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
  }
  .tb-mobile-loader-spinner{
    width:28px!important;
    height:28px!important;
    border-radius:50%!important;
    border:3px solid #dbeafe!important;
    border-top-color:var(--tb-accent,#009b63)!important;
    animation:tbMobileLoaderSpin .75s linear infinite!important;
  }
  .tb-mobile-loader-card span{
    font-size:11px!important;
    line-height:13px!important;
    color:#334155!important;
    font-weight:800!important;
    letter-spacing:.02em!important;
  }
}

@keyframes tbMobileLoaderSpin{
  to{transform:rotate(360deg);}
}

/* Mobile responsive pass 4 - 20 Jun 2026
   Fixes: hide cut company name, visible header search typing, stop hover flyout over footer menu,
   and keep footer menu clickable above page content on mobile. */
@media (max-width: 767px){
  html body .crm-header{
    z-index:2147483000!important;
    position:relative!important;
    padding-left:10px!important;
    padding-right:8px!important;
    gap:8px!important;
    overflow:visible!important;
  }

  html body .crm-header .crm-brand{
    display:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    flex:0 0 0!important;
    overflow:hidden!important;
  }

  html body .crm-header .crm-search.tbhsr-search-wrap{
    display:flex!important;
    flex:1 1 auto!important;
    width:auto!important;
    min-width:118px!important;
    max-width:none!important;
    margin:0!important;
    z-index:2147483001!important;
  }

  html body .crm-header .crm-search .search-box.tbhsr-search-box{
    width:100%!important;
    min-width:0!important;
    height:34px!important;
    border-radius:18px!important;
    background:#fff!important;
    border:1px solid #d7e0e8!important;
    box-shadow:0 1px 2px rgba(15,23,42,.06)!important;
    padding:0 9px 0 12px!important;
    gap:6px!important;
  }

  html body .crm-header .crm-search .search-box.tbhsr-search-box input,
  html body.tb-theme-bigin_dark_header .crm-header .crm-search .search-box.tbhsr-search-box input{
    color:#0f172a!important;
    -webkit-text-fill-color:#0f172a!important;
    caret-color:#0f172a!important;
    opacity:1!important;
    background:transparent!important;
    min-width:0!important;
    width:100%!important;
    flex:1 1 auto!important;
    font-size:16px!important;
    font-weight:600!important;
    line-height:20px!important;
  }

  html body .crm-header .crm-search .search-box.tbhsr-search-box input::placeholder,
  html body.tb-theme-bigin_dark_header .crm-header .crm-search .search-box.tbhsr-search-box input::placeholder{
    color:#94a3b8!important;
    -webkit-text-fill-color:#94a3b8!important;
    opacity:1!important;
  }

  html body .crm-header .crm-search .search-box.tbhsr-search-box i,
  html body .crm-header .crm-search .tbhsr-search-icon,
  html body.tb-theme-bigin_dark_header .crm-header .crm-search .search-box.tbhsr-search-box i,
  html body.tb-theme-bigin_dark_header .crm-header .crm-search .tbhsr-search-icon{
    color:#94a3b8!important;
    flex:0 0 auto!important;
  }

  html body .crm-header .header-right{
    flex:0 0 auto!important;
    margin-left:0!important;
    gap:7px!important;
    z-index:2147483001!important;
  }

  html body .crm-header .header-right .top-add,
  html body .crm-header .header-right .top-icon,
  html body .crm-header .header-right .profile-badge{
    width:31px!important;
    height:31px!important;
    min-width:31px!important;
    flex:0 0 31px!important;
  }

  html body .crm-header .crm-search .tbhsr-search-panel{
    position:absolute!important;
    left:10px!important;
    right:10px!important;
    top:46px!important;
    width:auto!important;
    max-width:none!important;
    z-index:2147483002!important;
  }

  html body .crm-layout,
  html body .content-area{
    position:relative!important;
    z-index:1!important;
  }

  html body .content-area{
    padding-bottom:calc(96px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .main-menu{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:env(safe-area-inset-bottom,0px)!important;
    width:100%!important;
    height:68px!important;
    min-height:68px!important;
    z-index:2147483010!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-start!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    pointer-events:auto!important;
    isolation:isolate!important;
    transform:translateZ(0)!important;
    background:#fff!important;
    border-top:1px solid #dfe7ef!important;
    border-right:0!important;
    box-shadow:0 -10px 28px rgba(15,23,42,.14)!important;
    -webkit-overflow-scrolling:touch!important;
    touch-action:pan-x!important;
    padding:6px 7px!important;
  }

  html body .main-menu:hover,
  html body .main-menu:focus-within{
    width:100%!important;
    min-width:100%!important;
    box-shadow:0 -10px 28px rgba(15,23,42,.14)!important;
  }

  html body .main-menu:after,
  html body .main-menu:hover:after,
  html body .main-menu:focus-within:after{
    content:none!important;
    display:none!important;
    opacity:0!important;
    pointer-events:none!important;
  }

  html body .main-menu .main-menu-item,
  html body .main-menu:hover .main-menu-item,
  html body .main-menu:focus-within .main-menu-item{
    position:relative!important;
    z-index:2!important;
    pointer-events:auto!important;
    width:58px!important;
    min-width:58px!important;
    height:56px!important;
    min-height:56px!important;
    border-radius:16px!important;
    margin:0 3px!important;
    padding:0!important;
    flex:0 0 58px!important;
    background:transparent!important;
    text-decoration:none!important;
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:rgba(var(--tb-accent-rgb),.15)!important;
  }

  html body .main-menu .main-menu-item span,
  html body .main-menu:hover .main-menu-item span,
  html body .main-menu:focus-within .main-menu-item span,
  html body.tb-theme-bigin_dark_header .main-menu .main-menu-item span,
  html body.tb-theme-bigin_dark_header .main-menu:hover .main-menu-item span{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    width:0!important;
    height:0!important;
    overflow:hidden!important;
  }

  html body .main-menu .main-menu-item i,
  html body .main-menu:hover .main-menu-item i,
  html body .main-menu:focus-within .main-menu-item i{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    border-radius:14px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0 auto!important;
    font-size:19px!important;
  }

  html body .main-menu .main-menu-item.active,
  html body .main-menu .main-menu-item.active:hover,
  html body .main-menu .main-menu-item.active:focus{
    background:transparent!important;
  }

  html body .main-menu .main-menu-item.active i,
  html body .main-menu .main-menu-item.active:hover i,
  html body .main-menu .main-menu-item.active:focus i{
    background:var(--tb-accent)!important;
    color:#fff!important;
  }
}

@media (max-width: 420px){
  html body .crm-header .header-right{
    gap:6px!important;
  }
  html body .crm-header .header-right .top-add,
  html body .crm-header .header-right .top-icon,
  html body .crm-header .header-right .profile-badge{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    flex:0 0 30px!important;
  }
  html body .main-menu .main-menu-item,
  html body .main-menu:hover .main-menu-item,
  html body .main-menu:focus-within .main-menu-item{
    width:56px!important;
    min-width:56px!important;
    flex-basis:56px!important;
  }
}

/* Mobile responsive pass 5 - bottom footer/menu safe space
   Fixed mobile bottom menu overlapping page content and popup Save/Cancel footers.
   Existing css/main.css remains untouched. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:76px;
    --tb-mobile-footer-gap:18px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
    --tb-mobile-bottom-space:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-footer-gap) + var(--tb-mobile-safe-bottom));
  }

  html body{
    padding-bottom:0!important;
  }

  html body .crm-layout,
  html body .content-area{
    min-height:calc(100dvh - 50px)!important;
  }

  html body .content-area{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
    scroll-padding-bottom:var(--tb-mobile-bottom-space)!important;
  }

  html body .content-area > *:last-child,
  html body .dashboard-page,
  html body .tb-dash-page,
  html body .client-page,
  html body .query-page,
  html body .itinerary-module-page,
  html body .settings-page,
  html body .payments-page,
  html body .reports-page,
  html body .marketing-page,
  html body .activity-page,
  html body .stage-page,
  html body .fields-page,
  html body .tb-website-page,
  html body .tb-website-layout,
  html body .settings-layout,
  html body .settings-main,
  html body .settings-content,
  html body .query-detail-page,
  html body .client-detail-page,
  html body .activity-detail-page{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
    margin-bottom:0!important;
  }

  html body .tb-dash-grid,
  html body .tb-dash-kpi-grid,
  html body .client-list-body,
  html body .query-list-body,
  html body .itinerary-list-body,
  html body .settings-content-box,
  html body .tb-website-main,
  html body .tb-website-form,
  html body .query-bigin-content,
  html body .client-detail-content,
  html body .activity-detail-main{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
  }

  html body .main-menu{
    height:68px!important;
    min-height:68px!important;
    padding-bottom:calc(6px + var(--tb-mobile-safe-bottom))!important;
  }

  /* Right-drawer/add-edit popup forms: keep Save/Cancel above bottom menu. */
  html body .right-drawer,
  html body .tb-web-page-drawer{
    padding-bottom:var(--tb-mobile-footer-h)!important;
    box-sizing:border-box!important;
  }

  html body .right-drawer-body,
  html body .drawer-body,
  html body .tb-web-page-drawer-body,
  html body .tb-web-page-form-wrap,
  html body .drawer-form,
  html body .query-drawer-form,
  html body .activity-form,
  html body .client-drawer-form,
  html body .mtm-popup-form,
  html body .tb-website-content-form{
    padding-bottom:calc(var(--tb-mobile-bottom-space) + 24px)!important;
    scroll-padding-bottom:calc(var(--tb-mobile-bottom-space) + 24px)!important;
  }

  html body .drawer-form-body,
  html body .query-form-body,
  html body .activity-form .drawer-form-body,
  html body .client-drawer-form .drawer-form-body,
  html body .mtm-popup-form .drawer-form-body,
  html body .tb-website-content-form .drawer-form-body{
    padding-bottom:calc(var(--tb-mobile-bottom-space) + 92px)!important;
  }

  html body .drawer-footer,
  html body .query-drawer-form .drawer-form-foot,
  html body .activity-form .drawer-footer,
  html body .client-drawer-form .drawer-footer,
  html body .mtm-popup-form .drawer-footer,
  html body .tb-website-actions,
  html body .tb-web-page-form-wrap .tb-website-actions,
  html body .fields-editor-footer,
  html body .stage-bottom-actions{
    bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom))!important;
    z-index:2147483005!important;
    margin-bottom:0!important;
    box-shadow:0 -8px 22px rgba(15,23,42,.10)!important;
  }

  /* Generic modal/popup footers also need breathing room on mobile. */
  html body .modal,
  html body .modal-dialog,
  html body .modal-content,
  html body .popupbox,
  html body .popup-box,
  html body .popup-container,
  html body .quote-master-modal-card,
  html body .tb-alert-modal,
  html body .tb-live-modal-box,
  html body .tb-ai-panel{
    max-height:calc(100dvh - var(--tb-mobile-bottom-space))!important;
  }

  html body .modal-body,
  html body .popup-body,
  html body .quote-master-modal-body,
  html body .tb-live-modal-body,
  html body .tb-alert-body{
    padding-bottom:calc(var(--tb-mobile-bottom-space) + 20px)!important;
    scroll-padding-bottom:calc(var(--tb-mobile-bottom-space) + 20px)!important;
  }

  html body .modal-footer,
  html body .popup-footer,
  html body .quote-master-modal-footer,
  html body .tb-alert-footer{
    padding-bottom:calc(12px + var(--tb-mobile-safe-bottom))!important;
    margin-bottom:var(--tb-mobile-footer-h)!important;
  }
}

@media (max-width: 420px){
  :root{
    --tb-mobile-footer-h:72px;
    --tb-mobile-footer-gap:18px;
  }

  html body .content-area{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
  }
}

/* Mobile responsive pass 6 - popup/header stacking fix
   Popups, drawers, modals and their dropdowns must stay above the mobile top header/footer menu. */
@media (max-width: 767px){
  :root{
    --tb-mobile-z-page:1;
    --tb-mobile-z-header:2147483000;
    --tb-mobile-z-menu:2147483010;
    --tb-mobile-z-popup-backdrop:2147483030;
    --tb-mobile-z-popup:2147483040;
    --tb-mobile-z-popup-ui:2147483050;
  }

  html body .crm-layout,
  html body .content-area{
    z-index:var(--tb-mobile-z-page)!important;
  }

  html body .crm-header{
    z-index:var(--tb-mobile-z-header)!important;
  }

  html body .main-menu{
    z-index:var(--tb-mobile-z-menu)!important;
  }

  html body .right-drawer-overlay,
  html body .tb-web-page-overlay,
  html body .modal-backdrop,
  html body .offcanvas-backdrop,
  html body .quick-company-overlay,
  html body .hotel-master-modal-backdrop,
  html body .crm-media-modal-backdrop,
  html body .crm-media-preview-backdrop,
  html body .quote-master-import-backdrop,
  html body #itineraryMasterModal.quote-master-modal,
  html body .quote-master-modal,
  html body .tb-alert-backdrop,
  html body .tb-live-modal-backdrop{
    z-index:var(--tb-mobile-z-popup-backdrop)!important;
  }

  html body .right-drawer,
  html body .right-drawer.show,
  html body .tb-web-page-drawer,
  html body .tb-web-page-drawer.show,
  html body .modal,
  html body .modal.show,
  html body .modal-dialog,
  html body .modal-content,
  html body .offcanvas,
  html body .popupbox,
  html body .popup-box,
  html body .popup-container,
  html body .create-record-popup,
  html body .hotel-master-modal,
  html body .hotel-master-modal-box,
  html body .crm-media-modal,
  html body .crm-media-preview,
  html body .quote-master-modal-card,
  html body .quote-master-import-modal,
  html body .tb-alert-modal,
  html body .tb-live-modal-box{
    z-index:var(--tb-mobile-z-popup)!important;
  }

  html body .right-drawer-header,
  html body .right-drawer-body,
  html body .drawer-footer,
  html body .query-drawer-form .drawer-form-foot,
  html body .tb-website-actions,
  html body .tb-web-page-form-wrap .tb-website-actions,
  html body .modal-header,
  html body .modal-body,
  html body .modal-footer,
  html body .popup-header,
  html body .popup-body,
  html body .popup-footer,
  html body .hotel-master-modal-head,
  html body .hotel-master-modal-body,
  html body .hotel-master-modal-foot,
  html body .quote-master-modal-head,
  html body .quote-master-modal-body,
  html body .quote-master-modal-footer,
  html body .quote-master-import-head,
  html body .quote-master-import-body,
  html body .quote-master-import-foot,
  html body .stage-popup-footer{
    position:relative!important;
    z-index:var(--tb-mobile-z-popup-ui)!important;
  }

  html body .select2-container--open,
  html body .select2-dropdown,
  html body .ui-datepicker,
  html body .flatpickr-calendar,
  html body .tox-tinymce-aux,
  html body .ck.ck-balloon-panel,
  html body .crm-location-suggest,
  html body .bigin-lookup-menu,
  html body .activity-related-results,
  html body .tbhsr-search-panel{
    z-index:var(--tb-mobile-z-popup-ui)!important;
  }
}

/* Mobile responsive pass 7 - query list toolbar, dropdowns, import/export and pagination
   Keep all responsive fixes in this file only. */
@media (max-width: 767px){
  /* Query/list pages need their own available height because bottom menu is fixed. */
  html body .content-area:has(.client-page){
    padding-bottom:0!important;
  }

  html body .client-page,
  html body .query-page{
    height:calc(100dvh - 50px - var(--tb-mobile-footer-h) - var(--tb-mobile-safe-bottom))!important;
    min-height:0!important;
    max-height:calc(100dvh - 50px - var(--tb-mobile-footer-h) - var(--tb-mobile-safe-bottom))!important;
    overflow:visible!important;
    display:flex!important;
    flex-direction:column!important;
    background:#fff!important;
  }

  /* Top query/list toolbar: clean stacked mobile layout. */
  html body .client-toolbar,
  html body .query-page .client-toolbar{
    height:auto!important;
    min-height:0!important;
    flex:0 0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:8px!important;
    padding:10px 16px 10px!important;
    overflow:visible!important;
    position:relative!important;
    z-index:2147481500!important;
    background:#fff!important;
    border-bottom:1px solid #e5edf3!important;
  }

  html body .client-toolbar .left-tools,
  html body .client-toolbar .right-tools,
  html body .query-page .client-toolbar .left-tools,
  html body .query-page .client-toolbar .right-tools{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:8px!important;
    overflow:visible!important;
    position:relative!important;
    z-index:2147481510!important;
  }

  html body .query-page .client-view-wrap{
    order:1!important;
    max-width:calc(100vw - 32px)!important;
    position:relative!important;
    z-index:2147481530!important;
  }

  html body .query-page .client-view-button,
  html body .query-page .view-select{
    height:34px!important;
    min-height:34px!important;
    max-width:calc(100vw - 32px)!important;
    padding:0 14px!important;
    border-radius:18px!important;
    white-space:nowrap!important;
  }

  html body .query-page .query-custom-search,
  html body .query-page .client-custom-search{
    order:2!important;
    flex:1 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    height:36px!important;
    margin:8px 0 0!important;
    display:flex!important;
    position:relative!important;
    z-index:2147481515!important;
  }

  html body .query-page .query-custom-search input,
  html body .query-page .client-custom-search input{
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    border-radius:20px!important;
    padding:0 46px 0 14px!important;
    font-size:16px!important;
    line-height:36px!important;
    color:#111827!important;
    background:#fff!important;
    caret-color:var(--tb-accent)!important;
    text-overflow:ellipsis!important;
  }

  html body .query-page .query-custom-search input::placeholder,
  html body .query-page .client-custom-search input::placeholder{
    color:#64748b!important;
    opacity:.95!important;
  }

  html body .query-page .query-custom-search button,
  html body .query-page .client-custom-search button{
    right:8px!important;
    top:6px!important;
    width:24px!important;
    height:24px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#334155!important;
    z-index:2!important;
  }

  html body .query-page .query-custom-search a,
  html body .query-page .client-custom-search a{
    right:34px!important;
    top:7px!important;
    width:22px!important;
    height:22px!important;
    z-index:2!important;
  }

  html body .query-page .tbqas-open-btn{
    order:3!important;
    height:34px!important;
    max-width:100%!important;
    margin-top:2px!important;
    border-radius:18px!important;
    white-space:nowrap!important;
    position:relative!important;
    z-index:2147481515!important;
  }

  html body .query-page .right-tools.client-right-tools,
  html body .query-page .client-right-tools{
    order:4!important;
    margin-top:2px!important;
    z-index:2147481515!important;
  }

  html body .query-page .client-main-create,
  html body .query-page .create-btn.client-main-create{
    border-radius:18px!important;
    min-width:98px!important;
    justify-content:center!important;
  }

  /* Dropdowns must not be clipped or go behind the table. */
  html body .client-toolbar,
  html body .client-toolbar .left-tools,
  html body .client-toolbar .right-tools,
  html body .client-view-wrap,
  html body .client-create-wrap,
  html body .client-more-wrap,
  html body .client-bulk-more-wrap{
    overflow:visible!important;
  }

  html body .client-body,
  html body .client-list-area,
  html body .client-table-wrap{
    position:relative!important;
    z-index:1!important;
  }

  html body .query-page .client-view-menu,
  html body .client-view-menu{
    left:0!important;
    right:auto!important;
    top:40px!important;
    width:min(300px, calc(100vw - 32px))!important;
    max-width:calc(100vw - 32px)!important;
    max-height:calc(100dvh - 210px)!important;
    overflow:auto!important;
    z-index:2147482500!important;
    box-shadow:0 14px 34px rgba(15,23,42,.20)!important;
    border-radius:10px!important;
  }

  html body .query-page .client-view-menu a,
  html body .client-view-menu a{
    min-height:36px!important;
    height:auto!important;
    padding:8px 10px!important;
    font-size:13px!important;
    gap:10px!important;
  }

  html body .query-page .client-view-menu a b,
  html body .client-view-menu a b{
    flex:0 0 auto!important;
  }

  html body .query-page .client-create-menu,
  html body .client-create-menu{
    left:0!important;
    right:auto!important;
    top:40px!important;
    width:min(256px, calc(100vw - 32px))!important;
    max-width:calc(100vw - 32px)!important;
    max-height:calc(100dvh - 210px)!important;
    overflow:auto!important;
    z-index:2147482500!important;
    box-shadow:0 14px 34px rgba(15,23,42,.20)!important;
    border-radius:10px!important;
  }

  html body .query-page .client-more-menu,
  html body .client-more-menu,
  html body .client-bulk-menu{
    right:0!important;
    left:auto!important;
    top:40px!important;
    width:min(220px, calc(100vw - 32px))!important;
    max-width:calc(100vw - 32px)!important;
    max-height:calc(100dvh - 210px)!important;
    overflow:auto!important;
    z-index:2147482500!important;
    box-shadow:0 14px 34px rgba(15,23,42,.20)!important;
    border-radius:10px!important;
  }

  /* Hide all import/export/download controls on mobile. */
  html body .client-create-arrow,
  html body .client-create-menu,
  html body .import-export-btn,
  html body .report-export-btn,
  html body .client-import-link,
  html body .client-import-actions a[href*="download-sample" i],
  html body a[href*="download-sample" i],
  html body a[href*="export" i],
  html body button[onclick*="export" i],
  html body button[onclick*="import" i],
  html body a[onclick*="export" i],
  html body a[onclick*="import" i],
  html body button[popaction*="import" i],
  html body a[popaction*="import" i]{
    display:none!important;
  }

  html body .client-create-wrap .create-btn.client-main-create,
  html body .client-create-wrap .client-main-create{
    border-radius:18px!important;
    border-right:1px solid var(--tb-accent)!important;
  }

  html body .client-more-wrap:has(a[href*="export" i]),
  html body .client-more-wrap:has(button[onclick*="export" i]){
    display:none!important;
  }

  /* Keep list footer / pagination visible above the bottom menu. */
  html body .client-footer-bar,
  html body .query-page .client-footer-bar{
    flex:0 0 44px!important;
    height:44px!important;
    min-height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 10px!important;
    margin:0!important;
    position:relative!important;
    z-index:50!important;
    background:#fff!important;
    border-top:1px solid #e5edf3!important;
    box-shadow:0 -4px 14px rgba(15,23,42,.06)!important;
  }

  html body .client-footer-stats,
  html body .query-footer-stage-stats{
    display:none!important;
  }

  html body .client-footer-pages{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    font-size:12px!important;
    white-space:nowrap!important;
  }

  html body .client-footer-pages span{
    display:none!important;
  }

  html body .client-footer-pages select{
    width:auto!important;
    max-width:72px!important;
    height:30px!important;
    min-height:30px!important;
    padding:0 20px 0 9px!important;
    border-radius:16px!important;
    font-size:12px!important;
  }

  html body .client-footer-pages strong{
    min-width:78px!important;
    text-align:center!important;
    font-size:12px!important;
    color:#111827!important;
  }

  html body .client-footer-pages a{
    width:30px!important;
    height:30px!important;
    border-radius:50%!important;
    background:#f8fafc!important;
    border:1px solid #e2e8f0!important;
    color:#111827!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  html body .client-body{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  html body .client-table-wrap{
    height:100%!important;
    min-height:0!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
}

@media (max-width: 420px){
  html body .query-page .client-toolbar,
  html body .client-toolbar{
    padding-left:12px!important;
    padding-right:12px!important;
  }

  html body .query-page .client-view-menu,
  html body .client-view-menu,
  html body .query-page .client-create-menu,
  html body .client-create-menu,
  html body .query-page .client-more-menu,
  html body .client-more-menu,
  html body .client-bulk-menu{
    max-width:calc(100vw - 24px)!important;
  }

  html body .client-footer-pages{
    gap:6px!important;
  }

  html body .client-footer-pages strong{
    min-width:70px!important;
  }
}

/* Mobile popup form footer fix: keep Save/Cancel/Submit buttons in normal flow so they never cover fields. */
@media (max-width: 767px){
  html body #rightDrawer .right-drawer-body,
  html body .right-drawer.show .right-drawer-body,
  html body .tb-web-page-drawer.show .right-drawer-body{
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding-bottom:calc(88px + env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .drawer-form,
  html body #rightDrawer .query-drawer-form,
  html body #rightDrawer .client-drawer-form,
  html body #rightDrawer .activity-form,
  html body #rightDrawer .mtm-popup-form,
  html body #rightDrawer .tb-website-content-form,
  html body #rightDrawer .git-slot-popup-form,
  html body #rightDrawer form{
    min-height:auto!important;
    height:auto!important;
    padding-bottom:calc(24px + env(safe-area-inset-bottom))!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .query-section:last-of-type,
  html body #rightDrawer .drawer-section:last-of-type,
  html body #rightDrawer .form-section:last-of-type,
  html body #rightDrawer .query-box:last-of-type,
  html body #rightDrawer .tb-website-card:last-of-type,
  html body #rightDrawer .git-slot-section-title:last-of-type{
    margin-bottom:14px!important;
  }

  html body #rightDrawer .drawer-footer,
  html body #rightDrawer .query-drawer-form .drawer-form-foot,
  html body #rightDrawer .activity-form .drawer-footer,
  html body #rightDrawer .quote-drawer-footer,
  html body #rightDrawer .mtm-popup-form .drawer-footer,
  html body #rightDrawer .git-slot-popup-form .drawer-footer,
  html body #rightDrawer .tb-web-page-form-wrap .tb-website-actions,
  html body .right-drawer.show .drawer-footer,
  html body .right-drawer.show .query-drawer-form .drawer-form-foot{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    top:auto!important;
    transform:none!important;
    width:auto!important;
    max-width:100%!important;
    height:auto!important;
    min-height:62px!important;
    margin:18px 0 calc(14px + env(safe-area-inset-bottom)) 0!important;
    padding:10px 0!important;
    background:#fff!important;
    border-top:1px solid #edf1f5!important;
    box-shadow:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    z-index:2147483000!important;
    box-sizing:border-box!important;
    clear:both!important;
  }

  html body #rightDrawer .drawer-footer-actions,
  html body #rightDrawer .query-drawer-form .drawer-form-foot,
  html body #rightDrawer .tb-website-actions{
    width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    flex-wrap:nowrap!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .drawer-footer-actions > *,
  html body #rightDrawer .drawer-footer > button,
  html body #rightDrawer .drawer-footer > a,
  html body #rightDrawer .query-drawer-form .drawer-form-foot > button,
  html body #rightDrawer .tb-website-actions > button,
  html body #rightDrawer .tb-website-actions > a{
    flex:1 1 0!important;
    min-width:0!important;
    max-width:100%!important;
    white-space:nowrap!important;
  }

  html body #rightDrawer textarea,
  html body #rightDrawer textarea.drawer-control,
  html body #rightDrawer .query-drawer-form textarea{
    min-height:96px!important;
    padding-top:10px!important;
    padding-bottom:10px!important;
  }

  html body #rightDrawer .drawer-form-body,
  html body #rightDrawer .query-form-body,
  html body #rightDrawer .activity-form .drawer-form-body,
  html body #rightDrawer .tb-web-page-form-wrap,
  html body #rightDrawer .mtm-popup-form .drawer-form-body{
    padding-bottom:18px!important;
    overflow:visible!important;
  }
}

@media (max-width: 575px){
  html body #rightDrawer .drawer-footer,
  html body #rightDrawer .query-drawer-form .drawer-form-foot,
  html body #rightDrawer .activity-form .drawer-footer,
  html body #rightDrawer .quote-drawer-footer,
  html body #rightDrawer .mtm-popup-form .drawer-footer,
  html body #rightDrawer .git-slot-popup-form .drawer-footer,
  html body #rightDrawer .tb-web-page-form-wrap .tb-website-actions{
    margin-left:0!important;
    margin-right:0!important;
    padding-left:0!important;
    padding-right:0!important;
  }
}

/* Mobile responsive pass 9 - compact bottom safe space
   Keep only bottom-menu height as page/popup padding. Do not stack extra padding on nested containers. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:68px;
    --tb-mobile-footer-gap:0px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
    --tb-mobile-bottom-space:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom));
  }

  html body .main-menu{
    height:68px!important;
    min-height:68px!important;
    padding-bottom:calc(6px + var(--tb-mobile-safe-bottom))!important;
  }

  /* Only the main scroll area needs bottom space for the fixed mobile footer menu. */
  html body .content-area{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
    scroll-padding-bottom:var(--tb-mobile-bottom-space)!important;
  }

  /* Remove the repeated nested bottom padding that was creating large empty gaps. */
  html body .content-area > *:last-child,
  html body .dashboard-page,
  html body .tb-dash-page,
  html body .client-page,
  html body .query-page,
  html body .itinerary-module-page,
  html body .settings-page,
  html body .payments-page,
  html body .reports-page,
  html body .marketing-page,
  html body .activity-page,
  html body .stage-page,
  html body .fields-page,
  html body .tb-website-page,
  html body .tb-website-layout,
  html body .settings-layout,
  html body .settings-main,
  html body .settings-content,
  html body .query-detail-page,
  html body .client-detail-page,
  html body .activity-detail-page,
  html body .tb-dash-grid,
  html body .tb-dash-kpi-grid,
  html body .client-list-body,
  html body .query-list-body,
  html body .itinerary-list-body,
  html body .settings-content-box,
  html body .tb-website-main,
  html body .tb-website-form,
  html body .query-bigin-content,
  html body .client-detail-content,
  html body .activity-detail-main{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  /* List/pagination: keep footer visible, but do not add blank space after it. */
  html body .client-footer-bar,
  html body .query-page .client-footer-bar{
    margin-bottom:0!important;
  }

  /* Popup/drawer forms: use only footer-menu height as bottom breathing room. */
  html body .right-drawer,
  html body .tb-web-page-drawer{
    padding-bottom:0!important;
  }

  html body .right-drawer-body,
  html body .drawer-body,
  html body .tb-web-page-drawer-body,
  html body .tb-web-page-form-wrap,
  html body #rightDrawer .right-drawer-body,
  html body .right-drawer.show .right-drawer-body,
  html body .tb-web-page-drawer.show .right-drawer-body{
    padding-bottom:var(--tb-mobile-bottom-space)!important;
    scroll-padding-bottom:var(--tb-mobile-bottom-space)!important;
  }

  html body .drawer-form,
  html body .query-drawer-form,
  html body .activity-form,
  html body .client-drawer-form,
  html body .mtm-popup-form,
  html body .tb-website-content-form,
  html body #rightDrawer .drawer-form,
  html body #rightDrawer .query-drawer-form,
  html body #rightDrawer .client-drawer-form,
  html body #rightDrawer .activity-form,
  html body #rightDrawer .mtm-popup-form,
  html body #rightDrawer .tb-website-content-form,
  html body #rightDrawer .git-slot-popup-form,
  html body #rightDrawer form{
    padding-bottom:12px!important;
  }

  html body .drawer-form-body,
  html body .query-form-body,
  html body .activity-form .drawer-form-body,
  html body .client-drawer-form .drawer-form-body,
  html body .mtm-popup-form .drawer-form-body,
  html body .tb-website-content-form .drawer-form-body,
  html body #rightDrawer .drawer-form-body,
  html body #rightDrawer .query-form-body,
  html body #rightDrawer .activity-form .drawer-form-body,
  html body #rightDrawer .tb-web-page-form-wrap,
  html body #rightDrawer .mtm-popup-form .drawer-form-body{
    padding-bottom:12px!important;
  }

  html body #rightDrawer .drawer-footer,
  html body #rightDrawer .query-drawer-form .drawer-form-foot,
  html body #rightDrawer .activity-form .drawer-footer,
  html body #rightDrawer .quote-drawer-footer,
  html body #rightDrawer .mtm-popup-form .drawer-footer,
  html body #rightDrawer .git-slot-popup-form .drawer-footer,
  html body #rightDrawer .tb-web-page-form-wrap .tb-website-actions,
  html body .right-drawer.show .drawer-footer,
  html body .right-drawer.show .query-drawer-form .drawer-form-foot{
    margin-bottom:calc(8px + var(--tb-mobile-safe-bottom))!important;
  }

  /* Generic modal/popup content also gets compact bottom space only. */
  html body .modal,
  html body .modal-dialog,
  html body .modal-content,
  html body .popupbox,
  html body .popup-box,
  html body .popup-container,
  html body .quote-master-modal-card,
  html body .tb-alert-modal,
  html body .tb-live-modal-box{
    max-height:calc(100dvh - var(--tb-mobile-safe-bottom))!important;
  }

  html body .modal-body,
  html body .popup-body,
  html body .quote-master-modal-body,
  html body .tb-live-modal-body,
  html body .tb-alert-body{
    padding-bottom:12px!important;
    scroll-padding-bottom:var(--tb-mobile-bottom-space)!important;
  }

  html body .modal-footer,
  html body .popup-footer,
  html body .quote-master-modal-footer,
  html body .tb-alert-footer{
    margin-bottom:0!important;
    padding-bottom:calc(10px + var(--tb-mobile-safe-bottom))!important;
  }
}

@media (max-width: 420px){
  :root{
    --tb-mobile-footer-h:68px;
    --tb-mobile-footer-gap:0px;
  }
}

/* Mobile responsive pass 10 - query list compact toolbar
   Hide query view/advanced controls on mobile and keep + Query beside the query search. */
@media (max-width: 767px){
  html body .query-page .client-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) auto!important;
    grid-template-rows:auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:10px 10px!important;
    min-height:56px!important;
    height:auto!important;
    overflow:visible!important;
    background:#fff!important;
    position:relative!important;
    z-index:2147481500!important;
  }

  /* On query list mobile, remove view dropdown and advanced-search button as requested. */
  html body .query-page .client-view-wrap,
  html body .query-page .tbqas-open-btn,
  html body .query-page .tbqas-clear-btn,
  html body .query-page .client-bulk-bar{
    display:none!important;
  }

  /* Let the search form and create button become direct grid items. */
  html body .query-page .client-toolbar .left-tools{
    display:contents!important;
    width:auto!important;
    min-width:0!important;
    gap:0!important;
  }

  html body .query-page .query-custom-search,
  html body .query-page .client-custom-search{
    grid-column:1!important;
    grid-row:1!important;
    order:unset!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    flex:1 1 auto!important;
    margin:0!important;
    height:36px!important;
    z-index:2147481515!important;
  }

  html body .query-page .query-custom-search input,
  html body .query-page .client-custom-search input{
    height:36px!important;
    min-height:36px!important;
    font-size:16px!important;
    padding-left:13px!important;
    padding-right:42px!important;
    color:#0f172a!important;
    background:#fff!important;
  }

  html body .query-page .query-custom-search button,
  html body .query-page .client-custom-search button{
    right:8px!important;
    top:6px!important;
  }

  html body .query-page .client-toolbar .right-tools.client-right-tools,
  html body .query-page .client-toolbar .client-right-tools{
    grid-column:2!important;
    grid-row:1!important;
    order:unset!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:0!important;
    position:relative!important;
    z-index:2147481515!important;
  }

  html body .query-page .client-create-wrap{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    position:relative!important;
  }

  html body .query-page .client-create-wrap .create-btn.client-main-create,
  html body .query-page .client-create-wrap .client-main-create,
  html body .query-page .client-main-create,
  html body .query-page .create-btn.client-main-create{
    height:36px!important;
    min-height:36px!important;
    min-width:82px!important;
    max-width:96px!important;
    padding:0 13px!important;
    border-radius:19px!important;
    font-size:13px!important;
    line-height:36px!important;
    white-space:nowrap!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    box-shadow:0 6px 14px rgba(15,177,93,.18)!important;
  }

  /* No import/export/more menus on mobile query toolbar. */
  html body .query-page .client-create-arrow,
  html body .query-page .client-create-menu,
  html body .query-page .client-more-wrap,
  html body .query-page .client-more-menu{
    display:none!important;
  }

  html body .query-page .client-body{
    border-top:1px solid #e5edf3!important;
  }
}

@media (max-width: 380px){
  html body .query-page .client-toolbar{
    gap:6px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }

  html body .query-page .client-create-wrap .create-btn.client-main-create,
  html body .query-page .client-create-wrap .client-main-create,
  html body .query-page .client-main-create,
  html body .query-page .create-btn.client-main-create{
    min-width:76px!important;
    max-width:86px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    font-size:12px!important;
  }
}

/* Mobile responsive pass 11 - hide query checkbox column
   Query list mobile should start directly from Query ID; bulk checkbox column is desktop-only. */
@media (max-width: 768px){
  html body .query-page .query-table th.check-col,
  html body .query-page .query-table tbody tr > td:first-child:not(.client-empty){
    display:none!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    padding:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  html body .query-page .query-table .query-check-all,
  html body .query-page .query-table .query-row-check{
    display:none!important;
  }

  html body .query-page .query-table th:nth-child(2),
  html body .query-page .query-table tbody tr > td:nth-child(2){
    padding-left:14px!important;
  }

  html body .query-page .query-table{
    min-width:720px!important;
  }
}

@media (max-width: 420px){
  html body .query-page .query-table{
    min-width:690px!important;
  }
}

/* Mobile responsive pass 12 - Query list app-card view
   PC/tablet desktop stays unchanged. Only the query table becomes card-style on mobile. */
@media (max-width: 768px){
  html body .query-page .client-body{
    background:#f4f7fb!important;
    overflow:hidden!important;
  }

  html body .query-page .client-list-area{
    background:#f4f7fb!important;
    padding:8px 10px 0!important;
    overflow:hidden!important;
  }

  html body .query-page .client-table-wrap{
    background:transparent!important;
    border:0!important;
    box-shadow:none!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body .query-page .query-table,
  html body .query-page .client-table.query-table,
  html body .query-page table.query-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    border:0!important;
    background:transparent!important;
    border-collapse:separate!important;
    border-spacing:0!important;
  }

  html body .query-page .query-table thead,
  html body .query-page .query-table thead tr,
  html body .query-page .query-table thead th{
    display:none!important;
  }

  html body .query-page .query-table tbody{
    display:block!important;
    width:100%!important;
  }

  html body .query-page .query-table tbody tr{
    display:grid!important;
    grid-template-columns:minmax(0, 1fr) auto!important;
    gap:7px 10px!important;
    width:100%!important;
    margin:0 0 10px!important;
    padding:12px 12px 11px!important;
    border:1px solid #e6edf5!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 7px 18px rgba(15,23,42,.055)!important;
    overflow:hidden!important;
    position:relative!important;
  }

  html body .query-page .query-table tbody tr:hover > td{
    background:transparent!important;
  }

  html body .query-page .query-table tbody tr > td{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:600!important;
    text-align:right!important;
    white-space:normal!important;
    overflow:visible!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="select"],
  html body .query-page .query-table tbody tr > td:first-child:not(.client-empty){
    display:none!important;
  }

  html body .query-page .query-table tbody tr > td:not([data-col="query_code"]):not([data-col="query"]):not([data-col="service_type"]):not([data-col="actions"]):not(.client-empty)::before{
    content:attr(data-label)!important;
    flex:0 0 auto!important;
    max-width:46%!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:700!important;
    letter-spacing:.01em!important;
    text-align:left!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="query_code"],
  html body .query-page .query-table tbody tr > td[data-col="query"]{
    grid-column:1!important;
    justify-content:flex-start!important;
    text-align:left!important;
    order:1!important;
    font-size:15px!important;
    font-weight:800!important;
    color:#0b1220!important;
    padding-right:4px!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="query"]{
    order:2!important;
    font-size:13px!important;
    font-weight:700!important;
    color:#334155!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="service_type"]{
    grid-column:2!important;
    grid-row:1!important;
    order:1!important;
    justify-content:flex-end!important;
    align-self:start!important;
    text-align:right!important;
    max-width:145px!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="query_type"],
  html body .query-page .query-table tbody tr > td[data-col="customer_name"],
  html body .query-page .query-table tbody tr > td[data-col="party"],
  html body .query-page .query-table tbody tr > td[data-col="travel"],
  html body .query-page .query-table tbody tr > td[data-col="travel_date"],
  html body .query-page .query-table tbody tr > td[data-col="value"],
  html body .query-page .query-table tbody tr > td[data-col="pax"],
  html body .query-page .query-table tbody tr > td[data-col="stage"],
  html body .query-page .query-table tbody tr > td[data-col="stage_group"],
  html body .query-page .query-table tbody tr > td[data-col="priority"],
  html body .query-page .query-table tbody tr > td[data-col="owner_id"],
  html body .query-page .query-table tbody tr > td[data-col="owner_name"],
  html body .query-page .query-table tbody tr > td[data-col="created_at"],
  html body .query-page .query-table tbody tr > td[data-col="created_by"],
  html body .query-page .query-table tbody tr > td[data-col="updated_at"],
  html body .query-page .query-table tbody tr > td[data-col="updated_by"]{
    grid-column:1 / -1!important;
    order:10!important;
    padding-top:2px!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="customer_name"],
  html body .query-page .query-table tbody tr > td[data-col="party"]{
    order:4!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="travel"],
  html body .query-page .query-table tbody tr > td[data-col="travel_date"]{
    order:5!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="value"],
  html body .query-page .query-table tbody tr > td[data-col="pax"]{
    order:6!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="stage"],
  html body .query-page .query-table tbody tr > td[data-col="priority"]{
    order:7!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="owner_id"],
  html body .query-page .query-table tbody tr > td[data-col="owner_name"],
  html body .query-page .query-table tbody tr > td[data-col="created_at"]{
    order:8!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="actions"],
  html body .query-page .query-table tbody tr > td.client-row-actions{
    grid-column:1 / -1!important;
    order:99!important;
    justify-content:flex-end!important;
    gap:8px!important;
    padding-top:9px!important;
    margin-top:2px!important;
    border-top:1px solid #eef2f7!important;
    width:100%!important;
    text-align:right!important;
  }

  html body .query-page .query-table .client-name-link,
  html body .query-page .query-table .query-code-badge{
    color:#0b1220!important;
    font-size:15px!important;
    font-weight:800!important;
    text-decoration:none!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  html body .query-page .query-table .query-title-main{
    color:#334155!important;
    font-size:13px!important;
    font-weight:700!important;
    line-height:1.35!important;
    overflow-wrap:anywhere!important;
  }

  html body .query-page .query-table .query-service-badge,
  html body .query-page .query-table .query-type-badge,
  html body .query-page .query-table .query-stage-badge,
  html body .query-page .query-table .query-priority-badge,
  html body .query-page .query-table .query-value-badge{
    max-width:100%!important;
    white-space:nowrap!important;
  }

  html body .query-page .query-table tbody tr > td[data-col="party"] > div,
  html body .query-page .query-table tbody tr > td[data-col="party"] small,
  html body .query-page .query-table .crm-owner-badge{
    min-width:0!important;
    text-align:right!important;
  }

  html body .query-page .query-table tbody tr > td.client-row-actions button{
    width:32px!important;
    height:32px!important;
    border-radius:12px!important;
    background:#f1f7fb!important;
    color:#0f172a!important;
    font-size:15px!important;
  }

  html body .query-page .query-table tbody tr > td.client-row-actions button:hover,
  html body .query-page .query-table tbody tr > td.client-row-actions button:focus{
    background:#e6fff3!important;
    color:var(--tb-accent)!important;
  }

  html body .query-page .query-table tbody tr > td.client-empty{
    display:flex!important;
    grid-column:1 / -1!important;
    justify-content:center!important;
    align-items:center!important;
    min-height:130px!important;
    border-radius:16px!important;
    text-align:center!important;
    color:#64748b!important;
    background:#fff!important;
  }
}

@media (max-width: 420px){
  html body .query-page .client-list-area{
    padding-left:8px!important;
    padding-right:8px!important;
  }

  html body .query-page .query-table tbody tr{
    border-radius:15px!important;
    padding:11px 11px 10px!important;
  }
}

/* Mobile query detail refinements - v13 */
.tb-query-wa-mobile-close{display:none!important;}

@media (max-width: 767px){
  html body .query-detail-page .client-detail-header{
    display:block!important;
    padding:12px 12px 10px!important;
    gap:0!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
  }

  html body .query-detail-page .client-detail-left{
    display:grid!important;
    grid-template-columns:24px 38px minmax(0,1fr)!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
  }

  html body .query-detail-page .client-back{
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    border:0!important;
    background:transparent!important;
  }

  html body .query-detail-page .client-avatar-lg{
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    font-size:14px!important;
  }

  html body .query-detail-page .client-detail-title{
    min-width:0!important;
    display:block!important;
  }

  html body .query-detail-page .client-detail-title h2{
    margin:0!important;
    font-size:16px!important;
    line-height:20px!important;
    max-height:40px!important;
    overflow:hidden!important;
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    word-break:normal!important;
    overflow-wrap:anywhere!important;
  }

  html body .query-detail-page .client-detail-title button,
  html body .query-detail-page .client-detail-actions .detail-round-btn,
  html body .query-detail-page .client-detail-actions .detail-more-wrap,
  html body .query-detail-page .client-detail-actions .detail-nav-btn{
    display:none!important;
  }

  html body .query-detail-page .client-detail-sub{
    display:grid!important;
    grid-template-columns:auto minmax(0,1fr) minmax(0,1fr)!important;
    gap:5px 8px!important;
    margin-top:4px!important;
    width:100%!important;
    overflow:hidden!important;
  }

  html body .query-detail-page .client-detail-sub span,
  html body .query-detail-page .client-detail-sub a{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12px!important;
    line-height:17px!important;
  }

  html body .query-detail-page .client-detail-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    margin-top:10px!important;
    min-width:0!important;
  }

  html body .query-detail-page .query-status-badge{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 12px!important;
    border-radius:17px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:13px!important;
    line-height:34px!important;
    font-weight:800!important;
  }

  html body .query-detail-page .send-mail-btn{
    width:auto!important;
    max-width:148px!important;
    min-width:118px!important;
    height:34px!important;
    min-height:34px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    padding:0 12px!important;
    border-radius:17px!important;
    font-size:13px!important;
    line-height:34px!important;
    font-weight:800!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .query-detail-page .query-stagebar{
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body .query-detail-page .query-stagebar::-webkit-scrollbar{display:none!important;}

  html body .query-detail-page .client-detail-tabs{
    position:sticky!important;
    top:0!important;
    z-index:45!important;
    height:44px!important;
    min-height:44px!important;
    background:#fff!important;
    border-top:1px solid #eef2f7!important;
    border-bottom:1px solid #e6edf5!important;
    box-shadow:0 4px 12px rgba(15,23,42,.05)!important;
    align-items:center!important;
  }

  html body .query-detail-page .client-detail-tabs > a,
  html body .query-detail-page .client-detail-tabs .query-tabs-more-btn{
    height:42px!important;
    min-height:42px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    padding:0!important;
    border-bottom:2px solid transparent!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:42px!important;
    font-weight:800!important;
    text-decoration:none!important;
    white-space:nowrap!important;
  }

  html body .query-detail-page .client-detail-tabs > a.active,
  html body .query-detail-page .client-detail-tabs .query-tabs-more-wrap.active .query-tabs-more-btn{
    color:var(--tb-accent)!important;
    border-bottom-color:var(--tb-accent)!important;
  }

  html body .query-detail-page .client-detail-tabs span{
    min-width:18px!important;
    height:18px!important;
    padding:0 5px!important;
    border-radius:10px!important;
    background:#dceefb!important;
    color:#0f172a!important;
    font-size:11px!important;
    line-height:18px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  html body .query-detail-page .query-tabs-more-wrap{
    margin:0!important;
    padding:0!important;
  }

  html body .query-detail-page .query-tabs-more-wrap .query-tabs-more-menu{
    display:none!important;
  }

  html body .query-detail-page .tb-query-mobile-tab-extra{
    flex:0 0 auto!important;
    white-space:nowrap!important;
  }

  html body .query-detail-page .client-detail-content{
    padding-bottom:calc(70px + env(safe-area-inset-bottom))!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close{
    display:none!important;
  }

  html body .query-detail-page .client-detail-content .tb-whatsapp-page.query-embed{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:100dvh!important;
    z-index:2600!important;
    border:0!important;
    border-radius:0!important;
    background:#f4f7fb!important;
    display:block!important;
    overflow:hidden!important;
    padding-top:50px!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    height:50px!important;
    z-index:2605!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 14px!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
    box-shadow:0 6px 18px rgba(15,23,42,.08)!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close a{
    width:34px!important;
    height:34px!important;
    border-radius:17px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#0f172a!important;
    background:#f1f5f9!important;
    text-decoration:none!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close span{
    font-size:16px!important;
    font-weight:800!important;
    color:#0f172a!important;
    line-height:20px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-center{
    width:100%!important;
    height:calc(100dvh - 50px)!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    border:0!important;
    border-radius:0!important;
    background:#f4f7fb!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-chat-head{
    height:58px!important;
    min-height:58px!important;
    flex:0 0 58px!important;
    padding:0 12px!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-chat-person{
    min-width:0!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-chat-person h3{
    max-width:calc(100vw - 92px)!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow:auto!important;
    padding:12px!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:62px!important;
    padding:8px 10px calc(8px + env(safe-area-inset-bottom))!important;
    background:#fff!important;
    border-top:1px solid #e6edf5!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose textarea{
    font-size:16px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-contact-panel,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-file-preview-modal,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-crm-pdf-modal{
    z-index:2700!important;
  }
}

@media (max-width: 390px){
  html body .query-detail-page .client-detail-actions{
    grid-template-columns:minmax(0,1fr) 108px!important;
    gap:6px!important;
  }
  html body .query-detail-page .send-mail-btn{
    min-width:108px!important;
    max-width:108px!important;
    padding:0 8px!important;
    font-size:12px!important;
  }
  html body .query-detail-page .query-status-badge{
    padding:0 8px!important;
    font-size:12px!important;
  }
}

/* Mobile query detail v14 fixes
   - Hide redundant More tab when mobile extra tabs are shown.
   - Keep WhatsApp full-screen chat above CRM header/footer and keep compose visible. */
@media (max-width: 767px){
  html body .query-detail-page .client-detail-tabs .query-tabs-more-wrap{
    display:none!important;
    visibility:hidden!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  html body .query-detail-page .client-detail-content .tb-whatsapp-page.query-embed{
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    z-index:2147483500!important;
    box-sizing:border-box!important;
    padding-top:52px!important;
    padding-bottom:0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:#f4f7fb!important;
    display:block!important;
    overflow:hidden!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    height:52px!important;
    z-index:2147483510!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 14px!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
    box-shadow:0 6px 18px rgba(15,23,42,.10)!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close a{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#0f172a!important;
    background:#f1f5f9!important;
    text-decoration:none!important;
    font-size:16px!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close span{
    display:block!important;
    font-size:16px!important;
    font-weight:900!important;
    color:#0f172a!important;
    line-height:20px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-center{
    width:100%!important;
    height:calc(100dvh - 52px)!important;
    max-height:calc(100dvh - 52px)!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    border:0!important;
    border-radius:0!important;
    background:#f4f7fb!important;
    overflow:hidden!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-chat-head{
    height:56px!important;
    min-height:56px!important;
    flex:0 0 56px!important;
    padding:0 12px!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
    z-index:1!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow:auto!important;
    padding:12px!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose{
    position:relative!important;
    flex:0 0 auto!important;
    height:auto!important;
    min-height:64px!important;
    z-index:2!important;
    padding:8px 10px calc(10px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    background:#fff!important;
    border-top:1px solid #e6edf5!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-attach,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-send{
    flex:0 0 auto!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose textarea{
    flex:1 1 auto!important;
    min-width:0!important;
    height:40px!important;
    max-height:96px!important;
    font-size:16px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-attach-menu{
    bottom:58px!important;
    z-index:2147483520!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-contact-panel,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-file-preview-modal,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-crm-pdf-modal{
    z-index:2147483530!important;
  }
}

/* Mobile query detail v15 fixes
   - Activity tab: sub-tabs first row, add buttons second row.
   - WhatsApp tab: true fullscreen chat, hide CRM header/footer while open, keep close + composer visible. */
@media (max-width: 767px){
  html body .query-detail-page .activity-box{
    overflow:visible!important;
  }

  html body .query-detail-page .activity-toolbar{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:10px!important;
    width:100%!important;
    padding:10px 10px 12px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-toolbar .activity-pills{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    gap:6px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    padding:0 2px 2px!important;
    box-sizing:border-box!important;
  }
  html body .query-detail-page .activity-toolbar .activity-pills::-webkit-scrollbar{display:none!important;}

  html body .query-detail-page .activity-toolbar .activity-pills a{
    flex:1 0 auto!important;
    min-width:96px!important;
    height:34px!important;
    padding:0 12px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions{
    order:2!important;
    width:100%!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    overflow:visible!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions button{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 8px!important;
    border-radius:19px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
    font-size:13px!important;
    line-height:38px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }

  html body.tb-wa-query-fullscreen-open{
    overflow:hidden!important;
    height:100dvh!important;
    max-height:100dvh!important;
  }

  html body.tb-wa-query-fullscreen-open .crm-header,
  html body.tb-wa-query-fullscreen-open .main-menu{
    display:none!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  html body.tb-wa-query-fullscreen-open .content-area{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#f4f7fb!important;
    z-index:2147483550!important;
  }

  html body.tb-wa-query-fullscreen-open .query-detail-page,
  html body.tb-wa-query-fullscreen-open .client-detail-page,
  html body.tb-wa-query-fullscreen-open .client-detail-main,
  html body.tb-wa-query-fullscreen-open .client-detail-content{
    position:static!important;
    width:100%!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#f4f7fb!important;
  }

  html body.tb-wa-query-fullscreen-open .client-detail-header,
  html body.tb-wa-query-fullscreen-open .query-stagebar,
  html body.tb-wa-query-fullscreen-open .client-detail-tabs,
  html body.tb-wa-query-fullscreen-open .query-detail-resizer,
  html body.tb-wa-query-fullscreen-open .query-bigin-left,
  html body.tb-wa-query-fullscreen-open .client-detail-sidebar{
    display:none!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close,
  html body #tbQueryWaMobileClose.tb-query-wa-mobile-close{
    position:fixed!important;
    top:0!important;
    left:0!important;
    right:0!important;
    width:100vw!important;
    height:54px!important;
    min-height:54px!important;
    z-index:2147483647!important;
    display:flex!important;
    visibility:visible!important;
    opacity:1!important;
    align-items:center!important;
    gap:10px!important;
    padding:0 14px!important;
    margin:0!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
    box-shadow:0 6px 18px rgba(15,23,42,.10)!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close a,
  html body #tbQueryWaMobileClose.tb-query-wa-mobile-close a{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#0f172a!important;
    background:#f1f5f9!important;
    text-decoration:none!important;
    font-size:16px!important;
  }

  html body .query-detail-page .tb-query-wa-mobile-close span,
  html body #tbQueryWaMobileClose.tb-query-wa-mobile-close span{
    display:block!important;
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:16px!important;
    font-weight:900!important;
    color:#0f172a!important;
    line-height:20px!important;
  }

  html body .query-detail-page .client-detail-content .tb-whatsapp-page.query-embed,
  html body .tb-whatsapp-page.query-embed{
    position:fixed!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-height:100dvh!important;
    min-height:0!important;
    z-index:2147483600!important;
    display:flex!important;
    flex-direction:column!important;
    box-sizing:border-box!important;
    padding:54px 0 0 0!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    background:#f4f7fb!important;
    overflow:hidden!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-center,
  html body .tb-whatsapp-page.query-embed .tb-wa-center{
    width:100%!important;
    height:calc(100dvh - 54px)!important;
    max-height:calc(100dvh - 54px)!important;
    min-height:0!important;
    flex:1 1 auto!important;
    display:flex!important;
    flex-direction:column!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#efe7dd url('../images/whatsappbg.png') center center/420px auto repeat!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-chat-head,
  html body .tb-whatsapp-page.query-embed .tb-wa-chat-head{
    height:58px!important;
    min-height:58px!important;
    flex:0 0 58px!important;
    padding:0 12px!important;
    background:#fff!important;
    border-bottom:1px solid #e6edf5!important;
    z-index:3!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-messages,
  html body .tb-whatsapp-page.query-embed .tb-wa-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:12px 12px 14px!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose,
  html body .tb-whatsapp-page.query-embed .tb-wa-compose{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    flex:0 0 auto!important;
    width:100%!important;
    height:auto!important;
    min-height:68px!important;
    z-index:5!important;
    padding:9px 10px calc(12px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    background:#fff!important;
    border-top:1px solid #e6edf5!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    box-sizing:border-box!important;
    visibility:visible!important;
    opacity:1!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-attach,
  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-send,
  html body .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-attach,
  html body .tb-whatsapp-page.query-embed .tb-wa-compose .tb-wa-send{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-compose textarea,
  html body .tb-whatsapp-page.query-embed .tb-wa-compose textarea{
    flex:1 1 auto!important;
    min-width:0!important;
    height:42px!important;
    max-height:96px!important;
    display:block!important;
    font-size:16px!important;
  }

  html body .query-detail-page .tb-whatsapp-page.query-embed .tb-wa-attach-menu,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu{
    bottom:64px!important;
    z-index:2147483646!important;
  }
}

@media (max-width: 374px){
  html body .query-detail-page .activity-toolbar .activity-actions{
    grid-template-columns:1fr!important;
  }
  html body .query-detail-page .activity-toolbar .activity-actions button{
    height:36px!important;
    line-height:36px!important;
  }
}

/* Mobile query detail v16 fixes
   - Supplier Comm drawer must be single-column and not overflow/cut on mobile.
   - Activity tab must not force page wider than viewport; tabs/actions stay in clean rows. */
@media (max-width: 767px){
  /* Supplier communication popup/drawer */
  html body #rightDrawer .supplier-comm-pop,
  html body .right-drawer.show .supplier-comm-pop{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    padding:14px 12px 12px!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body #rightDrawer .supplier-comm-top,
  html body .right-drawer.show .supplier-comm-top{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0 0 12px!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-top label,
  html body .right-drawer.show .supplier-comm-top label{
    display:block!important;
    width:100%!important;
    margin:0 0 7px!important;
    padding:0!important;
    font-size:13px!important;
    line-height:18px!important;
    text-align:left!important;
  }

  html body #rightDrawer .supplier-comm-top select,
  html body .right-drawer.show .supplier-comm-top select{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:40px!important;
    font-size:16px!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-grid,
  html body .right-drawer.show .supplier-comm-grid{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:12px!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-panel,
  html body .right-drawer.show .supplier-comm-panel,
  html body #rightDrawer .supplier-comm-service-panel,
  html body #rightDrawer .supplier-comm-supplier-panel{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:0!important;
    max-height:34dvh!important;
    overflow:auto!important;
    box-sizing:border-box!important;
    border-radius:12px!important;
  }

  html body #rightDrawer .supplier-comm-panel h4,
  html body .right-drawer.show .supplier-comm-panel h4{
    top:0!important;
    padding:11px 12px!important;
    font-size:14px!important;
    line-height:18px!important;
  }

  html body #rightDrawer .supplier-comm-tools,
  html body .right-drawer.show .supplier-comm-tools{
    top:40px!important;
    display:flex!important;
    flex-wrap:wrap!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:8px!important;
    padding:9px 10px!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-selectall,
  html body .right-drawer.show .supplier-comm-selectall{
    flex:0 0 auto!important;
    max-width:100%!important;
  }

  html body #rightDrawer .supplier-comm-search,
  html body .right-drawer.show .supplier-comm-search{
    flex:1 1 180px!important;
    min-width:0!important;
    width:100%!important;
    height:38px!important;
    font-size:16px!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-service,
  html body #rightDrawer .supplier-comm-supplier,
  html body .right-drawer.show .supplier-comm-service,
  html body .right-drawer.show .supplier-comm-supplier{
    width:auto!important;
    max-width:calc(100% - 18px)!important;
    min-width:0!important;
    margin:9px!important;
    padding:11px!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer .supplier-comm-service span,
  html body #rightDrawer .supplier-comm-supplier span,
  html body .right-drawer.show .supplier-comm-service span,
  html body .right-drawer.show .supplier-comm-supplier span{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  html body #rightDrawer .supplier-comm-service em,
  html body #rightDrawer .supplier-comm-supplier em,
  html body .right-drawer.show .supplier-comm-service em,
  html body .right-drawer.show .supplier-comm-supplier em{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    overflow-wrap:anywhere!important;
  }

  html body #rightDrawer .supplier-comm-footer,
  html body .right-drawer.show .supplier-comm-footer{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    top:auto!important;
    transform:none!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    align-items:center!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:14px 0 0!important;
    padding:12px 0 calc(8px + env(safe-area-inset-bottom,0px))!important;
    border-top:1px solid #eef2f7!important;
    box-sizing:border-box!important;
    background:#fff!important;
    z-index:2!important;
  }

  html body #rightDrawer .supplier-comm-channel,
  html body .right-drawer.show .supplier-comm-channel{
    grid-column:1 / -1!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:wrap!important;
    gap:14px!important;
    width:100%!important;
    margin:0!important;
    min-width:0!important;
  }

  html body #rightDrawer .supplier-comm-footer .drawer-cancel,
  html body #rightDrawer .supplier-comm-footer .drawer-save,
  html body .right-drawer.show .supplier-comm-footer .drawer-cancel,
  html body .right-drawer.show .supplier-comm-footer .drawer-save{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 10px!important;
    box-sizing:border-box!important;
    white-space:nowrap!important;
  }

  /* Activity tab layout: stop horizontal page overflow from desktop table widths. */
  html body .query-detail-page .client-detail-content:has(.activity-box){
    overflow-x:hidden!important;
  }

  html body .query-detail-page .activity-box{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    border-radius:12px!important;
  }

  html body .query-detail-page .activity-toolbar{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    padding:10px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body .query-detail-page .activity-toolbar .activity-pills{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-toolbar .activity-pills a{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:34px!important;
    padding:0 8px!important;
    border-radius:18px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:13px!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions button{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    border-radius:20px!important;
    padding:0 8px!important;
    font-size:13px!important;
    line-height:38px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }

  html body .query-detail-page .activity-title.clean-title{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:13px 14px!important;
    box-sizing:border-box!important;
    background:#fff!important;
  }

  html body .query-detail-page table.activity-detail-table,
  html body .query-detail-page .activity-detail-table{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
    border-collapse:collapse!important;
    display:table!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    background:#fff!important;
  }

  html body .query-detail-page .activity-detail-table th,
  html body .query-detail-page .activity-detail-table td{
    min-width:0!important;
    max-width:none!important;
    padding:10px 8px!important;
    box-sizing:border-box!important;
    font-size:12px!important;
    line-height:17px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .query-detail-page .activity-detail-table th:nth-child(1),
  html body .query-detail-page .activity-detail-table td:nth-child(1){width:38%!important;}
  html body .query-detail-page .activity-detail-table th:nth-child(2),
  html body .query-detail-page .activity-detail-table td:nth-child(2){width:28%!important;}
  html body .query-detail-page .activity-detail-table th:nth-child(3),
  html body .query-detail-page .activity-detail-table td:nth-child(3){width:24%!important;}
  html body .query-detail-page .activity-detail-table th:nth-child(4),
  html body .query-detail-page .activity-detail-table td:nth-child(4),
  html body .query-detail-page .activity-detail-table th:nth-child(5),
  html body .query-detail-page .activity-detail-table td:nth-child(5){display:none!important;}

  html body .query-detail-page .activity-detail-table .detail-empty-cell{
    display:table-cell!important;
    width:100%!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:visible!important;
    padding:34px 12px!important;
    color:#64748b!important;
  }
}

@media (max-width: 374px){
  html body .query-detail-page .activity-toolbar .activity-actions{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  html body .query-detail-page .activity-toolbar .activity-actions button{
    font-size:12px!important;
    padding:0 6px!important;
  }
}

/* v17: Activity tab action buttons were getting clipped because desktop CSS fixes
   the toolbar height. Keep this mobile-only and let the toolbar grow naturally. */
@media (max-width: 768px){
  html body .query-detail-page .activity-toolbar,
  html body .client-detail-page .activity-toolbar,
  html body .company-detail-page .activity-toolbar{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    align-items:stretch!important;
    overflow:visible!important;
    padding:10px!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions,
  html body .client-detail-page .activity-toolbar .activity-actions,
  html body .company-detail-page .activity-toolbar .activity-actions{
    height:auto!important;
    min-height:40px!important;
    max-height:none!important;
    overflow:visible!important;
    margin-top:0!important;
    margin-bottom:0!important;
  }

  html body .query-detail-page .activity-toolbar .activity-actions button,
  html body .client-detail-page .activity-toolbar .activity-actions button,
  html body .company-detail-page .activity-toolbar .activity-actions button{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:38px!important;
    min-height:38px!important;
    max-height:38px!important;
    line-height:1!important;
    overflow:visible!important;
    white-space:nowrap!important;
  }

  html body .query-detail-page .activity-title.clean-title,
  html body .client-detail-page .activity-title.clean-title,
  html body .company-detail-page .activity-title.clean-title{
    clear:both!important;
    margin-top:0!important;
  }
}

/* Mobile itinerary list v18
   - Keep list/cards scrollable above fixed bottom menu.
   - Hide Add Itinerary via PDF on mobile.
   - Show search + package filter clearly on mobile. */
@media (max-width: 768px){
  html body #itineraryListPage.itinerary-module-page,
  html body .itinerary-module-page#itineraryListPage{
    height:calc(100dvh - 50px - var(--tb-mobile-footer-h,68px) - env(safe-area-inset-bottom,0px))!important;
    min-height:0!important;
    max-height:calc(100dvh - 50px - var(--tb-mobile-footer-h,68px) - env(safe-area-inset-bottom,0px))!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
    background:#f4f7fb!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar,
  html body #itineraryListPage.itinerary-module-page.client-page .content-toolbar.client-toolbar,
  html body #itineraryListPage.itinerary-module-page .client-toolbar{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    display:grid!important;
    grid-template-columns:1fr!important;
    grid-template-rows:auto auto!important;
    gap:8px!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    padding:10px 10px 9px!important;
    overflow:visible!important;
    background:#fff!important;
    border-bottom:1px solid #e5edf5!important;
    z-index:80!important;
  }

  html body #itineraryListPage.itinerary-module-page .left-tools{
    order:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:8px!important;
    align-items:center!important;
    justify-content:stretch!important;
    overflow:visible!important;
    margin:0!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-top-search,
  html body #itineraryListPage.itinerary-module-page form.itinerary-top-search,
  html body #itineraryListPage.itinerary-module-page .client-custom-search.itinerary-top-search{
    grid-column:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 8px 0 13px!important;
    display:flex!important;
    align-items:center!important;
    border:1px solid #d8e3ee!important;
    border-radius:999px!important;
    background:#fff!important;
    box-shadow:none!important;
    overflow:hidden!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-top-search input{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 4px!important;
    color:#0f172a!important;
    caret-color:#0f172a!important;
    font-size:16px!important;
    line-height:36px!important;
    background:transparent!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-top-search input::placeholder{
    color:#718096!important;
    opacity:1!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-top-search button,
  html body #itineraryListPage.itinerary-module-page .itinerary-top-search a{
    flex:0 0 30px!important;
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    padding:0!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-package-filter-form{
    grid-column:2!important;
    width:auto!important;
    min-width:0!important;
    max-width:42vw!important;
    display:flex!important;
    align-items:center!important;
    margin:0!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-package-filter-form select{
    display:block!important;
    width:auto!important;
    min-width:116px!important;
    max-width:42vw!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 30px 0 12px!important;
    border-radius:999px!important;
    border:1px solid #d8e3ee!important;
    background-color:#fff!important;
    color:#0f172a!important;
    font-size:14px!important;
    font-weight:800!important;
  }

  html body #itineraryListPage.itinerary-module-page .right-tools,
  html body #itineraryListPage.itinerary-module-page .client-right-tools,
  html body #itineraryListPage.itinerary-module-page .right-tools.client-right-tools{
    order:2!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
    margin:0!important;
    padding:0 1px 2px!important;
  }
  html body #itineraryListPage.itinerary-module-page .right-tools::-webkit-scrollbar{display:none!important;}

  html body #itineraryListPage.itinerary-module-page .ai-pdf-itinerary-btn{
    display:none!important;
    visibility:hidden!important;
    width:0!important;
    min-width:0!important;
    max-width:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-list-view-settings-wrap{
    flex:0 0 auto!important;
    order:99!important;
  }

  html body #itineraryListPage.itinerary-module-page .ai-itinerary-create-btn,
  html body #itineraryListPage.itinerary-module-page .right-tools > .tb-primary-btn{
    flex:0 0 auto!important;
    height:34px!important;
    min-height:34px!important;
    max-height:34px!important;
    padding:0 13px!important;
    font-size:13px!important;
    line-height:34px!important;
    white-space:nowrap!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-body,
  html body #itineraryListPage.itinerary-module-page .itinerary-list-body-wrap{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    padding:0!important;
    margin:0!important;
    background:#f4f7fb!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-list-area{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    max-height:none!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#f4f7fb!important;
    padding:0!important;
  }

  html body #itineraryListPage.itinerary-view-box .itinerary-box-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    padding:12px 12px 16px!important;
    background:#f4f7fb!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-view-list .client-table-wrap{
    flex:1 1 auto!important;
    min-height:0!important;
    height:100%!important;
    max-height:none!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-bar{
    flex:0 0 44px!important;
    height:44px!important;
    min-height:44px!important;
    max-height:44px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:10px!important;
    padding:0 10px!important;
    background:#fff!important;
    border-top:1px solid #e5edf5!important;
    box-shadow:0 -8px 18px rgba(15,23,42,.06)!important;
    z-index:35!important;
    margin:0!important;
    overflow:hidden!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-stats{
    display:none!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-pages{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:12px!important;
    margin:0!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-pages > span{
    display:none!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-pages select{
    height:30px!important;
    min-height:30px!important;
    border-radius:16px!important;
    font-size:13px!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-pages a{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    border-radius:15px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  html body #itineraryListPage.itinerary-module-page .client-footer-pages strong{
    white-space:nowrap!important;
    font-size:12px!important;
  }
}

@media (max-width: 390px){
  html body #itineraryListPage.itinerary-module-page .left-tools{
    grid-template-columns:minmax(0,1fr) 112px!important;
    gap:6px!important;
  }
  html body #itineraryListPage.itinerary-module-page .itinerary-package-filter-form,
  html body #itineraryListPage.itinerary-module-page .itinerary-package-filter-form select{
    max-width:112px!important;
    min-width:112px!important;
  }
  html body #itineraryListPage.itinerary-module-page .ai-itinerary-create-btn,
  html body #itineraryListPage.itinerary-module-page .right-tools > .tb-primary-btn{
    padding-left:11px!important;
    padding-right:11px!important;
    font-size:12px!important;
  }
}

/* Mobile itinerary toolbar v19: search/filter first row, buttons second row, settings menu visible */
@media (max-width: 768px){
  html body #itineraryListPage.itinerary-module-page .content-toolbar,
  html body #itineraryListPage.itinerary-module-page.client-page .content-toolbar.client-toolbar,
  html body #itineraryListPage.itinerary-module-page .client-toolbar,
  html body #itineraryListPage.itinerary-module-page .content-toolbar.client-toolbar{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:9px 10px 9px!important;
    overflow:visible!important;
    position:relative!important;
    z-index:250!important;
    background:#fff!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .left-tools{
    order:1!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(108px,132px)!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
    margin:0!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-top-search,
  html body #itineraryListPage.itinerary-module-page .content-toolbar form.itinerary-top-search,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .client-custom-search.itinerary-top-search{
    grid-column:1!important;
    grid-row:1!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    margin:0!important;
    padding:0 8px 0 12px!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-top-search input{
    display:block!important;
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:36px!important;
    font-size:16px!important;
    line-height:36px!important;
    color:#0f172a!important;
    caret-color:#0f172a!important;
    white-space:nowrap!important;
    text-overflow:ellipsis!important;
    overflow:hidden!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-package-filter-form{
    grid-column:2!important;
    grid-row:1!important;
    display:flex!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-package-filter-form select{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    font-size:14px!important;
    padding-left:12px!important;
    padding-right:28px!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .right-tools,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .client-right-tools,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .right-tools.client-right-tools{
    order:2!important;
    display:flex!important;
    flex-direction:row!important;
    align-items:center!important;
    justify-content:flex-end!important;
    flex-wrap:nowrap!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:36px!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    position:relative!important;
    z-index:260!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .ai-pdf-itinerary-btn{
    display:none!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .ai-itinerary-create-btn,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .right-tools > .tb-primary-btn{
    flex:0 0 auto!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    line-height:36px!important;
    padding:0 13px!important;
    font-size:13px!important;
    white-space:nowrap!important;
    margin:0!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-list-view-settings-wrap{
    order:99!important;
    flex:0 0 auto!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:relative!important;
    overflow:visible!important;
    z-index:99980!important;
  }

  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-list-view-settings-btn{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    min-height:36px!important;
    border-radius:10px!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-list-view-menu,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-list-view-menu{
    right:10px!important;
    top:98px!important;
    width:184px!important;
    max-width:calc(100vw - 20px)!important;
    z-index:99999!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-module-page .itinerary-list-view-menu.open,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-list-view-menu.open{
    display:block!important;
    position:fixed!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
  }
}

@media (max-width: 390px){
  html body #itineraryListPage.itinerary-module-page .content-toolbar .left-tools{
    grid-template-columns:minmax(0,1fr) 106px!important;
    gap:7px!important;
  }
  html body #itineraryListPage.itinerary-module-page .content-toolbar .ai-itinerary-create-btn,
  html body #itineraryListPage.itinerary-module-page .content-toolbar .right-tools > .tb-primary-btn{
    height:34px!important;
    min-height:34px!important;
    line-height:34px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    font-size:12px!important;
  }
  html body #itineraryListPage.itinerary-module-page .content-toolbar .itinerary-list-view-settings-btn{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
  }
}

/* Mobile itinerary list v20: convert list-table into clean app-style cards.
   Desktop/PC remains unchanged. */
@media (max-width: 768px){
  html body #itineraryListPage.itinerary-view-list .client-table-wrap{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    height:100%!important;
    min-height:0!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#f4f7fb!important;
    padding:10px 10px 14px!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table,
  html body #itineraryListPage.itinerary-view-list .itinerary-table.crm-table,
  html body #itineraryListPage.itinerary-view-list .itinerary-table.client-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    table-layout:auto!important;
    border-collapse:separate!important;
    border-spacing:0!important;
    background:transparent!important;
    border:0!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table colgroup,
  html body #itineraryListPage.itinerary-view-list .itinerary-table thead{
    display:none!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr{
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr!important;
    grid-auto-rows:auto!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    margin:0 0 12px!important;
    padding:12px!important;
    box-sizing:border-box!important;
    background:#fff!important;
    border:1px solid #e4edf5!important;
    border-radius:16px!important;
    box-shadow:0 8px 22px rgba(15,23,42,.045)!important;
    position:relative!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td{
    display:block!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
    text-align:left!important;
    vertical-align:top!important;
    line-height:1.25!important;
    white-space:normal!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(1){
    grid-column:1!important;
    grid-row:1 / span 2!important;
    align-self:start!important;
    width:70px!important;
    min-width:70px!important;
    max-width:70px!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(2){
    grid-column:2 / 4!important;
    grid-row:1!important;
    padding-right:80px!important;
    align-self:start!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(3){
    grid-column:2 / 4!important;
    grid-row:2!important;
    align-self:start!important;
    padding-right:8px!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4),
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(5),
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(6){
    grid-row:3!important;
    min-height:58px!important;
    padding:8px!important;
    background:#f8fafc!important;
    border:1px solid #edf2f7!important;
    border-radius:12px!important;
    color:#111827!important;
    font-size:12px!important;
    font-weight:800!important;
    overflow:hidden!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4){grid-column:1!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(5){grid-column:2!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(6){grid-column:3!important;}

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4)::before,
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(5)::before,
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(6)::before{
    display:block!important;
    margin:0 0 4px!important;
    color:#64748b!important;
    font-size:10px!important;
    font-weight:900!important;
    line-height:1!important;
    letter-spacing:.03em!important;
    text-transform:uppercase!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4)::before{content:'Duration'!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(5)::before{content:'Pax'!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(6)::before{content:'Total Price'!important;}

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(7),
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td.itinerary-row-actions{
    position:absolute!important;
    right:10px!important;
    top:10px!important;
    z-index:4!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:5px!important;
    padding:0!important;
    white-space:nowrap!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-thumb{
    width:66px!important;
    height:58px!important;
    min-width:66px!important;
    max-width:66px!important;
    margin:0!important;
    border-radius:12px!important;
    display:block!important;
    background-size:cover!important;
    background-position:center!important;
    box-shadow:0 3px 10px rgba(15,23,42,.08)!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-title{
    display:-webkit-box!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
    max-width:100%!important;
    margin:0!important;
    color:#0f172a!important;
    font-size:15px!important;
    font-weight:900!important;
    line-height:1.2!important;
    text-decoration:none!important;
    overflow:hidden!important;
    word-break:break-word!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-desc{
    display:none!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-dests{
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:5px!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-dests span,
  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-website-live-badge.list,
  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-package-type-badge.row{
    display:inline-flex!important;
    align-items:center!important;
    width:auto!important;
    max-width:100%!important;
    height:22px!important;
    min-height:22px!important;
    padding:0 8px!important;
    margin:0!important;
    border-radius:999px!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:22px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4) small{
    display:block!important;
    margin-top:2px!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:700!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-passenger-text,
  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-price{
    display:block!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12px!important;
    font-weight:900!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .itinerary-row-price{
    color:#00a85a!important;
    line-height:1.25!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table td.itinerary-row-actions a,
  html body #itineraryListPage.itinerary-view-list .itinerary-table td.itinerary-row-actions button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:30px!important;
    min-width:30px!important;
    height:30px!important;
    min-height:30px!important;
    padding:0!important;
    margin:0!important;
    border-radius:10px!important;
    border:1px solid #dbe4ef!important;
    background:#fff!important;
    color:#64748b!important;
    box-shadow:0 4px 12px rgba(15,23,42,.06)!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table td.itinerary-row-actions a:first-child{
    color:#00a85a!important;
    border-color:#c9f0dc!important;
    background:#ecfdf5!important;
  }

  html body #itineraryListPage.itinerary-view-list .itinerary-table .client-empty.itinerary-empty-table,
  html body #itineraryListPage.itinerary-view-list .itinerary-table .client-empty.itinerary-empty-table div{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:18px!important;
    text-align:center!important;
  }

  html body #itineraryListPage.itinerary-view-list .client-footer-bar{
    flex:0 0 44px!important;
  }
}

@media (max-width: 390px){
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr{
    grid-template-columns:1fr 1fr!important;
  }
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(1){grid-column:1!important;grid-row:1!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(2){grid-column:2!important;grid-row:1!important;padding-right:70px!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(3){grid-column:1 / 3!important;grid-row:2!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(4){grid-column:1!important;grid-row:3!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(5){grid-column:2!important;grid-row:3!important;}
  html body #itineraryListPage.itinerary-view-list .itinerary-table tbody tr > td:nth-child(6){grid-column:1 / 3!important;grid-row:4!important;}
}

/* Mobile responsive pass 21 - itinerary builder header/actions and cover media picker
   Mobile-only fixes; desktop/PC CSS remains unaffected. */
@media (max-width: 767px){
  html body #itineraryBuilderPage,
  html body .itinerary-builder-page{
    display:block!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:16px 14px calc(var(--tb-mobile-footer-h,66px) + 14px)!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
    background:#f4f8fb!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-main,
  html body .itinerary-builder-page .itinerary-builder-main{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head,
  html body .itinerary-builder-page .itinerary-builder-head{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    margin:0 0 16px!important;
    padding:0!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head > div:first-child,
  html body .itinerary-builder-page .itinerary-builder-head > div:first-child{
    width:100%!important;
    min-width:0!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head h1,
  html body .itinerary-builder-page .itinerary-builder-head h1{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    color:#061127!important;
    font-size:22px!important;
    font-weight:900!important;
    line-height:1.2!important;
    letter-spacing:-.02em!important;
    white-space:normal!important;
    word-break:break-word!important;
  }

  html body #itineraryBuilderPage .itinerary-subline,
  html body .itinerary-builder-page .itinerary-subline{
    display:flex!important;
    align-items:center!important;
    flex-wrap:wrap!important;
    gap:7px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin-top:9px!important;
    color:#475569!important;
    font-size:13px!important;
    line-height:1.25!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-small-badges,
  html body .itinerary-builder-page .itinerary-small-badges{
    display:inline-flex!important;
    flex-wrap:wrap!important;
    gap:6px!important;
    min-width:0!important;
    max-width:100%!important;
  }

  html body #itineraryBuilderPage .itinerary-small-badges span,
  html body .itinerary-builder-page .itinerary-small-badges span{
    max-width:calc(100vw - 92px)!important;
    height:28px!important;
    min-height:28px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    background:#fff!important;
    border:1px solid #dce7f1!important;
    color:#0f172a!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:28px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    display:grid!important;
    grid-template-columns:42px minmax(0,1fr) minmax(0,1fr)!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-layout-settings-btn{
    grid-column:1!important;
    width:42px!important;
    min-width:42px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0!important;
    border-radius:12px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#fff!important;
    border:1px solid #dbe6f0!important;
    color:#475569!important;
    box-shadow:0 5px 14px rgba(15,23,42,.05)!important;
    position:relative!important;
    z-index:25!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right a.tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right a.tb-primary-btn{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 10px!important;
    margin:0!important;
    border-radius:10px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:38px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-shadow:0 7px 16px rgba(0,168,90,.14)!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .tb-primary-btn i,
  html body .itinerary-builder-page .itinerary-head-right .tb-primary-btn i{
    flex:0 0 auto!important;
    font-size:13px!important;
    line-height:1!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-preview-btn{
    background:#fff!important;
    color:#059669!important;
    border:1px solid #bfe8d4!important;
    box-shadow:0 5px 14px rgba(15,23,42,.04)!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-costing-summary-btn{
    background:#00a85a!important;
    color:#fff!important;
    border-color:#00a85a!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn),
  html body .itinerary-builder-page .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn){
    grid-column:2 / 4!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax{
    grid-column:1 / -1!important;
    display:block!important;
    width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0 2px!important;
    text-align:right!important;
    color:#0f172a!important;
    font-size:12px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax strong,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax strong{
    display:block!important;
    font-size:12px!important;
    font-weight:900!important;
    color:#0f172a!important;
  }

  html body #itineraryBuilderPage .itinerary-layout-menu,
  html body .itinerary-builder-page .itinerary-layout-menu{
    position:absolute!important;
    top:44px!important;
    left:0!important;
    right:auto!important;
    width:min(288px,calc(100vw - 28px))!important;
    max-width:calc(100vw - 28px)!important;
    z-index:2147483055!important;
    border-radius:14px!important;
    box-shadow:0 18px 42px rgba(15,23,42,.18)!important;
  }

  html body #itineraryBuilderPage .itinerary-cover,
  html body .itinerary-builder-page .itinerary-cover{
    width:100%!important;
    height:210px!important;
    min-height:210px!important;
    max-width:100%!important;
    margin:0 0 16px!important;
    border-radius:16px!important;
    overflow:hidden!important;
    box-shadow:0 8px 24px rgba(15,23,42,.08), inset 0 -80px 110px rgba(15,23,42,.12)!important;
  }

  html body #itineraryBuilderPage .itinerary-cover > button,
  html body .itinerary-builder-page .itinerary-cover > button{
    top:14px!important;
    right:14px!important;
    max-width:calc(100% - 28px)!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 12px!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#0f172a!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:34px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-shadow:0 8px 20px rgba(15,23,42,.16)!important;
  }

  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    border-radius:16px!important;
    overflow:hidden!important;
    background:#fff!important;
    border:1px solid #dfe8f2!important;
    box-shadow:0 6px 18px rgba(15,23,42,.04)!important;
  }

  html body #itineraryBuilderPage .itinerary-left-day-tabs,
  html body .itinerary-builder-page .itinerary-left-day-tabs,
  html body #itineraryBuilderPage .itinerary-days-wrap,
  html body .itinerary-builder-page .itinerary-days-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  /* Full-screen mobile cover image picker. */
  html body #itineraryCoverMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryCoverMediaPickerModal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    background:rgba(15,23,42,.52)!important;
    z-index:2147483600!important;
    overflow:hidden!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal{
    position:relative!important;
    inset:auto!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    z-index:2147483601!important;
    background:#fff!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-head{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:58px!important;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px!important;
    display:flex!important;
    align-items:center!important;
    gap:10px!important;
    border-bottom:1px solid #e6eef6!important;
    background:#fff!important;
    position:sticky!important;
    top:0!important;
    z-index:5!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-head > div{
    min-width:0!important;
    flex:1 1 auto!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-head b{
    display:block!important;
    font-size:16px!important;
    font-weight:900!important;
    color:#111827!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-head span{
    display:block!important;
    max-width:100%!important;
    margin-top:2px!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:1.3!important;
    white-space:normal!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-head button{
    flex:0 0 36px!important;
    width:36px!important;
    min-width:36px!important;
    height:36px!important;
    min-height:36px!important;
    border-radius:12px!important;
    background:#f1f5f9!important;
    color:#334155!important;
    font-size:22px!important;
    line-height:36px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-tabs{
    flex:0 0 auto!important;
    height:auto!important;
    min-height:46px!important;
    padding:8px 14px!important;
    gap:8px!important;
    display:flex!important;
    align-items:center!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-tabs::-webkit-scrollbar{display:none!important;}

  html body #itineraryCoverMediaPickerModal .crm-media-tabs button{
    flex:0 0 auto!important;
    height:32px!important;
    min-height:32px!important;
    padding:0 14px!important;
    border-radius:999px!important;
    font-size:12px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 16px)!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#fff!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-panel.active{
    display:block!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-search-row{
    position:sticky!important;
    top:0!important;
    z-index:4!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 104px!important;
    gap:8px!important;
    margin:0 0 8px!important;
    padding:0 0 8px!important;
    background:#fff!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-search-row input{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    font-size:16px!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-search-row .drawer-save{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    font-size:13px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-provider-line{
    margin:2px 0 10px!important;
    color:#64748b!important;
    font-size:11px!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    padding-bottom:6px!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-card{
    width:100%!important;
    min-width:0!important;
    border-radius:13px!important;
    overflow:hidden!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-card img{
    width:100%!important;
    height:116px!important;
    object-fit:cover!important;
    display:block!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-card-body{
    padding:9px!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-card-body b{
    height:34px!important;
    min-height:34px!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:17px!important;
    color:#0f172a!important;
    overflow:hidden!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-photo-by{
    height:16px!important;
    min-height:16px!important;
    margin-top:4px!important;
    color:#64748b!important;
    font-size:10px!important;
    line-height:16px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-card-actions{
    display:flex!important;
    width:100%!important;
    gap:0!important;
    margin-top:8px!important;
  }

  html body #itineraryCoverMediaPickerModal .itinerary-cover-preview-btn,
  html body #itineraryCoverMediaPickerModal .crm-media-preview-btn{
    display:none!important;
  }

  html body #itineraryCoverMediaPickerModal .itinerary-cover-use-btn,
  html body #itineraryCoverMediaPickerModal .crm-media-use-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    flex:1 1 auto!important;
    min-width:0!important;
    max-width:100%!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 8px!important;
    border-radius:999px!important;
    background:#00a85a!important;
    color:#fff!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:34px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-upload-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 96px!important;
    gap:8px!important;
    width:100%!important;
  }

  html body #itineraryCoverMediaPickerModal .crm-media-modal-foot{
    display:none!important;
  }
}

@media (max-width: 360px){
  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    grid-template-columns:40px minmax(0,1fr)!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-costing-summary-btn{
    grid-column:1 / -1!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn),
  html body .itinerary-builder-page .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn){
    grid-column:1 / -1!important;
  }
}

/* Mobile responsive pass 22 - itinerary builder mobile polishing and media popup stacking
   Mobile-only changes; desktop/PC remains unaffected. */
@media (max-width: 767px){
  /* When any CRM media picker is open, lift the content stack above mobile header/footer. */
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"])) .crm-layout,
  html body:has(.crm-media-preview-backdrop:not([style*="display:none"]):not([style*="display: none"])) .crm-layout,
  html body .content-area:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"])),
  html body .content-area:has(.crm-media-preview-backdrop:not([style*="display:none"]):not([style*="display: none"])){
    position:relative!important;
    z-index:2147483600!important;
  }

  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"])) .crm-header,
  html body:has(.crm-media-preview-backdrop:not([style*="display:none"]):not([style*="display: none"])) .crm-header,
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"])) .main-menu,
  html body:has(.crm-media-preview-backdrop:not([style*="display:none"]):not([style*="display: none"])) .main-menu{
    z-index:1!important;
  }

  /* All image/media picker popups must be true full-screen on mobile. */
  html body .crm-media-modal-backdrop,
  html body #crmMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryCoverMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryDayMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryStandardMediaPickerModal.crm-media-modal-backdrop,
  html body #itinerarySightseeingMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryTransportMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryHotelMediaPickerModal.crm-media-modal-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    background:#fff!important;
    z-index:2147483640!important;
    overflow:hidden!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal,
  html body #crmMediaPickerModal .crm-media-modal,
  html body #itineraryCoverMediaPickerModal .crm-media-modal,
  html body #itineraryDayMediaPickerModal .crm-media-modal,
  html body #itineraryStandardMediaPickerModal .crm-media-modal,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal,
  html body #itineraryTransportMediaPickerModal .crm-media-modal,
  html body #itineraryHotelMediaPickerModal .crm-media-modal{
    position:relative!important;
    inset:auto!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#fff!important;
    z-index:2147483641!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head,
  html body #crmMediaPickerModal .crm-media-modal-head,
  html body #itineraryCoverMediaPickerModal .crm-media-modal-head,
  html body #itineraryDayMediaPickerModal .crm-media-modal-head,
  html body #itineraryStandardMediaPickerModal .crm-media-modal-head,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal-head,
  html body #itineraryTransportMediaPickerModal .crm-media-modal-head,
  html body #itineraryHotelMediaPickerModal .crm-media-modal-head{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    min-height:54px!important;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    position:relative!important;
    top:auto!important;
    z-index:2147483642!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head > div{
    min-width:0!important;
    flex:1 1 auto!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head b{
    display:block!important;
    max-width:100%!important;
    color:#0f172a!important;
    font-size:16px!important;
    font-weight:900!important;
    line-height:1.2!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head span{
    display:block!important;
    max-width:100%!important;
    margin-top:2px!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:1.25!important;
    white-space:normal!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head button,
  html body #crmMediaPickerModal .crm-media-modal-head button,
  html body #itineraryCoverMediaPickerModal .crm-media-modal-head button,
  html body #itineraryDayMediaPickerModal .crm-media-modal-head button,
  html body #itineraryStandardMediaPickerModal .crm-media-modal-head button,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal-head button,
  html body #itineraryTransportMediaPickerModal .crm-media-modal-head button,
  html body #itineraryHotelMediaPickerModal .crm-media-modal-head button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 38px!important;
    width:38px!important;
    min-width:38px!important;
    height:38px!important;
    min-height:38px!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    border-radius:12px!important;
    background:#eef4f8!important;
    color:#334155!important;
    font-size:25px!important;
    font-weight:700!important;
    line-height:38px!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    z-index:2147483643!important;
  }

  html body .crm-media-modal-backdrop .crm-media-tabs{
    flex:0 0 auto!important;
    position:relative!important;
    z-index:2!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    padding:8px 14px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body .crm-media-modal-backdrop .crm-media-tabs::-webkit-scrollbar{display:none!important;}

  html body .crm-media-modal-backdrop .crm-media-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 14px)!important;
    background:#fff!important;
  }

  html body .crm-media-modal-backdrop .crm-media-search-row{
    position:sticky!important;
    top:0!important;
    z-index:4!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 98px!important;
    gap:8px!important;
    margin:0 0 8px!important;
    padding:0 0 8px!important;
    background:#fff!important;
  }

  html body .crm-media-modal-backdrop .crm-media-search-row input{
    min-width:0!important;
    width:100%!important;
    height:38px!important;
    font-size:16px!important;
  }

  html body .crm-media-modal-backdrop .crm-media-search-row .drawer-save{
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 10px!important;
    white-space:nowrap!important;
  }

  html body .crm-media-modal-backdrop .crm-media-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    width:100%!important;
    min-width:0!important;
    padding-bottom:8px!important;
  }

  html body .crm-media-modal-backdrop .crm-media-card-actions{
    display:flex!important;
    gap:0!important;
    width:100%!important;
    margin-top:8px!important;
  }

  html body .crm-media-modal-backdrop .crm-media-preview-btn,
  html body .crm-media-modal-backdrop .itinerary-cover-preview-btn,
  html body .crm-media-modal-backdrop button[onclick*="Preview"],
  html body .crm-media-modal-backdrop button[onclick*="preview"]{
    display:none!important;
  }

  html body .crm-media-modal-backdrop .crm-media-use-btn,
  html body .crm-media-modal-backdrop .itinerary-cover-use-btn,
  html body .crm-media-modal-backdrop .drawer-save:not(.crm-media-preview-btn){
    white-space:nowrap!important;
    word-break:keep-all!important;
  }

  html body .crm-media-modal-backdrop .crm-media-card-actions .drawer-save,
  html body .crm-media-modal-backdrop .crm-media-use-btn,
  html body .crm-media-modal-backdrop .itinerary-cover-use-btn{
    flex:1 1 auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 10px!important;
    border-radius:999px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:34px!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-foot{
    flex:0 0 auto!important;
    padding:8px 14px calc(env(safe-area-inset-bottom,0px) + 8px)!important;
    background:#fff!important;
    border-top:1px solid #e6eef6!important;
    z-index:3!important;
  }

  /* Builder page bottom padding should match the mobile footer height only. */
  html body #itineraryBuilderPage,
  html body .itinerary-builder-page{
    padding-bottom:calc(var(--tb-mobile-footer-h,66px) + var(--tb-mobile-safe-bottom,0px) + 8px)!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h,66px) + var(--tb-mobile-safe-bottom,0px) + 8px)!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-main,
  html body .itinerary-builder-page .itinerary-builder-main{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    margin-bottom:calc(var(--tb-mobile-footer-h,66px) + var(--tb-mobile-safe-bottom,0px) + 8px)!important;
  }

  /* Hide layout settings on mobile and keep Day Listing Left behavior by default. */
  html body #itineraryBuilderPage .itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-layout-menu,
  html body .itinerary-builder-page .itinerary-layout-menu{
    display:none!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn),
  html body .itinerary-builder-page .itinerary-head-right .tb-primary-btn:not(.tb-preview-btn):not(.tb-costing-summary-btn){
    grid-column:auto!important;
    width:100%!important;
    min-width:0!important;
    height:36px!important;
    min-height:36px!important;
    padding:0 7px!important;
    border-radius:10px!important;
    font-size:11px!important;
    font-weight:900!important;
    line-height:36px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn i{
    margin-right:0!important;
    font-size:12px!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax{
    grid-column:1 / -1!important;
    text-align:right!important;
    margin-top:0!important;
    padding:0!important;
  }

  /* Force the mobile day list to behave like the left-day layout even if desktop preference is top. */
  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell,
  html body #itineraryBuilderPage.itinerary-layout-top .itinerary-days-shell,
  html body .itinerary-builder-page.itinerary-layout-top .itinerary-days-shell{
    display:block!important;
    grid-template-columns:1fr!important;
    gap:0!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-left-day-tabs,
  html body .itinerary-builder-page .itinerary-left-day-tabs,
  html body #itineraryBuilderPage.itinerary-layout-top .itinerary-left-day-tabs,
  html body .itinerary-builder-page.itinerary-layout-top .itinerary-left-day-tabs{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#fff!important;
    overflow:visible!important;
    position:static!important;
  }

  html body #itineraryBuilderPage .itinerary-left-day-tabs-head,
  html body .itinerary-builder-page .itinerary-left-day-tabs-head{
    padding:16px 14px 12px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
  }

  html body #itineraryBuilderPage .itinerary-left-day-tab-wrap,
  html body .itinerary-builder-page .itinerary-left-day-tab-wrap{
    display:block!important;
    margin:0!important;
    padding:12px 14px!important;
    border:0!important;
    border-bottom:1px solid #e6eef6!important;
    border-radius:0!important;
    background:#fff!important;
  }

  html body #itineraryBuilderPage .itinerary-left-day-tab-wrap.active,
  html body .itinerary-builder-page .itinerary-left-day-tab-wrap.active{
    border-left:3px solid #00a85a!important;
    background:#eafff3!important;
    padding-left:11px!important;
  }

  html body #itineraryBuilderPage .itinerary-days-wrap,
  html body .itinerary-builder-page .itinerary-days-wrap{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-day-card,
  html body .itinerary-builder-page .itinerary-day-card,
  html body #itineraryBuilderPage.itinerary-layout-top .itinerary-day-card,
  html body .itinerary-builder-page.itinerary-layout-top .itinerary-day-card{
    display:none!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
  }

  html body #itineraryBuilderPage .itinerary-day-card.active,
  html body #itineraryBuilderPage .itinerary-day-card.active-left,
  html body .itinerary-builder-page .itinerary-day-card.active,
  html body .itinerary-builder-page .itinerary-day-card.active-left{
    display:block!important;
  }

  html body #itineraryBuilderPage .itinerary-day-head,
  html body .itinerary-builder-page .itinerary-day-head{
    padding:13px 14px!important;
    min-height:0!important;
    height:auto!important;
    border-bottom:1px solid #e6eef6!important;
    background:#fff!important;
  }

  html body #itineraryBuilderPage .day-head-actions,
  html body .itinerary-builder-page .day-head-actions{
    display:flex!important;
    flex-wrap:wrap!important;
    gap:8px!important;
    width:100%!important;
    min-width:0!important;
    justify-content:flex-start!important;
  }

  html body #itineraryBuilderPage .day-head-actions select,
  html body .itinerary-builder-page .day-head-actions select,
  html body #itineraryBuilderPage .day-head-actions button,
  html body .itinerary-builder-page .day-head-actions button{
    min-width:0!important;
    flex:1 1 130px!important;
    max-width:100%!important;
  }

  /* Day detail: image first, text below. */
  html body #itineraryBuilderPage .itinerary-day-info,
  html body .itinerary-builder-page .itinerary-day-info,
  html body #itineraryBuilderPage .itinerary-day-info.itinerary-day-info-gallery-mode,
  html body .itinerary-builder-page .itinerary-day-info.itinerary-day-info-gallery-mode{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:0!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body #itineraryBuilderPage .itinerary-day-info .day-info-img,
  html body .itinerary-builder-page .itinerary-day-info .day-info-img{
    order:1!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:178px!important;
    min-height:178px!important;
    border-radius:0!important;
    background-size:cover!important;
    background-position:center!important;
  }

  html body #itineraryBuilderPage .itinerary-day-info .itinerary-day-content,
  html body .itinerary-builder-page .itinerary-day-info .itinerary-day-content{
    order:2!important;
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:14px!important;
    margin:0!important;
    background:#fff!important;
  }

  html body #itineraryBuilderPage .itinerary-day-gallery,
  html body .itinerary-builder-page .itinerary-day-gallery{
    order:1!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    padding:0 0 10px!important;
  }

  html body #itineraryBuilderPage .itinerary-day-gallery-img,
  html body .itinerary-builder-page .itinerary-day-gallery-img{
    width:100%!important;
    height:120px!important;
    border-radius:12px!important;
    overflow:hidden!important;
  }

  /* Drag reorder is unreliable on touch; hide drag handle and make service cards clean. */
  html body #itineraryBuilderPage .service-drag-handle,
  html body .itinerary-builder-page .service-drag-handle{
    display:none!important;
  }

  html body #itineraryBuilderPage .itinerary-service-list,
  html body .itinerary-builder-page .itinerary-service-list{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    padding:12px 0 0!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card,
  html body #itineraryBuilderPage .itinerary-service-card.service-gallery-mode,
  html body .itinerary-builder-page .itinerary-service-card,
  html body .itinerary-builder-page .itinerary-service-card.service-gallery-mode{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:12px!important;
    margin:0!important;
    border-radius:16px!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-thumb,
  html body .itinerary-builder-page .itinerary-service-card .service-thumb{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
    height:168px!important;
    min-height:168px!important;
    border-radius:12px!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-icon,
  html body .itinerary-builder-page .itinerary-service-card .service-icon{
    order:2!important;
    margin:0!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-info,
  html body .itinerary-builder-page .itinerary-service-card .service-info{
    order:3!important;
    width:100%!important;
    min-width:0!important;
    padding:0!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-actions,
  html body .itinerary-builder-page .itinerary-service-card .service-actions{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    z-index:8!important;
  }

  html body #itineraryBuilderPage .itinerary-service-gallery,
  html body .itinerary-builder-page .itinerary-service-gallery{
    order:1!important;
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
  }

  html body #itineraryBuilderPage .itinerary-service-gallery-img,
  html body .itinerary-builder-page .itinerary-service-gallery-img{
    width:100%!important;
    flex-basis:auto!important;
    height:126px!important;
    border-radius:12px!important;
    overflow:hidden!important;
  }
}

@media (max-width: 360px){
  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn{
    font-size:10px!important;
    padding:0 5px!important;
  }
}

/* Mobile responsive pass 23 - itinerary builder app polish, preview popup, service forms
   Mobile only; desktop/PC CSS remains unaffected. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:66px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
  }

  /* Itinerary builder page should never hide behind the bottom mobile menu. */
  html body #itineraryBuilderPage,
  html body .itinerary-builder-page,
  html body .itinerary-builder-main,
  html body .itinerary-days-shell,
  html body .itinerary-cost-sidebar,
  html body .content-area:has(#itineraryBuilderPage),
  html body .content-area:has(.itinerary-builder-page){
    padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 14px)!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 14px)!important;
    overflow:visible!important;
  }

  /* Header buttons: hide layout/gear; keep Preview + Costing + Edit in one compact app row. */
  html body .itinerary-layout-settings-btn,
  html body .itinerary-layout-menu,
  html body #itineraryBuilderPage .itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-layout-menu,
  html body .itinerary-builder-page .itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-layout-menu{
    display:none!important;
    width:0!important;
    height:0!important;
    min-width:0!important;
    max-width:0!important;
    min-height:0!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head,
  html body .itinerary-builder-page .itinerary-builder-head{
    display:flex!important;
    flex-direction:column!important;
    gap:12px!important;
    padding:16px 14px 12px!important;
    margin:0!important;
    width:100%!important;
    max-width:100%!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    display:flex!important;
    flex-direction:row!important;
    flex-wrap:nowrap!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
    padding:0!important;
    margin:0!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-preview-btn,
  html body #itineraryBuilderPage .itinerary-head-right .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right .tb-costing-summary-btn{
    flex:1 1 0!important;
    width:auto!important;
    min-width:0!important;
    max-width:33.333%!important;
    height:34px!important;
    min-height:34px!important;
    padding:0 5px!important;
    margin:0!important;
    border-radius:9px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    font-size:10.5px!important;
    font-weight:900!important;
    line-height:34px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn i,
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn i,
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn i{
    display:none!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax{
    flex:0 0 100%!important;
    width:100%!important;
    max-width:100%!important;
    order:30!important;
    text-align:right!important;
    margin:4px 0 0!important;
    padding:0!important;
  }

  /* Some itineraries have extra buttons like Journey/Supplier Cost; keep them from breaking the app row. */
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn[href*="journey"],
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn[href*="journey"]{
    display:none!important;
  }

  /* Left-day app behavior remains default on mobile. */
  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell,
  html body #itineraryBuilderPage.itinerary-layout-top .itinerary-days-shell,
  html body .itinerary-builder-page.itinerary-layout-top .itinerary-days-shell{
    display:block!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* Day detail: clean app card; media first, content below. */
  html body #itineraryBuilderPage .itinerary-day-info,
  html body .itinerary-builder-page .itinerary-day-info,
  html body #itineraryBuilderPage .itinerary-day-info.itinerary-day-info-gallery-mode,
  html body .itinerary-builder-page .itinerary-day-info.itinerary-day-info-gallery-mode{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    border-radius:14px!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body #itineraryBuilderPage .itinerary-day-info .day-info-img,
  html body .itinerary-builder-page .itinerary-day-info .day-info-img,
  html body #itineraryBuilderPage .itinerary-day-gallery,
  html body .itinerary-builder-page .itinerary-day-gallery{
    order:1!important;
  }

  html body #itineraryBuilderPage .itinerary-day-info .itinerary-day-content,
  html body .itinerary-builder-page .itinerary-day-info .itinerary-day-content{
    order:2!important;
    width:100%!important;
    max-width:100%!important;
    padding:14px!important;
    margin:0!important;
  }

  /* Service cards: app-style, edit visible by default; drag handle hidden. */
  html body #itineraryBuilderPage .service-drag-handle,
  html body .itinerary-builder-page .service-drag-handle,
  html body #itineraryBuilderPage [draggable="true"] .service-drag-handle,
  html body .itinerary-builder-page [draggable="true"] .service-drag-handle{
    display:none!important;
    pointer-events:none!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card,
  html body #itineraryBuilderPage .itinerary-service-card.service-gallery-mode,
  html body .itinerary-builder-page .itinerary-service-card,
  html body .itinerary-builder-page .itinerary-service-card.service-gallery-mode{
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:12px!important;
    margin:0 0 12px!important;
    border-radius:16px!important;
    background:#fff!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-thumb,
  html body .itinerary-builder-page .itinerary-service-card .service-thumb,
  html body #itineraryBuilderPage .itinerary-service-card .itinerary-service-gallery,
  html body .itinerary-builder-page .itinerary-service-card .itinerary-service-gallery{
    order:1!important;
    width:100%!important;
    max-width:100%!important;
    margin:0 0 10px!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-info,
  html body .itinerary-builder-page .itinerary-service-card .service-info{
    order:3!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-actions,
  html body .itinerary-builder-page .itinerary-service-card .service-actions{
    position:absolute!important;
    top:10px!important;
    right:10px!important;
    z-index:12!important;
    display:flex!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    pointer-events:auto!important;
  }

  html body #itineraryBuilderPage .itinerary-service-card .service-edit-btn,
  html body .itinerary-builder-page .itinerary-service-card .service-edit-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    opacity:1!important;
    visibility:visible!important;
    transform:none!important;
    height:32px!important;
    min-height:32px!important;
    padding:0 13px!important;
    border-radius:999px!important;
    background:#fff!important;
    border:1px solid #dbe7f1!important;
    color:#008c72!important;
    font-size:12px!important;
    font-weight:900!important;
    box-shadow:0 8px 20px rgba(15,23,42,.10)!important;
  }

  /* Service add/edit popup forms: one field per row, 100% width. */
  html body .popupBox .drawer-form,
  html body .right-drawer .drawer-form,
  html body .drawer-form[class*="itinerary"],
  html body form.itinerary-hotel-form,
  html body form.itinerary-sightseeing-form,
  html body form.itinerary-transport-form,
  html body form.itinerary-flight-form,
  html body form.itinerary-bus-form,
  html body form.itinerary-train-form,
  html body form.itinerary-cruise-form{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding-left:14px!important;
    padding-right:14px!important;
    padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }

  html body .popupBox .drawer-form-row,
  html body .right-drawer .drawer-form-row,
  html body .drawer-form[class*="itinerary"] .drawer-form-row,
  html body form.itinerary-hotel-form .drawer-form-row,
  html body form.itinerary-sightseeing-form .drawer-form-row,
  html body form.itinerary-transport-form .drawer-form-row,
  html body form.itinerary-flight-form .drawer-form-row,
  html body form.itinerary-bus-form .drawer-form-row,
  html body form.itinerary-train-form .drawer-form-row,
  html body form.itinerary-cruise-form .drawer-form-row{
    display:block!important;
    grid-template-columns:1fr!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    gap:0!important;
  }

  html body .popupBox .drawer-field-row,
  html body .right-drawer .drawer-field-row,
  html body .drawer-form[class*="itinerary"] .drawer-field-row,
  html body form.itinerary-hotel-form .drawer-field-row,
  html body form.itinerary-sightseeing-form .drawer-field-row,
  html body form.itinerary-transport-form .drawer-field-row,
  html body form.itinerary-flight-form .drawer-field-row,
  html body form.itinerary-bus-form .drawer-field-row,
  html body form.itinerary-train-form .drawer-field-row,
  html body form.itinerary-cruise-form .drawer-field-row{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    flex:0 0 100%!important;
    margin:0 0 13px!important;
    padding:0!important;
    box-sizing:border-box!important;
  }

  html body .popupBox .drawer-field-row label,
  html body .right-drawer .drawer-field-row label,
  html body .drawer-form[class*="itinerary"] .drawer-field-row label{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0 0 7px!important;
    margin:0!important;
    text-align:left!important;
    white-space:normal!important;
  }

  html body .popupBox .drawer-control,
  html body .right-drawer .drawer-control,
  html body .drawer-form[class*="itinerary"] .drawer-control,
  html body .drawer-form[class*="itinerary"] input,
  html body .drawer-form[class*="itinerary"] select,
  html body .drawer-form[class*="itinerary"] textarea,
  html body form.itinerary-hotel-form input,
  html body form.itinerary-hotel-form select,
  html body form.itinerary-hotel-form textarea,
  html body form.itinerary-sightseeing-form input,
  html body form.itinerary-sightseeing-form select,
  html body form.itinerary-sightseeing-form textarea,
  html body form.itinerary-transport-form input,
  html body form.itinerary-transport-form select,
  html body form.itinerary-transport-form textarea{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
  }

  html body .drawer-form[class*="itinerary"] .select2-container,
  html body form.itinerary-hotel-form .select2-container,
  html body form.itinerary-sightseeing-form .select2-container,
  html body form.itinerary-transport-form .select2-container{
    width:100%!important;
    max-width:100%!important;
  }

  html body .popupBox .drawer-form-footer,
  html body .right-drawer .drawer-form-footer,
  html body .drawer-form[class*="itinerary"] .drawer-form-footer,
  html body .popupBox .drawer-footer,
  html body .right-drawer .drawer-footer{
    position:static!important;
    display:block!important;
    width:100%!important;
    padding:12px 0 0!important;
    margin:0!important;
    background:#fff!important;
    border:0!important;
  }

  html body .popupBox .drawer-footer-actions,
  html body .right-drawer .drawer-footer-actions,
  html body .drawer-form[class*="itinerary"] .drawer-footer-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:9px!important;
    width:100%!important;
    max-width:100%!important;
  }

  html body .popupBox .drawer-footer-actions button,
  html body .right-drawer .drawer-footer-actions button,
  html body .drawer-form[class*="itinerary"] .drawer-footer-actions button,
  html body .drawer-form[class*="itinerary"] .drawer-save,
  html body .drawer-form[class*="itinerary"] .drawer-cancel{
    width:100%!important;
    max-width:100%!important;
    height:42px!important;
    min-height:42px!important;
    border-radius:999px!important;
    white-space:nowrap!important;
  }

  /* Preview itinerary popup: mobile app toolbar, no cost-position dropdown. */
  html body .itdoc-preview-shell{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    max-width:100vw!important;
    min-width:0!important;
    height:calc(100dvh - 58px)!important;
    max-height:calc(100dvh - 58px)!important;
    overflow:hidden!important;
    background:#eef3f7!important;
  }

  html body .itdoc-preview-toolbar,
  html body .ai-cost-preview-toolbar{
    flex:0 0 auto!important;
    display:block!important;
    width:100%!important;
    padding:10px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    position:sticky!important;
    top:0!important;
    z-index:20!important;
  }

  html body .itdoc-cost-position-select{
    display:none!important;
  }

  html body .itdoc-preview-actions{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    align-items:center!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }

  html body .itdoc-preview-actions button{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 4px!important;
    border-radius:999px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:0!important;
    font-size:9.5px!important;
    font-weight:900!important;
    line-height:38px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .itdoc-preview-actions button i{
    display:none!important;
  }

  html body .itdoc-preview-canvas{
    flex:1 1 auto!important;
    width:100%!important;
    min-width:0!important;
    max-width:100vw!important;
    padding:10px!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#eef3f7!important;
  }

  html body #itineraryDocumentPreviewSource{
    width:1080px!important;
    max-width:none!important;
    transform:scale(.34)!important;
    transform-origin:top left!important;
  }

  html body #itineraryDocumentPreviewSource .itdoc-page,
  html body #itineraryDocumentPreviewSource .itdoc-fit{
    max-width:none!important;
  }

  html body .itdoc-wa-modal{
    z-index:2147483600!important;
  }

  /* All global media/image picker popups above header/footer/menu/buttons. */
  html body .crm-media-modal-backdrop,
  html body #crmMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryCoverMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryDayMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryStandardMediaPickerModal.crm-media-modal-backdrop,
  html body #itinerarySightseeingMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryTransportMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryHotelMediaPickerModal.crm-media-modal-backdrop,
  html body .crm-media-preview-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    background:#fff!important;
    z-index:2147483647!important;
    overflow:hidden!important;
    isolation:isolate!important;
  }

  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"]):not([style*="display: none;"])) .crm-header,
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"]):not([style*="display: none;"])) .main-menu,
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"]):not([style*="display: none;"])) .mobile-bottom-menu,
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"]):not([style*="display: none;"])) .crm-mobile-bottom-menu,
  html body:has(.crm-media-modal-backdrop:not([style*="display:none"]):not([style*="display: none"]):not([style*="display: none;"])) .bottom-mobile-menu{
    z-index:0!important;
    pointer-events:none!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal,
  html body #crmMediaPickerModal .crm-media-modal,
  html body #itineraryCoverMediaPickerModal .crm-media-modal,
  html body #itineraryDayMediaPickerModal .crm-media-modal,
  html body #itineraryStandardMediaPickerModal .crm-media-modal,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal,
  html body #itineraryTransportMediaPickerModal .crm-media-modal,
  html body #itineraryHotelMediaPickerModal .crm-media-modal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    border-radius:0!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#fff!important;
    z-index:2147483647!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head,
  html body #crmMediaPickerModal .crm-media-modal-head,
  html body #itineraryCoverMediaPickerModal .crm-media-modal-head,
  html body #itineraryDayMediaPickerModal .crm-media-modal-head,
  html body #itineraryStandardMediaPickerModal .crm-media-modal-head,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal-head,
  html body #itineraryTransportMediaPickerModal .crm-media-modal-head,
  html body #itineraryHotelMediaPickerModal .crm-media-modal-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    flex:0 0 auto!important;
    min-height:56px!important;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    position:sticky!important;
    top:0!important;
    z-index:2147483647!important;
    opacity:1!important;
    visibility:visible!important;
  }

  html body .crm-media-modal-backdrop .crm-media-modal-head button,
  html body #crmMediaPickerModal .crm-media-modal-head button,
  html body #itineraryCoverMediaPickerModal .crm-media-modal-head button,
  html body #itineraryDayMediaPickerModal .crm-media-modal-head button,
  html body #itineraryStandardMediaPickerModal .crm-media-modal-head button,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal-head button,
  html body #itineraryTransportMediaPickerModal .crm-media-modal-head button,
  html body #itineraryHotelMediaPickerModal .crm-media-modal-head button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    min-height:38px!important;
    border-radius:50%!important;
    opacity:1!important;
    visibility:visible!important;
    background:#f1f5f9!important;
    color:#475569!important;
    font-size:24px!important;
    line-height:1!important;
    z-index:2147483647!important;
  }

  html body .crm-media-modal-backdrop .crm-media-panel,
  html body .crm-media-modal-backdrop .crm-media-grid{
    min-height:0!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body .crm-media-modal-backdrop .crm-media-grid{
    padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
  }

  html body .crm-media-modal-backdrop .crm-media-preview-btn,
  html body .crm-media-modal-backdrop .itinerary-cover-preview-btn,
  html body .crm-media-modal-backdrop button[onclick*="Preview"],
  html body .crm-media-modal-backdrop button[onclick*="preview"]{
    display:none!important;
  }

  html body .crm-media-modal-backdrop .crm-media-use-btn,
  html body .crm-media-modal-backdrop .itinerary-cover-use-btn,
  html body .crm-media-modal-backdrop .drawer-save:not(.crm-media-preview-btn){
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    width:100%!important;
    min-width:0!important;
  }
}

@media (max-width: 420px){
  html body #itineraryDocumentPreviewSource{transform:scale(.33)!important;}
  html body .itdoc-preview-actions button{font-size:9px!important;padding:0 3px!important;}
}
@media (max-width: 374px){
  html body #itineraryDocumentPreviewSource{transform:scale(.30)!important;}
  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn{font-size:9.5px!important;padding:0 4px!important;}
}

/* Mobile responsive pass 24 - itinerary builder top actions + scroll hard fix
   Mobile only. Desktop/PC remains unchanged. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:66px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
  }

  /* Keep the CRM body locked as desktop expects, but make the content panel scrollable on builder pages. */
  html body .content-area:has(#itineraryBuilderPage),
  html body .content-area:has(.itinerary-builder-page){
    height:calc(100dvh - 47px)!important;
    max-height:calc(100dvh - 47px)!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
    padding-bottom:0!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 16px)!important;
  }

  html body .crm-layout:has(#itineraryBuilderPage),
  html body .crm-layout:has(.itinerary-builder-page){
    height:calc(100dvh - 47px)!important;
    max-height:calc(100dvh - 47px)!important;
    overflow:hidden!important;
  }

  html body #itineraryBuilderPage,
  html body .itinerary-builder-page{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:100%!important;
    padding:16px 14px 0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage::after,
  html body .itinerary-builder-page::after{
    content:""!important;
    display:block!important;
    height:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
    width:100%!important;
    flex:0 0 auto!important;
    clear:both!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-main,
  html body .itinerary-builder-page .itinerary-builder-main{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
  }

  /* Remove the layout/gear button completely on mobile, even if old inline page CSS loads later. */
  html body #itineraryBuilderPage .itinerary-head-right > .itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-head-right > .itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button.itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-head-right > button.itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[title="Itinerary Layout"],
  html body .itinerary-builder-page .itinerary-head-right > button[title="Itinerary Layout"],
  html body #itineraryBuilderPage .itinerary-head-right > button[onclick*="toggleItineraryLayoutMenu"],
  html body .itinerary-builder-page .itinerary-head-right > button[onclick*="toggleItineraryLayoutMenu"],
  html body #itineraryBuilderPage .itinerary-head-right > button:has(.bi-gear),
  html body .itinerary-builder-page .itinerary-head-right > button:has(.bi-gear),
  html body #itineraryBuilderPage .itinerary-layout-menu,
  html body .itinerary-builder-page .itinerary-layout-menu,
  html body #itineraryBuilderPage .itinerary-layout-menu.open,
  html body .itinerary-builder-page .itinerary-layout-menu.open{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    pointer-events:none!important;
    position:absolute!important;
    left:-99999px!important;
    top:auto!important;
    width:0!important;
    height:0!important;
    min-width:0!important;
    min-height:0!important;
    max-width:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
    transform:scale(0)!important;
  }

  /* Top action row: only Preview, Costing Summary and Edit Itinerary. No icon. No squeezing. */
  html body #itineraryBuilderPage .itinerary-builder-head,
  html body .itinerary-builder-page .itinerary-builder-head{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0 0 14px!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head > div:first-child,
  html body .itinerary-builder-page .itinerary-builder-head > div:first-child{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-head h1,
  html body .itinerary-builder-page .itinerary-builder-head h1{
    margin:0!important;
    font-size:21px!important;
    line-height:27px!important;
    letter-spacing:-.03em!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body #itineraryBuilderPage .itinerary-subline,
  html body .itinerary-builder-page .itinerary-subline{
    display:flex!important;
    align-items:center!important;
    gap:7px!important;
    flex-wrap:wrap!important;
    width:100%!important;
    min-width:0!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    align-items:center!important;
    justify-content:stretch!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn{
    display:none!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="itineraryform"]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    grid-column:auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:36px!important;
    min-height:36px!important;
    max-height:36px!important;
    padding:0 6px!important;
    margin:0!important;
    border-radius:10px!important;
    box-sizing:border-box!important;
    font-size:10.5px!important;
    font-weight:900!important;
    line-height:36px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    letter-spacing:-.01em!important;
    transform:none!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn{order:1!important;}
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn{order:2!important;}
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="itineraryform"]{order:3!important;}

  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn i,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn i,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="itineraryform"] i,
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="itineraryform"] i{
    display:none!important;
    width:0!important;
    height:0!important;
    margin:0!important;
    padding:0!important;
  }

  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax{
    grid-column:1 / -1!important;
    order:10!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    text-align:right!important;
    margin:0!important;
    padding:2px 0 0!important;
    font-size:11px!important;
    line-height:15px!important;
  }

  html body #itineraryBuilderPage .itinerary-cover,
  html body .itinerary-builder-page .itinerary-cover{
    margin-bottom:16px!important;
  }

  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    display:block!important;
    position:static!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:16px 0 0!important;
    padding-bottom:0!important;
    overflow:visible!important;
  }

  /* Do not allow old pass rules to lock internal builder areas and stop scrolling. */
  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell,
  html body #itineraryBuilderPage .itinerary-days-wrap,
  html body .itinerary-builder-page .itinerary-days-wrap,
  html body #itineraryBuilderPage .itinerary-left-day-tabs,
  html body .itinerary-builder-page .itinerary-left-day-tabs{
    overflow:visible!important;
    max-height:none!important;
  }
}

@media (max-width: 374px){
  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="itineraryform"]{
    font-size:9.5px!important;
    padding:0 4px!important;
  }
}

/* Mobile responsive pass 25 - itinerary builder final app polish
   Mobile only; desktop/PC remains unchanged. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:66px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
  }

  /* Builder page scroll + bottom safe space equal to footer menu. */
  html, body{
    overflow-x:hidden!important;
  }
  html body #itineraryBuilderPage,
  html body .itinerary-builder-page{
    display:block!important;
    height:auto!important;
    min-height:calc(100dvh - 56px)!important;
    max-height:none!important;
    overflow:visible!important;
    padding:18px 14px calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 16px)!important;
    margin:0!important;
    box-sizing:border-box!important;
  }
  html body .content-area:has(#itineraryBuilderPage),
  html body .content-area:has(.itinerary-builder-page){
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom))!important;
  }
  html body #itineraryBuilderPage .itinerary-builder-main,
  html body .itinerary-builder-page .itinerary-builder-main,
  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell,
  html body #itineraryBuilderPage .itinerary-days-wrap,
  html body .itinerary-builder-page .itinerary-days-wrap,
  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    overflow:visible!important;
    height:auto!important;
    max-height:none!important;
    padding-bottom:0!important;
  }
  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    margin-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 14px)!important;
  }

  /* Top actions: remove gear/settings and force exactly 3 app buttons in one row. */
  html body #itineraryBuilderPage .itinerary-head-right > .itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-head-right > .itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button.itinerary-layout-settings-btn,
  html body .itinerary-builder-page .itinerary-head-right > button.itinerary-layout-settings-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[title="Itinerary Layout"],
  html body .itinerary-builder-page .itinerary-head-right > button[title="Itinerary Layout"],
  html body #itineraryBuilderPage .itinerary-head-right > button[onclick*="toggleItineraryLayoutMenu"],
  html body .itinerary-builder-page .itinerary-head-right > button[onclick*="toggleItineraryLayoutMenu"],
  html body #itineraryBuilderPage .itinerary-layout-menu,
  html body .itinerary-builder-page .itinerary-layout-menu{
    display:none!important;
    visibility:hidden!important;
    opacity:0!important;
    width:0!important;
    height:0!important;
    min-width:0!important;
    max-width:0!important;
    min-height:0!important;
    max-height:0!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:hidden!important;
    pointer-events:none!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right,
  html body .itinerary-builder-page .itinerary-head-right{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:stretch!important;
    overflow:visible!important;
    padding:0!important;
    margin:0!important;
  }
  /* Hide all extra actions first (supplier cost, journey, etc.). */
  html body #itineraryBuilderPage .itinerary-head-right > .tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-primary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > a.tb-primary-btn,
  html body .itinerary-builder-page .itinerary-head-right > a.tb-primary-btn{
    display:none!important;
  }
  /* Show only Preview, Costing Summary and Edit Itinerary. */
  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="action=itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="action=itineraryform"]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    max-height:34px!important;
    padding:0 5px!important;
    margin:0!important;
    border-radius:10px!important;
    font-size:9.8px!important;
    font-weight:900!important;
    line-height:34px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    letter-spacing:-.02em!important;
    box-sizing:border-box!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn i,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn i,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn i,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="action=itineraryform"] i,
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="action=itineraryform"] i{
    display:none!important;
  }
  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn{grid-column:1!important;order:1!important;}
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn{grid-column:2!important;order:2!important;}
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="action=itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="action=itineraryform"]{grid-column:3!important;order:3!important;}
  html body #itineraryBuilderPage .itinerary-head-right .itinerary-head-pax,
  html body .itinerary-builder-page .itinerary-head-right .itinerary-head-pax{
    grid-column:1 / -1!important;
    order:20!important;
    text-align:right!important;
    width:100%!important;
    margin:4px 0 0!important;
    padding:0!important;
    font-size:11px!important;
    line-height:14px!important;
  }

  /* Preview itinerary popup: remove Word button, keep three actions in one line, center PDF preview. */
  html body .itdoc-preview-shell{
    height:calc(100dvh - 58px)!important;
    max-height:calc(100dvh - 58px)!important;
    overflow:hidden!important;
    background:#eef3f7!important;
  }
  html body .itdoc-preview-toolbar,
  html body .ai-cost-preview-toolbar{
    padding:10px 10px!important;
    background:#fff!important;
  }
  html body .itdoc-cost-position-select,
  html body .itdoc-preview-actions > button:first-child{
    display:none!important;
  }
  html body .itdoc-preview-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  html body .itdoc-preview-actions button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    padding:0 5px!important;
    border-radius:999px!important;
    font-size:10.8px!important;
    font-weight:900!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    line-height:38px!important;
  }
  html body .itdoc-preview-actions button i{display:none!important;}
  html body .itdoc-preview-canvas{
    display:block!important;
    width:100%!important;
    max-width:100vw!important;
    padding:14px 0 calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 14px)!important;
    margin:0!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    background:#eef3f7!important;
  }
  html body #itineraryDocumentPreviewSource{
    width:1080px!important;
    max-width:none!important;
    transform:scale(.34)!important;
    transform-origin:top left!important;
    margin-left:max(0px,calc((100vw - 367px) / 2))!important;
    margin-right:0!important;
  }

  /* Service image/media picker must sit above drawer/header/footer. Keep parent drawer from clipping fixed popup. */
  html body .right-drawer:has(.crm-media-modal-backdrop),
  html body .right-drawer.show:has(.crm-media-modal-backdrop),
  html body .right-drawer-body:has(.crm-media-modal-backdrop),
  html body .popupBox:has(.crm-media-modal-backdrop),
  html body .drawer-form:has(.crm-media-modal-backdrop){
    overflow:visible!important;
    transform:none!important;
    contain:none!important;
  }
  html body .crm-media-modal-backdrop,
  html body #crmMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryCoverMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryDayMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryStandardMediaPickerModal.crm-media-modal-backdrop,
  html body #itinerarySightseeingMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryTransportMediaPickerModal.crm-media-modal-backdrop,
  html body #itineraryHotelMediaPickerModal.crm-media-modal-backdrop,
  html body .crm-media-preview-backdrop{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    padding:0!important;
    margin:0!important;
    background:#fff!important;
    z-index:2147483647!important;
    overflow:hidden!important;
  }
  html body .crm-media-modal-backdrop .crm-media-modal,
  html body #crmMediaPickerModal .crm-media-modal,
  html body #itineraryCoverMediaPickerModal .crm-media-modal,
  html body #itineraryDayMediaPickerModal .crm-media-modal,
  html body #itineraryStandardMediaPickerModal .crm-media-modal,
  html body #itinerarySightseeingMediaPickerModal .crm-media-modal,
  html body #itineraryTransportMediaPickerModal .crm-media-modal,
  html body #itineraryHotelMediaPickerModal .crm-media-modal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    margin:0!important;
    border-radius:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#fff!important;
    z-index:2147483647!important;
  }
  html body .crm-media-modal-backdrop .crm-media-modal-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    flex:0 0 auto!important;
    min-height:58px!important;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px!important;
    position:sticky!important;
    top:0!important;
    z-index:2147483647!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    opacity:1!important;
    visibility:visible!important;
  }
  html body .crm-media-modal-backdrop .crm-media-modal-head button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    border-radius:50%!important;
    background:#f1f5f9!important;
    color:#475569!important;
    opacity:1!important;
    visibility:visible!important;
    font-size:25px!important;
    line-height:1!important;
  }
  html body .crm-media-modal-backdrop .crm-media-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body .crm-media-modal-backdrop .crm-media-grid{
    padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
  }

  /* Service add/edit forms and transport vehicle details: one field per row, readable width. */
  html body .itinerary-service-form .quote-pro-grid,
  html body .itinerary-hotel-form .quote-pro-grid,
  html body .itinerary-sightseeing-form .quote-pro-grid,
  html body .itinerary-transport-form .quote-pro-grid,
  html body .itinerary-flight-form .quote-pro-grid,
  html body .itinerary-bus-form .quote-pro-grid,
  html body .itinerary-train-form .quote-pro-grid,
  html body .itinerary-cruise-form .quote-pro-grid,
  html body .itinerary-service-form .itinerary-form-grid{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  html body .itinerary-service-form .quote-pro-field,
  html body .itinerary-hotel-form .quote-pro-field,
  html body .itinerary-sightseeing-form .quote-pro-field,
  html body .itinerary-transport-form .quote-pro-field,
  html body .itinerary-flight-form .quote-pro-field,
  html body .itinerary-bus-form .quote-pro-field,
  html body .itinerary-train-form .quote-pro-field,
  html body .itinerary-cruise-form .quote-pro-field,
  html body .itinerary-service-form .drawer-field{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    margin:0 0 12px!important;
    grid-column:1 / -1!important;
  }
  html body .tb-vehicle-details-box,
  html body .tb-vehicle-details-field{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
  }
  html body .tb-vehicle-detail-row{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:12px!important;
    margin:10px 0!important;
    box-sizing:border-box!important;
    overflow:visible!important;
  }
  html body .tb-vehicle-detail-row > b,
  html body .tb-vehicle-detail-row > div,
  html body .tb-vehicle-detail-row label,
  html body .tb-vehicle-detail-row input{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    box-sizing:border-box!important;
    white-space:normal!important;
  }
  html body .tb-vehicle-detail-row > b{
    font-size:13px!important;
    color:#111827!important;
    margin:0 0 2px!important;
  }
  html body .tb-vehicle-detail-row label{
    font-size:11px!important;
    line-height:14px!important;
    margin:0 0 5px!important;
    color:#64748b!important;
  }
  html body .tb-vehicle-detail-row input{
    height:40px!important;
    font-size:14px!important;
  }

  /* Itinerary service 3-dot menu delete option must be red and readable. */
  html body #itineraryBuilderPage .service-more-menu,
  html body .itinerary-builder-page .service-more-menu{
    z-index:999999!important;
  }
  html body #itineraryBuilderPage .service-more-menu .service-delete-btn,
  html body .itinerary-builder-page .service-more-menu .service-delete-btn,
  html body #itineraryBuilderPage .service-more-menu button[onclick*="delete"],
  html body .itinerary-builder-page .service-more-menu button[onclick*="delete"]{
    color:#dc2626!important;
    background:#fff5f5!important;
    border-color:#fecaca!important;
    font-weight:900!important;
  }

  /* Terms card: hide Add Terms Block on mobile and let text use full width. */
  html body #itineraryBuilderPage .itinerary-terms-add-btn,
  html body .itinerary-builder-page .itinerary-terms-add-btn{
    display:none!important;
  }
  html body #itineraryBuilderPage .itinerary-terms-builder-head,
  html body .itinerary-builder-page .itinerary-terms-builder-head{
    display:block!important;
    padding:16px!important;
  }
  html body #itineraryBuilderPage .itinerary-terms-title-left,
  html body .itinerary-builder-page .itinerary-terms-title-left{
    display:flex!important;
    align-items:flex-start!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  html body #itineraryBuilderPage .itinerary-terms-title-left > div,
  html body .itinerary-builder-page .itinerary-terms-title-left > div{
    flex:1 1 auto!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
}

@media (max-width: 420px){
  html body #itineraryDocumentPreviewSource{
    transform:scale(.33)!important;
    margin-left:max(0px,calc((100vw - 356px) / 2))!important;
  }
  html body .itdoc-preview-actions button{font-size:10px!important;}
  html body #itineraryBuilderPage .itinerary-head-right > .tb-preview-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-preview-btn,
  html body #itineraryBuilderPage .itinerary-head-right > .tb-costing-summary-btn,
  html body .itinerary-builder-page .itinerary-head-right > .tb-costing-summary-btn,
  html body #itineraryBuilderPage .itinerary-head-right > button[popaction*="action=itineraryform"],
  html body .itinerary-builder-page .itinerary-head-right > button[popaction*="action=itineraryform"]{
    font-size:9.2px!important;
    padding:0 3px!important;
  }
}

@media (max-width: 374px){
  html body #itineraryDocumentPreviewSource{
    transform:scale(.31)!important;
    margin-left:max(0px,calc((100vw - 335px) / 2))!important;
  }
  html body .itdoc-preview-actions button{font-size:9px!important;}
}

/* Mobile responsive pass 26 - itinerary builder scroll restore
   Mobile only. Keep body locked as CRM expects, but make content-area the scroll container again. */
@media (max-width: 767px){
  :root{
    --tb-mobile-footer-h:66px;
    --tb-mobile-safe-bottom:env(safe-area-inset-bottom,0px);
    --tb-mobile-header-h:47px;
  }

  html,
  body{
    height:100%!important;
    max-height:100%!important;
    overflow:hidden!important;
    overflow-x:hidden!important;
  }

  html body .crm-layout:has(#itineraryBuilderPage),
  html body .crm-layout:has(.itinerary-builder-page){
    height:calc(100dvh - var(--tb-mobile-header-h))!important;
    max-height:calc(100dvh - var(--tb-mobile-header-h))!important;
    min-height:0!important;
    overflow:hidden!important;
  }

  html body .content-area:has(#itineraryBuilderPage),
  html body .content-area:has(.itinerary-builder-page){
    display:block!important;
    height:calc(100dvh - var(--tb-mobile-header-h))!important;
    max-height:calc(100dvh - var(--tb-mobile-header-h))!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior-y:contain!important;
    padding-bottom:0!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage,
  html body .itinerary-builder-page{
    display:block!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    padding:18px 14px 0!important;
    margin:0!important;
    box-sizing:border-box!important;
  }

  html body #itineraryBuilderPage::after,
  html body .itinerary-builder-page::after{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:calc(var(--tb-mobile-footer-h) + var(--tb-mobile-safe-bottom) + 18px)!important;
    clear:both!important;
  }

  html body #itineraryBuilderPage .itinerary-builder-main,
  html body .itinerary-builder-page .itinerary-builder-main,
  html body #itineraryBuilderPage .itinerary-days-shell,
  html body .itinerary-builder-page .itinerary-days-shell,
  html body #itineraryBuilderPage .itinerary-days-wrap,
  html body .itinerary-builder-page .itinerary-days-wrap,
  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    height:auto!important;
    max-height:none!important;
    overflow:visible!important;
  }

  html body #itineraryBuilderPage .itinerary-cost-sidebar,
  html body .itinerary-builder-page .itinerary-cost-sidebar{
    margin-bottom:0!important;
    padding-bottom:0!important;
  }
}


/* Mobile responsive pass 27 - fix service image picker overlay from service add/edit popup
   Mobile only. Force every service media picker to be a true app-style full-screen layer
   above the drawer, header and footer menu. */
@media (max-width: 767px){
  html body.tb-mobile-media-picker-open{
    overflow:hidden!important;
    height:100dvh!important;
  }

  html body.tb-mobile-media-picker-open .crm-header,
  html body.tb-mobile-media-picker-open .main-menu,
  html body.tb-mobile-media-picker-open .mobile-bottom-menu,
  html body.tb-mobile-media-picker-open .crm-mobile-bottom-menu,
  html body.tb-mobile-media-picker-open .bottom-mobile-menu,
  html body.tb-mobile-media-picker-open .bigin-bottom-nav,
  html body.tb-mobile-media-picker-open .tb-mobile-bottom-nav{
    z-index:1!important;
    pointer-events:none!important;
  }

  html body.tb-mobile-media-picker-open #rightDrawer,
  html body.tb-mobile-media-picker-open .right-drawer,
  html body.tb-mobile-media-picker-open .right-drawer.show{
    overflow:visible!important;
    transform:none!important;
    contain:none!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"],
  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #crmMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryCoverMediaPickerModal[data-tb-mobile-lifted="1"]{
    position:fixed!important;
    inset:0!important;
    left:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:stretch!important;
    justify-content:stretch!important;
    background:#fff!important;
    z-index:2147483647!important;
    overflow:hidden!important;
    transform:none!important;
    opacity:1!important;
    visibility:visible!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal{
    position:fixed!important;
    inset:0!important;
    width:100vw!important;
    height:100dvh!important;
    max-width:100vw!important;
    max-height:100dvh!important;
    margin:0!important;
    padding:0!important;
    border-radius:0!important;
    border:0!important;
    box-shadow:none!important;
    background:#fff!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    z-index:2147483647!important;
    transform:none!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    flex:0 0 auto!important;
    min-height:58px!important;
    padding:calc(env(safe-area-inset-top,0px) + 10px) 14px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    position:relative!important;
    top:auto!important;
    z-index:2147483647!important;
    opacity:1!important;
    visibility:visible!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head > div{
    min-width:0!important;
    flex:1 1 auto!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head b{
    display:block!important;
    color:#0f172a!important;
    font-size:17px!important;
    font-weight:900!important;
    line-height:1.15!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head span{
    display:block!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:1.25!important;
    margin-top:2px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head button{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    min-height:40px!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#f1f5f9!important;
    color:#475569!important;
    font-size:28px!important;
    font-weight:800!important;
    line-height:1!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    z-index:2147483647!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-tabs{
    flex:0 0 auto!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    padding:10px 14px!important;
    background:#fff!important;
    border-bottom:1px solid #e6eef6!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-tabs::-webkit-scrollbar{display:none!important;}

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding:12px 14px calc(env(safe-area-inset-bottom,0px) + 18px)!important;
    background:#f8fbfd!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-search-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 104px!important;
    gap:8px!important;
    width:100%!important;
    margin:0 0 10px!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-search-row input,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-search-row button{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    font-size:14px!important;
    box-sizing:border-box!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0 0 calc(env(safe-area-inset-bottom,0px) + 14px)!important;
    overflow:visible!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-card{
    width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-card img{
    width:100%!important;
    height:110px!important;
    object-fit:cover!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-preview-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] button[onclick*="Preview"],
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] button[onclick*="preview"]{
    display:none!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .drawer-save:not(.crm-media-preview-btn){
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    min-width:0!important;
    height:34px!important;
    min-height:34px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    font-size:12px!important;
    font-weight:900!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-foot{
    flex:0 0 auto!important;
    display:flex!important;
    gap:10px!important;
    padding:10px 14px calc(env(safe-area-inset-bottom,0px) + 10px)!important;
    background:#fff!important;
    border-top:1px solid #e6eef6!important;
  }
}

/* Mobile responsive pass 28 - media picker close/use tap reliability */
@media (max-width: 767px){
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"],
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] *{
    pointer-events:auto!important;
  }
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head button,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .drawer-save,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] button{
    touch-action:manipulation!important;
    -webkit-tap-highlight-color:transparent!important;
  }
}

/* Mobile responsive pass 29 - service image picker exact mobile behavior
   On mobile, image picker must be simple: top close + per-card Use This only.
   No checkboxes, no bottom Add Selected footer, no header/footer obstruction. */
@media (max-width: 767px){
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"]{
    z-index:2147483647!important;
    background:#fff!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal{
    z-index:2147483647!important;
    background:#fff!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head{
    position:sticky!important;
    top:0!important;
    z-index:2147483647!important;
    background:#fff!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-head button{
    display:inline-flex!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    position:relative!important;
    z-index:2147483647!important;
  }

  /* Hide multi-select UI on mobile. User should tap Use This on the chosen image. */
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-check,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] input[type="checkbox"],
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] label.crm-media-check{
    display:none!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-modal-foot{
    display:none!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-panel{
    padding-bottom:calc(env(safe-area-inset-bottom,0px) + 18px)!important;
  }

  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .day-media-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .hotel-media-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] .itinerary-cover-use-btn,
  html body .crm-media-modal-backdrop[data-tb-mobile-lifted="1"] button.crm-media-use-btn{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    border-radius:18px!important;
    white-space:nowrap!important;
    font-size:13px!important;
    font-weight:900!important;
    pointer-events:auto!important;
    touch-action:manipulation!important;
    position:relative!important;
    z-index:5!important;
  }
}

/* Mobile responsive pass 30 - restore service/day multi image selection flow
   Mobile service/day image picker must work like desktop logic: select one/multiple images
   with checkboxes, then tap bottom Use Selected Images to add into the service/day popup. */
@media (max-width: 767px){
  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"],
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"]{
    z-index:2147483647!important;
    background:#fff!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal{
    display:flex!important;
    flex-direction:column!important;
    height:100dvh!important;
    max-height:100dvh!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-check,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-check,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-check,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-check,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-check,
  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] label.crm-media-check,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] label.crm-media-check,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] label.crm-media-check,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] label.crm-media-check,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] label.crm-media-check{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    position:absolute!important;
    left:8px!important;
    top:8px!important;
    width:28px!important;
    height:28px!important;
    min-width:28px!important;
    min-height:28px!important;
    padding:0!important;
    margin:0!important;
    border:1px solid #cbd5e1!important;
    border-radius:8px!important;
    background:rgba(255,255,255,.96)!important;
    box-shadow:0 2px 8px rgba(15,23,42,.12)!important;
    z-index:20!important;
    pointer-events:auto!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] input[type="checkbox"],
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] input[type="checkbox"],
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] input[type="checkbox"],
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] input[type="checkbox"],
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] input[type="checkbox"]{
    display:block!important;
    appearance:auto!important;
    -webkit-appearance:auto!important;
    width:18px!important;
    height:18px!important;
    min-width:18px!important;
    min-height:18px!important;
    margin:0!important;
    opacity:1!important;
    visibility:visible!important;
    pointer-events:auto!important;
    accent-color:#08a84f!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-card,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-card,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-card,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-card,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-card{
    position:relative!important;
    padding-top:0!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-use-btn,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .hotel-media-use-btn,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .day-media-use-btn{
    display:none!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot{
    display:grid!important;
    grid-template-columns:76px minmax(0,1fr)!important;
    gap:10px!important;
    flex:0 0 auto!important;
    position:relative!important;
    left:auto!important;
    right:auto!important;
    bottom:auto!important;
    width:100%!important;
    padding:10px 14px calc(env(safe-area-inset-bottom,0px) + 10px)!important;
    background:#fff!important;
    border-top:1px solid #e6eef6!important;
    box-shadow:0 -8px 20px rgba(15,23,42,.08)!important;
    z-index:2147483647!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot button,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot button,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot button,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot button,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot button{
    width:100%!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    border-radius:22px!important;
    font-size:13px!important;
    font-weight:900!important;
    white-space:nowrap!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    pointer-events:auto!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot .drawer-save,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot .drawer-save,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot .drawer-save,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot .drawer-save,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-modal-foot .drawer-save{
    background:#08a84f!important;
    color:#fff!important;
    border-color:#08a84f!important;
  }

  html body #itineraryStandardMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-panel,
  html body #itinerarySightseeingMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-panel,
  html body #itineraryTransportMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-panel,
  html body #itineraryHotelMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-panel,
  html body #itineraryDayMediaPickerModal[data-tb-mobile-lifted="1"] .crm-media-panel{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow:auto!important;
    padding-bottom:16px!important;
  }
}

/* Mobile email compose attachment/footer cleanup - v34 */
@media (max-width: 767px){
  html body #rightDrawer.show .email-compose-form{
    height:calc(100dvh - 57px)!important;
    max-height:calc(100dvh - 57px)!important;
    min-height:0!important;
    display:flex!important;
    flex-direction:column!important;
    overflow:hidden!important;
    background:#fff!important;
  }

  html body #rightDrawer.show .email-compose-head{
    height:auto!important;
    min-height:48px!important;
    flex:0 0 auto!important;
    padding:8px 16px!important;
    overflow:hidden!important;
  }

  html body #rightDrawer.show .email-compose-head .email-from{
    max-width:100%!important;
    min-width:0!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    font-size:14px!important;
  }

  html body #rightDrawer.show .email-compose-row{
    grid-template-columns:68px minmax(0,1fr)!important;
    height:42px!important;
    flex:0 0 42px!important;
    padding:0 16px!important;
    gap:8px!important;
  }

  html body #rightDrawer.show .email-compose-row label{
    font-size:13px!important;
    white-space:nowrap!important;
  }

  html body #rightDrawer.show .email-compose-row input{
    min-width:0!important;
    width:100%!important;
    font-size:14px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body #rightDrawer.show .email-editor-toolbar{
    flex:0 0 auto!important;
    padding:8px 14px!important;
    overflow-x:auto!important;
    white-space:nowrap!important;
  }

  html body #rightDrawer.show .email-body-editor{
    flex:1 1 auto!important;
    min-height:150px!important;
    max-height:none!important;
    overflow:auto!important;
    padding:16px!important;
    padding-bottom:18px!important;
    font-size:15px!important;
    line-height:24px!important;
  }

  html body #rightDrawer.show .email-compose-footer{
    height:auto!important;
    min-height:0!important;
    flex:0 0 auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    justify-content:flex-start!important;
    gap:10px!important;
    padding:10px 14px calc(env(safe-area-inset-bottom,0px) + 12px)!important;
    border-top:1px solid #e5edf3!important;
    background:#fff!important;
    box-shadow:0 -8px 18px rgba(15,23,42,.08)!important;
    position:relative!important;
    z-index:5!important;
  }

  html body #rightDrawer.show .email-attach-wrap{
    width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-wrap:wrap!important;
    align-items:center!important;
    gap:8px!important;
    overflow:visible!important;
  }

  html body #rightDrawer.show .email-attach{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:104px!important;
    height:40px!important;
    min-height:40px!important;
    padding:0 12px!important;
    border:1px solid #dbe5ef!important;
    border-radius:20px!important;
    background:#fff!important;
    color:#334155!important;
    font-size:12px!important;
    font-weight:800!important;
    line-height:1!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    white-space:nowrap!important;
    text-align:center!important;
  }

  html body #rightDrawer.show .email-attach-wrap > span[style]{
    flex:1 1 180px!important;
    min-width:0!important;
    max-width:100%!important;
    margin-left:0!important;
    padding:7px 10px!important;
    border-radius:16px!important;
    display:grid!important;
    grid-template-columns:32px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    column-gap:8px!important;
    row-gap:2px!important;
    align-items:center!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }

  html body #rightDrawer.show .email-attach-wrap > span[style] > span:first-child{
    grid-row:1 / span 2!important;
    width:30px!important;
    height:24px!important;
    margin:0!important;
  }

  html body #rightDrawer.show .email-attach-wrap > span[style] strong{
    min-width:0!important;
    max-width:100%!important;
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:12px!important;
    line-height:16px!important;
  }

  html body #rightDrawer.show .email-attach-wrap > span[style] em{
    min-width:0!important;
    display:block!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:11px!important;
    line-height:14px!important;
    color:#64748b!important;
  }

  html body #rightDrawer.show #emailAttachmentText{
    display:block!important;
    flex:1 1 100%!important;
    min-width:0!important;
    max-width:100%!important;
    color:#64748b!important;
    font-size:12px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body #rightDrawer.show .email-compose-footer > div:last-child:not(.email-attach-wrap){
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:10px!important;
    align-items:center!important;
  }

  html body #rightDrawer.show .email-compose-footer > div:last-child:not(.email-attach-wrap) .drawer-cancel,
  html body #rightDrawer.show .email-compose-footer > div:last-child:not(.email-attach-wrap) .drawer-save{
    width:100%!important;
    min-width:0!important;
    height:40px!important;
    min-height:40px!important;
    border-radius:22px!important;
    font-size:14px!important;
    font-weight:900!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
  }
}

/* Mobile pass 35 - Client/Company list and detail app-style fixes. Desktop untouched. */
@media (max-width: 768px){
  /* Client + Company listing toolbar: search left, add button right like Query page. */
  html body .client-page:not(.query-page):not(.itinerary-module-page) .content-toolbar.client-toolbar{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:8px!important;
    padding:10px 12px!important;
    overflow:visible!important;
    background:#fff!important;
    border-bottom:1px solid #e5edf3!important;
    position:relative!important;
    z-index:2147481500!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-toolbar .left-tools{
    display:contents!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-view-wrap,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-bulk-bar,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-create-arrow,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-create-menu,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-more-wrap,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-more-menu{
    display:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-custom-search{
    grid-column:1!important;
    grid-row:1!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:36px!important;
    margin:0!important;
    display:flex!important;
    position:relative!important;
    z-index:2147481515!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-custom-search input{
    width:100%!important;
    height:36px!important;
    min-height:36px!important;
    border:1px solid #d8e3ee!important;
    border-radius:20px!important;
    padding:0 42px 0 14px!important;
    background:#fff!important;
    color:#0f172a!important;
    caret-color:var(--tb-accent,#00a85a)!important;
    font-size:16px!important;
    line-height:36px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-custom-search input::placeholder{
    color:#64748b!important;
    opacity:.95!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-custom-search button{
    position:absolute!important;
    right:8px!important;
    top:6px!important;
    width:24px!important;
    height:24px!important;
    min-width:24px!important;
    min-height:24px!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    color:#334155!important;
    background:transparent!important;
    border:0!important;
    z-index:2!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-custom-search a{
    position:absolute!important;
    right:34px!important;
    top:7px!important;
    width:22px!important;
    height:22px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#fff!important;
    color:#64748b!important;
    z-index:2!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-toolbar .right-tools.client-right-tools,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-toolbar .client-right-tools{
    grid-column:2!important;
    grid-row:1!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:0!important;
    overflow:visible!important;
    z-index:2147481515!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-create-wrap{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    width:auto!important;
    min-width:0!important;
    margin:0!important;
    padding:0!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-main-create,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .create-btn.client-main-create{
    height:36px!important;
    min-height:36px!important;
    min-width:86px!important;
    max-width:104px!important;
    border-radius:19px!important;
    padding:0 13px!important;
    font-size:13px!important;
    line-height:36px!important;
    font-weight:800!important;
    white-space:nowrap!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    box-shadow:0 6px 14px rgba(15,177,93,.18)!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-body,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-list-area,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
    background:#f4f7fb!important;
    border:0!important;
    box-shadow:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-list-area{
    padding:10px 10px 0!important;
  }

  /* Client + Company listing app/card view. */
  html body .client-page:not(.query-page):not(.itinerary-module-page) table.client-table,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .crm-table.client-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    border:0!important;
    background:transparent!important;
    border-collapse:separate!important;
    border-spacing:0!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table thead,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table thead tr,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table thead th{
    display:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody{
    display:block!important;
    width:100%!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px 10px!important;
    width:100%!important;
    margin:0 0 10px!important;
    padding:12px!important;
    border:1px solid #e6edf5!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 7px 18px rgba(15,23,42,.055)!important;
    overflow:hidden!important;
    position:relative!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr:hover > td{
    background:transparent!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:1.35!important;
    font-weight:600!important;
    text-align:right!important;
    white-space:normal!important;
    overflow:visible!important;
    grid-column:1 / -1!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="select"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td:first-child:not(.client-empty){
    display:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td:not([data-col="display_name"]):not([data-col="client_name"]):not([data-col="name"]):not([data-col="first_name"]):not([data-col="company_name"]):not([data-col="actions"]):not(.client-empty)::before{
    content:attr(data-label)!important;
    flex:0 0 auto!important;
    max-width:46%!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:800!important;
    text-align:left!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="display_name"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="client_name"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="name"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="first_name"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="company_name"]{
    grid-column:1!important;
    grid-row:1!important;
    justify-content:flex-start!important;
    text-align:left!important;
    font-size:15px!important;
    line-height:20px!important;
    font-weight:900!important;
    color:#0b1220!important;
    padding-right:4px!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td[data-col="actions"],
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td.client-row-actions{
    grid-column:2!important;
    grid-row:1!important;
    align-self:start!important;
    justify-content:flex-end!important;
    gap:6px!important;
    width:auto!important;
    min-width:72px!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-row-actions button{
    width:32px!important;
    height:32px!important;
    min-width:32px!important;
    min-height:32px!important;
    border-radius:16px!important;
    background:#f1fbf6!important;
    color:#00a85a!important;
    border:0!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-row-actions button:last-child{
    color:#ef4444!important;
    background:#fff1f2!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td.client-empty{
    display:block!important;
    grid-column:1 / -1!important;
    width:100%!important;
    padding:24px 12px!important;
    text-align:center!important;
    color:#64748b!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td a,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td span,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td b,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr > td div{
    min-width:0!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  /* Client + Company detail: keep tabs/related sections from breaking horizontally. */
  html body .client-detail-page .client-detail-content{
    max-width:100%!important;
    overflow-x:hidden!important;
  }

  html body .client-detail-page .activity-box{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    border-radius:14px!important;
    background:#fff!important;
  }

  html body .client-detail-page .activity-toolbar{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:flex!important;
    flex-direction:column!important;
    gap:10px!important;
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    padding:10px!important;
    box-sizing:border-box!important;
    overflow:visible!important;
    background:#fff!important;
  }

  html body .client-detail-page .activity-toolbar .activity-pills{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:7px!important;
    padding:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body .client-detail-page .activity-toolbar .activity-pills a{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    height:34px!important;
    padding:0 8px!important;
    border-radius:18px!important;
    box-sizing:border-box!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
    font-size:13px!important;
    font-weight:800!important;
  }

  html body .client-detail-page .activity-toolbar .activity-actions{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    padding:0!important;
    margin:0!important;
    overflow:visible!important;
    box-sizing:border-box!important;
  }

  html body .client-detail-page .activity-toolbar .activity-actions button{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:38px!important;
    min-height:38px!important;
    border-radius:20px!important;
    padding:0 8px!important;
    font-size:13px!important;
    line-height:38px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    box-sizing:border-box!important;
  }

  html body .client-detail-page .activity-title.clean-title{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:13px 14px!important;
    box-sizing:border-box!important;
    background:#fff!important;
    margin:0!important;
  }

  html body .client-detail-page table.activity-detail-table,
  html body .client-detail-page .activity-detail-table{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
    border-collapse:collapse!important;
    display:table!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
    background:#fff!important;
  }

  html body .client-detail-page .activity-detail-table th,
  html body .client-detail-page .activity-detail-table td{
    min-width:0!important;
    max-width:none!important;
    padding:10px 8px!important;
    box-sizing:border-box!important;
    font-size:12px!important;
    line-height:17px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .client-detail-page .activity-detail-table th:nth-child(1),
  html body .client-detail-page .activity-detail-table td:nth-child(1){width:42%!important;}
  html body .client-detail-page .activity-detail-table th:nth-child(2),
  html body .client-detail-page .activity-detail-table td:nth-child(2){width:29%!important;}
  html body .client-detail-page .activity-detail-table th:nth-child(3),
  html body .client-detail-page .activity-detail-table td:nth-child(3){width:29%!important;}
  html body .client-detail-page .activity-detail-table th:nth-child(4),
  html body .client-detail-page .activity-detail-table td:nth-child(4),
  html body .client-detail-page .activity-detail-table th:nth-child(5),
  html body .client-detail-page .activity-detail-table td:nth-child(5){display:none!important;}

  html body .client-detail-page .activity-detail-table .detail-empty-cell{
    display:table-cell!important;
    width:100%!important;
    text-align:center!important;
    white-space:normal!important;
    overflow:visible!important;
    padding:34px 12px!important;
    color:#64748b!important;
  }

  /* Client + Company detail Queries tab as mobile cards. */
  html body .client-detail-page .pipelines-box,
  html body .company-detail-page .pipelines-box{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    background:#fff!important;
    border-radius:14px!important;
    box-sizing:border-box!important;
  }

  html body .client-detail-page .pipeline-detail-head,
  html body .company-detail-page .related-list-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    padding:14px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  html body .client-detail-page .pipeline-detail-head h3,
  html body .company-detail-page .related-list-head h3{
    margin:0!important;
    font-size:16px!important;
    line-height:22px!important;
  }

  html body .client-detail-page .pipeline-detail-head p{
    margin:5px 0 0!important;
    font-size:13px!important;
    color:#64748b!important;
  }

  html body .client-detail-page .pipeline-detail-head button,
  html body .company-detail-page .related-list-head button{
    flex:0 0 auto!important;
    min-width:88px!important;
    height:36px!important;
    min-height:36px!important;
    border-radius:20px!important;
    white-space:nowrap!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table,
  html body .company-detail-page .pipelines-box table.detail-table{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0 12px 12px!important;
    border:0!important;
    background:#fff!important;
    border-collapse:separate!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table thead,
  html body .client-detail-page .pipelines-box table.detail-table thead tr,
  html body .client-detail-page .pipelines-box table.detail-table thead th,
  html body .company-detail-page .pipelines-box table.detail-table thead,
  html body .company-detail-page .pipelines-box table.detail-table thead tr,
  html body .company-detail-page .pipelines-box table.detail-table thead th{
    display:none!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody,
  html body .company-detail-page .pipelines-box table.detail-table tbody{
    display:block!important;
    width:100%!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr,
  html body .company-detail-page .pipelines-box table.detail-table tbody tr{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
    gap:8px 10px!important;
    width:100%!important;
    padding:12px!important;
    margin:0 0 10px!important;
    border:1px solid #e6edf5!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 6px 16px rgba(15,23,42,.05)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr > td,
  html body .company-detail-page .pipelines-box table.detail-table tbody tr > td{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:3px!important;
    width:auto!important;
    min-width:0!important;
    max-width:100%!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    font-size:13px!important;
    line-height:18px!important;
    color:#0f172a!important;
    white-space:normal!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr > td::before,
  html body .company-detail-page .pipelines-box table.detail-table tbody tr > td::before{
    content:attr(data-label)!important;
    color:#64748b!important;
    font-size:10px!important;
    line-height:13px!important;
    font-weight:800!important;
    text-transform:uppercase!important;
    letter-spacing:.02em!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr > td[data-col="query_name"],
  html body .company-detail-page .pipelines-box table.detail-table tbody tr > td[data-col="query_name"]{
    grid-column:1 / -1!important;
    font-size:14px!important;
    line-height:19px!important;
    font-weight:900!important;
    color:#0b1220!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr > td[data-col="query_name"]::before,
  html body .company-detail-page .pipelines-box table.detail-table tbody tr > td[data-col="query_name"]::before{
    display:none!important;
  }

  html body .client-detail-page .pipelines-box table.detail-table tbody tr > td.detail-empty-cell,
  html body .company-detail-page .pipelines-box table.detail-table tbody tr > td.detail-empty-cell{
    display:block!important;
    grid-column:1 / -1!important;
    padding:24px 12px!important;
    text-align:center!important;
    color:#64748b!important;
  }
}

@media (max-width: 380px){
  html body .client-page:not(.query-page):not(.itinerary-module-page) .content-toolbar.client-toolbar{
    gap:6px!important;
    padding-left:8px!important;
    padding-right:8px!important;
  }
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-main-create,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .create-btn.client-main-create{
    min-width:76px!important;
    max-width:88px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    font-size:12px!important;
  }
}

/* Mobile pass 36 - Client/Company pagination fixed above bottom navigation. Desktop untouched. */
@media (max-width: 768px){
  html body .client-page:not(.query-page):not(.itinerary-module-page){
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 56px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-body,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-list-area,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table-wrap{
    padding-bottom:58px!important;
    margin-bottom:0!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-bar{
    display:flex!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:calc(var(--tb-mobile-footer-h,68px) + env(safe-area-inset-bottom,0px))!important;
    width:100%!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    padding:7px 12px!important;
    margin:0!important;
    align-items:center!important;
    justify-content:center!important;
    background:rgba(255,255,255,.96)!important;
    border-top:1px solid #e5edf3!important;
    box-shadow:0 -8px 22px rgba(15,23,42,.10)!important;
    z-index:99955!important;
    box-sizing:border-box!important;
    transform:translateZ(0)!important;
    -webkit-backdrop-filter:blur(8px)!important;
    backdrop-filter:blur(8px)!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-stats{
    display:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages{
    width:100%!important;
    max-width:330px!important;
    display:grid!important;
    grid-template-columns:76px 34px minmax(74px,1fr) 34px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    margin:0 auto!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages > span{
    display:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages select{
    grid-column:1!important;
    width:76px!important;
    max-width:76px!important;
    height:34px!important;
    min-height:34px!important;
    border-radius:18px!important;
    border:1px solid #d8e3ee!important;
    background:#fff!important;
    color:#0f172a!important;
    font-size:13px!important;
    font-weight:700!important;
    padding:0 28px 0 14px!important;
    box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages a{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    border-radius:50%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid #dbe6f0!important;
    background:#f8fafc!important;
    color:#0f172a!important;
    box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
    text-decoration:none!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages a.disabled{
    opacity:.36!important;
    pointer-events:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-pages strong{
    min-width:74px!important;
    text-align:center!important;
    color:#0f172a!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:34px!important;
  }
}

/* Mobile pass 37 - Client/Company listing sticky toolbar, full-card click and safe bottom space. Desktop untouched. */
@media (max-width: 768px){
  html body .client-page:not(.query-page):not(.itinerary-module-page) .content-toolbar.client-toolbar{
    position:sticky!important;
    top:0!important;
    left:0!important;
    right:0!important;
    z-index:2147482100!important;
    box-shadow:0 6px 16px rgba(15,23,42,.07)!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-body{
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 72px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 72px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-list-area{
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 82px + env(safe-area-inset-bottom,0px))!important;
    margin-bottom:0!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody::after{
    content:""!important;
    display:block!important;
    width:100%!important;
    height:calc(var(--tb-mobile-footer-h,68px) + 72px + env(safe-area-inset-bottom,0px))!important;
    min-height:calc(var(--tb-mobile-footer-h,68px) + 72px + env(safe-area-inset-bottom,0px))!important;
    pointer-events:none!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url]{
    cursor:pointer!important;
    -webkit-tap-highlight-color:rgba(0,168,90,.10)!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url]:active{
    transform:scale(.992)!important;
    background:#f8fffb!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url] > td:not(.client-row-actions):not([data-col="actions"]),
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url] > td:not(.client-row-actions):not([data-col="actions"]) *{
    cursor:pointer!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url] .client-row-actions,
  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-table tbody tr[data-mobile-detail-url] [data-col="actions"]{
    cursor:default!important;
    position:relative!important;
    z-index:3!important;
  }

  html body .client-page:not(.query-page):not(.itinerary-module-page) .client-footer-bar{
    z-index:2147482080!important;
  }
}

/* Mobile pass 38 - Client/Company detail action row: keep only Send Mail. Desktop untouched. */
@media (max-width: 768px){
  html body .client-detail-page .client-detail-actions > :not(.send-mail-btn){
    display:none!important;
  }

  html body .client-detail-page .client-detail-actions{
    display:flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    gap:0!important;
    overflow:visible!important;
  }

  html body .client-detail-page .client-detail-actions .send-mail-btn{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    white-space:nowrap!important;
    flex:0 0 auto!important;
  }
}

/* Mobile pass 39 - Payments app-style cards, 2-up summary and fixed pagination. Desktop untouched. */
@media (max-width: 768px){
  html body .payments-page{
    height:calc(100dvh - var(--tb-mobile-header-h,52px))!important;
    min-height:0!important;
    overflow:hidden!important;
    display:flex!important;
    flex-direction:column!important;
    background:#f3f7fb!important;
    padding-bottom:0!important;
  }

  html body .payments-head{
    flex:0 0 auto!important;
    padding:12px 14px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e5edf3!important;
    z-index:5!important;
  }

  html body .payments-head h2{
    font-size:18px!important;
    line-height:1.15!important;
    margin:0 0 4px!important;
    color:#071025!important;
  }

  html body .payments-head p{
    font-size:12px!important;
    line-height:1.35!important;
    margin:0!important;
    color:#64748b!important;
  }

  html body .payments-head-actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px!important;
    margin-top:10px!important;
  }

  html body .payments-tab{
    width:100%!important;
    height:34px!important;
    min-width:0!important;
    padding:0 10px!important;
    border-radius:18px!important;
    font-size:12px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }

  html body .payments-content{
    flex:1 1 auto!important;
    min-height:0!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding:12px 12px calc(var(--tb-mobile-footer-h,68px) + 62px + env(safe-area-inset-bottom,0px))!important;
    background:#f3f7fb!important;
    display:block!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 66px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .payments-summary-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:0 0 12px!important;
    width:100%!important;
  }

  html body .payments-summary-grid > div{
    height:auto!important;
    min-height:72px!important;
    padding:12px 12px!important;
    border-radius:13px!important;
    border:1px solid #dfe8f0!important;
    background:#fff!important;
    box-shadow:0 6px 16px rgba(15,23,42,.04)!important;
    overflow:hidden!important;
  }

  html body .payments-summary-grid span{
    margin:0 0 7px!important;
    font-size:11px!important;
    line-height:1.15!important;
    color:#64748b!important;
    font-weight:900!important;
  }

  html body .payments-summary-grid b{
    display:block!important;
    font-size:14px!important;
    line-height:1.22!important;
    font-weight:950!important;
    color:#071025!important;
    letter-spacing:-.15px!important;
    white-space:normal!important;
    word-break:break-word!important;
  }

  html body .payments-filter-card{
    margin:0 0 12px!important;
    padding:12px!important;
    border-radius:14px!important;
    border:1px solid #dfe8f0!important;
    background:#fff!important;
    box-shadow:0 5px 16px rgba(15,23,42,.035)!important;
  }

  html body .payments-filter-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    align-items:stretch!important;
  }

  html body .payments-filter-grid label{
    margin:0 0 5px!important;
    font-size:11px!important;
    line-height:1.1!important;
    font-weight:900!important;
    color:#64748b!important;
  }

  html body .payments-filter-grid input,
  html body .payments-filter-grid select{
    height:38px!important;
    min-height:38px!important;
    border-radius:9px!important;
    font-size:14px!important;
    font-weight:750!important;
    color:#0f172a!important;
    background:#fff!important;
  }

  html body .payments-filter-actions{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    white-space:normal!important;
  }

  html body .payments-filter-actions .settings-add-btn{
    grid-column:1/-1!important;
    width:100%!important;
    height:40px!important;
    border-radius:20px!important;
    justify-content:center!important;
    font-size:14px!important;
    font-weight:900!important;
  }

  html body .payments-filter-actions a{
    width:100%!important;
    height:38px!important;
    border-radius:19px!important;
    justify-content:center!important;
    padding:0 10px!important;
    font-size:13px!important;
    font-weight:900!important;
    box-sizing:border-box!important;
  }

  html body .payments-table-card{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    overflow:visible!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 64px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .payments-table-head{
    height:auto!important;
    min-height:0!important;
    display:flex!important;
    align-items:flex-end!important;
    justify-content:space-between!important;
    gap:10px!important;
    padding:4px 2px 10px!important;
    margin:0!important;
    border:0!important;
    background:transparent!important;
  }

  html body .payments-table-head h3{
    margin:0!important;
    font-size:17px!important;
    line-height:1.2!important;
    font-weight:950!important;
    color:#071025!important;
  }

  html body .payments-table-head p{
    margin:3px 0 0!important;
    font-size:12px!important;
    line-height:1.2!important;
    font-weight:750!important;
    color:#64748b!important;
  }

  html body .payments-table-wrap{
    width:100%!important;
    overflow:visible!important;
    min-height:0!important;
    padding:0 0 2px!important;
  }

  html body .payments-table{
    min-width:0!important;
    width:100%!important;
    border-collapse:separate!important;
    border-spacing:0 10px!important;
    display:block!important;
  }

  html body .payments-table thead{
    display:none!important;
  }

  html body .payments-table tbody{
    display:block!important;
    width:100%!important;
  }

  html body .payments-table tbody tr{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:8px 12px!important;
    width:100%!important;
    margin:0 0 10px!important;
    padding:14px 14px 13px!important;
    border:1px solid #e0e8f0!important;
    border-radius:16px!important;
    background:#fff!important;
    box-shadow:0 8px 22px rgba(15,23,42,.05)!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  html body .payments-table tbody tr:last-child{
    margin-bottom:0!important;
  }

  html body .payments-table td{
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    width:100%!important;
    height:auto!important;
    min-height:0!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:1.25!important;
    font-weight:850!important;
    white-space:normal!important;
    word-break:break-word!important;
    overflow:visible!important;
  }

  html body .payments-table td::before{
    content:attr(data-label)!important;
    display:block!important;
    margin:0 0 3px!important;
    font-size:10px!important;
    line-height:1.15!important;
    font-weight:950!important;
    color:#64748b!important;
    text-transform:none!important;
  }

  html body .payments-table td[data-label="Query ID"],
  html body .payments-table td[data-label="Record"]{
    grid-column:1/-1!important;
    padding-right:80px!important;
    position:relative!important;
  }

  html body .payments-table td[data-label="Query ID"]::before,
  html body .payments-table td[data-label="Record"]::before{
    display:none!important;
  }

  html body .payments-table td[data-label="Query ID"] a,
  html body .payments-table td[data-label="Record"] a{
    font-size:15px!important;
    line-height:1.2!important;
    color:#071025!important;
    font-weight:950!important;
    text-decoration:none!important;
    max-width:100%!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }

  html body .payments-table td[data-label="Status"]{
    position:absolute!important;
    top:14px!important;
    right:14px!important;
    width:auto!important;
    max-width:86px!important;
    align-items:flex-end!important;
  }

  html body .payments-table td[data-label="Status"]::before{
    display:none!important;
  }

  html body .payments-table td[data-label="Action"]{
    grid-column:1/-1!important;
    margin-top:4px!important;
  }

  html body .payments-table td a{
    color:#2563eb!important;
    font-size:13px!important;
    font-weight:900!important;
    text-decoration:none!important;
  }

  html body .payments-table td small{
    display:block!important;
    max-width:100%!important;
    margin:3px 0 0!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:700!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }

  html body .payments-status{
    height:24px!important;
    padding:0 9px!important;
    border-radius:13px!important;
    font-size:10px!important;
    line-height:24px!important;
    font-weight:950!important;
    white-space:nowrap!important;
  }

  html body .payments-row-actions{
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:8px!important;
    width:100%!important;
    align-items:center!important;
  }

  html body .payments-row-actions button,
  html body .payments-row-actions a,
  html body .payments-row-actions form,
  html body .payments-row-actions form button{
    width:100%!important;
    min-width:0!important;
    height:32px!important;
    min-height:32px!important;
    border-radius:17px!important;
    font-size:12px!important;
    font-weight:950!important;
    padding:0 8px!important;
    white-space:nowrap!important;
    box-sizing:border-box!important;
  }

  html body .payments-row-actions form{
    display:block!important;
    margin:0!important;
  }

  html body .payments-empty{
    grid-column:1/-1!important;
    min-height:92px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-align:center!important;
    color:#64748b!important;
    font-size:13px!important;
    font-weight:800!important;
  }

  html body .payments-table-card::after{
    content:""!important;
    display:block!important;
    height:calc(var(--tb-mobile-footer-h,68px) + 64px + env(safe-area-inset-bottom,0px))!important;
    min-height:calc(var(--tb-mobile-footer-h,68px) + 64px + env(safe-area-inset-bottom,0px))!important;
    pointer-events:none!important;
  }

  html body .payments-footer-bar{
    display:flex!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:calc(var(--tb-mobile-footer-h,68px) + env(safe-area-inset-bottom,0px))!important;
    width:100%!important;
    height:52px!important;
    min-height:52px!important;
    max-height:52px!important;
    padding:7px 12px!important;
    margin:0!important;
    align-items:center!important;
    justify-content:center!important;
    background:rgba(255,255,255,.97)!important;
    border-top:1px solid #e5edf3!important;
    box-shadow:0 -8px 22px rgba(15,23,42,.10)!important;
    z-index:2147482080!important;
    box-sizing:border-box!important;
    transform:translateZ(0)!important;
    -webkit-backdrop-filter:blur(9px)!important;
    backdrop-filter:blur(9px)!important;
  }

  html body .payments-footer-bar .client-footer-stats{
    display:none!important;
  }

  html body .payments-footer-bar .client-footer-pages{
    width:100%!important;
    max-width:330px!important;
    display:grid!important;
    grid-template-columns:76px 34px minmax(74px,1fr) 34px!important;
    align-items:center!important;
    justify-content:center!important;
    gap:9px!important;
    margin:0 auto!important;
    padding:0!important;
    font-size:12px!important;
    line-height:1!important;
    white-space:nowrap!important;
  }

  html body .payments-footer-bar .client-footer-pages > span{
    display:none!important;
  }

  html body .payments-footer-bar .client-footer-pages select{
    grid-column:1!important;
    width:76px!important;
    max-width:76px!important;
    height:34px!important;
    min-height:34px!important;
    border-radius:18px!important;
    border:1px solid #d8e3ee!important;
    background:#fff!important;
    color:#0f172a!important;
    font-size:13px!important;
    font-weight:800!important;
    padding:0 28px 0 14px!important;
    box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
  }

  html body .payments-footer-bar .client-footer-pages a{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    min-height:34px!important;
    border-radius:50%!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:1px solid #dbe6f0!important;
    background:#f8fafc!important;
    color:#0f172a!important;
    box-shadow:0 3px 10px rgba(15,23,42,.05)!important;
    text-decoration:none!important;
    opacity:1!important;
    pointer-events:auto!important;
  }

  html body .payments-footer-bar .client-footer-pages a.disabled{
    opacity:.36!important;
    pointer-events:none!important;
  }

  html body .payments-footer-bar .client-footer-pages strong{
    min-width:74px!important;
    text-align:center!important;
    color:#0f172a!important;
    font-size:12px!important;
    font-weight:950!important;
    line-height:34px!important;
  }
}

/* Mobile pass 40 - Payments bottom spacing compact. Desktop untouched. */
@media (max-width: 768px){
  html body .payments-content{
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 58px + env(safe-area-inset-bottom,0px))!important;
    scroll-padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 58px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .payments-table-card{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  html body .payments-table-card::after{
    height:10px!important;
    min-height:10px!important;
  }

  html body .payments-table tbody tr:last-child{
    margin-bottom:8px!important;
  }
}

/* Mobile WhatsApp app-style layout */
.tb-wa-mobile-back{display:none;}
@media (max-width: 767px){
  html body .content-area:has(.tb-whatsapp-page:not(.query-embed)){
    padding:0 0 calc(62px + env(safe-area-inset-bottom,0px)) 0!important;
    overflow:hidden!important;
    background:#e9eef5!important;
  }
  html body .tb-whatsapp-page:not(.query-embed){
    position:relative!important;
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:calc(100dvh - 116px - env(safe-area-inset-bottom,0px))!important;
    min-height:0!important;
    max-height:calc(100dvh - 116px - env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:#f0f2f5!important;
    overflow:hidden!important;
  }
  html body .tb-whatsapp-page:not(.query-embed).mobile-list-mode .tb-wa-left,
  html body .tb-whatsapp-page:not(.query-embed):not(.mobile-chat-mode) .tb-wa-left{
    display:flex!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    flex:1 1 auto!important;
    border:0!important;
    background:#fff!important;
    overflow:hidden!important;
  }
  html body .tb-whatsapp-page:not(.query-embed).mobile-list-mode .tb-wa-center,
  html body .tb-whatsapp-page:not(.query-embed):not(.mobile-chat-mode) .tb-wa-center{
    display:none!important;
  }
  html body .tb-whatsapp-page:not(.query-embed).mobile-chat-mode .tb-wa-left{
    display:none!important;
  }
  html body .tb-whatsapp-page:not(.query-embed).mobile-chat-mode .tb-wa-center{
    display:flex!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    flex:1 1 auto!important;
    border:0!important;
    border-radius:0!important;
    overflow:hidden!important;
    background:#efe7dd url('../images/whatsappbg.png') center center/360px auto repeat!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-left-head{
    height:54px!important;
    min-height:54px!important;
    padding:0 14px!important;
    display:flex!important;
    align-items:center!important;
    border:0!important;
    background:#075e54!important;
    color:#fff!important;
    box-sizing:border-box!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-left-title{
    color:#fff!important;
    font-size:19px!important;
    line-height:54px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-left-title i{
    width:30px!important;
    height:30px!important;
    min-width:30px!important;
    border-radius:50%!important;
    background:rgba(255,255,255,.16)!important;
    color:#fff!important;
    font-size:18px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-search{
    position:sticky!important;
    top:0!important;
    z-index:8!important;
    padding:10px 12px!important;
    border-bottom:1px solid #edf2f7!important;
    background:#fff!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-search-box{
    height:42px!important;
    border-radius:21px!important;
    background:#f0f2f5!important;
    border:0!important;
    padding:0 14px!important;
    box-shadow:none!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-search-box input{
    height:40px!important;
    font-size:16px!important;
    font-weight:700!important;
    color:#111827!important;
    background:transparent!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-connection{
    margin:8px 12px!important;
    border-radius:14px!important;
    padding:10px 12px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-tabs{
    display:flex!important;
    overflow-x:auto!important;
    padding:8px 12px 10px!important;
    gap:8px!important;
    margin:0!important;
    border-bottom:1px solid #edf2f7!important;
    background:#fff!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-width:none!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-tabs::-webkit-scrollbar{display:none!important;}
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-tabs button{
    height:32px!important;
    border-radius:16px!important;
    padding:0 14px!important;
    background:#f0f2f5!important;
    color:#334155!important;
    font-size:12px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-tabs button.active{
    background:#dcfce7!important;
    color:#15803d!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-list{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:0!important;
    background:#fff!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-row{
    position:relative!important;
    display:flex!important;
    align-items:center!important;
    gap:12px!important;
    padding:12px 12px!important;
    min-height:72px!important;
    border-bottom:1px solid #f0f2f5!important;
    background:#fff!important;
    color:#111827!important;
    box-sizing:border-box!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-row.active,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-row:hover{
    background:#f5fff9!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-avatar{
    width:50px!important;
    height:50px!important;
    min-width:50px!important;
    flex-basis:50px!important;
    font-size:16px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-main{min-width:0!important;}
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-top b{
    font-size:15px!important;
    line-height:20px!important;
    max-width:calc(100vw - 130px)!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-top span{
    font-size:11px!important;
    color:#64748b!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-mobile{
    font-size:12px!important;
    line-height:17px!important;
    color:#475569!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-last{
    font-size:13px!important;
    line-height:18px!important;
    max-width:calc(100vw - 92px)!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-unread{
    right:12px!important;
    bottom:13px!important;
    background:#25d366!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-mobile-back{
    display:flex!important;
    width:38px!important;
    height:38px!important;
    min-width:38px!important;
    border:0!important;
    border-radius:19px!important;
    background:transparent!important;
    color:#fff!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:20px!important;
    text-decoration:none!important;
    margin-left:-6px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-head{
    height:58px!important;
    min-height:58px!important;
    flex:0 0 58px!important;
    padding:0 10px!important;
    gap:8px!important;
    background:#075e54!important;
    border:0!important;
    color:#fff!important;
    z-index:10!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-head .tb-wa-avatar{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    flex-basis:40px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-person{
    flex:1 1 auto!important;
    min-width:0!important;
    gap:9px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-person h3{
    color:#fff!important;
    font-size:15px!important;
    line-height:19px!important;
    max-width:calc(100vw - 132px)!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-person p{
    color:rgba(255,255,255,.82)!important;
    font-size:11px!important;
    line-height:15px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    max-width:calc(100vw - 132px)!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-tools{
    flex:0 0 auto!important;
    gap:4px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-contact-toggle span{display:none!important;}
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-tools button,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-chat-tools a{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    border:0!important;
    background:rgba(255,255,255,.12)!important;
    color:#fff!important;
    border-radius:17px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-messages{
    flex:1 1 auto!important;
    min-height:0!important;
    height:auto!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    padding:12px 10px 14px!important;
    gap:8px!important;
    -webkit-overflow-scrolling:touch!important;
    overscroll-behavior:contain!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-bubble{
    max-width:84%!important;
    font-size:13px!important;
    line-height:19px!important;
    border-radius:12px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-image img{
    max-height:220px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-compose{
    position:relative!important;
    flex:0 0 auto!important;
    width:100%!important;
    min-height:62px!important;
    height:auto!important;
    padding:8px 8px calc(8px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    background:#f0f2f5!important;
    border-top:1px solid rgba(0,0,0,.06)!important;
    display:flex!important;
    align-items:flex-end!important;
    gap:7px!important;
    box-sizing:border-box!important;
    z-index:12!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-compose .tb-wa-attach-wrap{
    flex:0 0 auto!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-compose button.tb-wa-attach{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    border-radius:20px!important;
    background:#fff!important;
    color:#54656f!important;
    border:0!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-compose textarea{
    flex:1 1 auto!important;
    min-width:0!important;
    height:42px!important;
    min-height:42px!important;
    max-height:100px!important;
    border-radius:21px!important;
    border:0!important;
    background:#fff!important;
    padding:11px 14px!important;
    font-size:16px!important;
    line-height:20px!important;
    color:#111827!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-compose button.tb-wa-send{
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    border-radius:21px!important;
    background:#00a884!important;
    color:#fff!important;
    border:0!important;
    box-shadow:0 4px 12px rgba(0,168,132,.25)!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu{
    position:absolute!important;
    left:8px!important;
    right:8px!important;
    bottom:58px!important;
    width:auto!important;
    max-width:none!important;
    border-radius:18px!important;
    z-index:60!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-contact-panel,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-file-preview-modal,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-crm-pdf-modal{
    z-index:80!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-file-preview-modal{
    bottom:62px!important;
  }
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-crm-pdf-box,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-file-preview-box{
    max-width:calc(100vw - 16px)!important;
  }
}

/* Mobile responsive pass 42 - hide Email, Travel Masters and Reports from bottom footer menu only */
@media (max-width: 767.98px){
  body .main-menu a.main-menu-item[href*="ga=email_inbox"],
  body .main-menu a.main-menu-item[href*="ga=travel_masters"],
  body .main-menu a.main-menu-item[href*="ga=reports"]{
    display:none!important;
  }
}

/* Mobile responsive pass 43 - Activities main section app style */
@media (max-width: 767.98px){
  html body .activities-page{
    height:auto!important;
    min-height:calc(100dvh - 52px)!important;
    overflow:visible!important;
    background:#eef4f8!important;
    padding:0 0 calc(132px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
  }
  html body .activities-page .activities-tabs{
    position:sticky!important;
    top:0!important;
    z-index:31!important;
    display:grid!important;
    grid-template-columns:repeat(3,1fr)!important;
    gap:0!important;
    width:100%!important;
    height:48px!important;
    min-height:48px!important;
    padding:0!important;
    margin:0!important;
    overflow:hidden!important;
    border-bottom:1px solid #dfe7ef!important;
    background:#fff!important;
    box-shadow:0 1px 0 rgba(15,23,42,.04)!important;
  }
  html body .activities-page .activities-tabs a{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    height:48px!important;
    min-width:0!important;
    padding:0 6px!important;
    border:0!important;
    border-radius:0!important;
    color:#0f172a!important;
    font-size:13px!important;
    line-height:16px!important;
    font-weight:800!important;
    white-space:nowrap!important;
    background:#fff!important;
    text-decoration:none!important;
    box-sizing:border-box!important;
    border-right:1px solid #e4edf5!important;
  }
  html body .activities-page .activities-tabs a:last-child{border-right:0!important;}
  html body .activities-page .activities-tabs a.active{
    color:#008c45!important;
    background:#fff!important;
    border-bottom:2px solid #05b85f!important;
  }
  html body .activities-page .activities-tabs a[href*="tab=calendar"]{
    display:none!important;
  }
  html body .activities-page .content-toolbar.client-toolbar{
    position:sticky!important;
    top:48px!important;
    z-index:30!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    height:auto!important;
    min-height:58px!important;
    padding:9px 12px!important;
    margin:0!important;
    border:0!important;
    border-bottom:1px solid #dfe7ef!important;
    background:rgba(255,255,255,.96)!important;
    backdrop-filter:blur(10px)!important;
    box-shadow:0 8px 18px rgba(15,23,42,.06)!important;
    box-sizing:border-box!important;
  }
  html body .activities-page .content-toolbar .left-tools{
    flex:1 1 auto!important;
    min-width:0!important;
    width:auto!important;
    display:block!important;
  }
  html body .activities-page .client-custom-search{
    width:100%!important;
    height:40px!important;
    min-width:0!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    position:relative!important;
    background:#fff!important;
    border:1px solid #cfdceb!important;
    border-radius:22px!important;
    padding:0 42px 0 14px!important;
    box-shadow:0 2px 8px rgba(15,23,42,.04)!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  html body .activities-page .client-custom-search input{
    flex:1 1 auto!important;
    min-width:0!important;
    width:100%!important;
    height:38px!important;
    border:0!important;
    outline:0!important;
    background:transparent!important;
    padding:0!important;
    color:#111827!important;
    caret-color:#05b85f!important;
    font-size:16px!important;
    line-height:38px!important;
    font-weight:600!important;
  }
  html body .activities-page .client-custom-search input::placeholder{
    color:#6b7d91!important;
    opacity:1!important;
    font-weight:500!important;
  }
  html body .activities-page .client-custom-search button{
    position:absolute!important;
    right:4px!important;
    top:3px!important;
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    padding:0!important;
    border:0!important;
    border-radius:50%!important;
    background:#fff!important;
    color:#35506d!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:17px!important;
  }
  html body .activities-page .client-custom-search a{
    display:none!important;
  }
  html body .activities-page .right-tools.client-right-tools{
    flex:0 0 auto!important;
    width:auto!important;
    min-width:auto!important;
    display:flex!important;
    align-items:center!important;
    gap:0!important;
    margin:0!important;
  }
  html body .activities-page .client-create-wrap{
    position:static!important;
    display:flex!important;
    align-items:center!important;
    width:auto!important;
    margin:0!important;
  }
  html body .activities-page .client-main-create,
  html body .activities-page .create-btn.client-main-create{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:5px!important;
    height:40px!important;
    min-height:40px!important;
    min-width:84px!important;
    max-width:110px!important;
    padding:0 14px!important;
    border-radius:22px!important;
    background:#05b85f!important;
    color:#fff!important;
    border:0!important;
    box-shadow:0 8px 16px rgba(5,184,95,.18)!important;
    font-size:13px!important;
    line-height:16px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }
  html body .activities-page .client-main-create i{font-size:15px!important;}
  html body .activities-page .client-create-arrow,
  html body .activities-page .client-create-menu,
  html body .activities-page .client-more-wrap,
  html body .activities-page .client-bulk-bar{
    display:none!important;
  }
  html body .activities-page .client-body,
  html body .activities-page .client-list-area,
  html body .activities-page .client-table-wrap{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:0!important;
    overflow:visible!important;
    padding:0!important;
    margin:0!important;
    background:#eef4f8!important;
    border:0!important;
    box-shadow:none!important;
  }
  html body .activities-page .client-list-area{
    padding:12px 12px 8px!important;
    box-sizing:border-box!important;
  }
  html body .activities-page table.activity-table,
  html body .activities-page .activity-table{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    border:0!important;
    border-collapse:separate!important;
    background:transparent!important;
    box-shadow:none!important;
    table-layout:auto!important;
  }
  html body .activities-page .activity-table thead{
    display:none!important;
  }
  html body .activities-page .activity-table tbody{
    display:block!important;
    width:100%!important;
  }
  html body .activities-page .activity-table tr.activity-list-row{
    position:relative!important;
    display:block!important;
    width:100%!important;
    min-height:164px!important;
    padding:16px 62px 14px 16px!important;
    margin:0 0 10px!important;
    background:#fff!important;
    border:1px solid #e4edf5!important;
    border-radius:16px!important;
    box-shadow:0 5px 14px rgba(15,23,42,.05)!important;
    overflow:hidden!important;
    cursor:pointer!important;
    box-sizing:border-box!important;
    text-align:left!important;
  }
  html body .activities-page .activity-table tr.activity-list-row:active{
    transform:scale(.995)!important;
    background:#fbfffd!important;
  }
  html body .activities-page .activity-table tr:not(.activity-list-row){
    display:block!important;
    width:100%!important;
  }
  html body .activities-page .activity-table td,
  html body .activities-page .activity-table th{
    border:0!important;
  }
  html body .activities-page .activity-table .activity-check-cell,
  html body .activities-page .activity-table td:first-child:not(.activity-card-cell),
  html body .activities-page .activity-table th.check-col{
    display:none!important;
  }
  html body .activities-page .activity-table td.activity-card-cell{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:0!important;
    margin:0 0 8px!important;
    background:transparent!important;
    color:#111827!important;
    font-size:13px!important;
    line-height:18px!important;
    font-weight:800!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    text-align:left!important;
    box-sizing:border-box!important;
  }
  html body .activities-page .activity-table td.activity-card-cell::before{
    content:attr(data-label)!important;
    display:block!important;
    margin:0 0 2px!important;
    color:#66768b!important;
    font-size:11px!important;
    line-height:14px!important;
    font-weight:900!important;
    letter-spacing:.01em!important;
  }
  html body .activities-page .activity-table td.activity-card-primary{
    padding-right:0!important;
    margin:0 0 11px!important;
  }
  html body .activities-page .activity-table td.activity-card-primary::before{
    display:none!important;
  }
  html body .activities-page .activity-table td.activity-card-primary,
  html body .activities-page .activity-table td.activity-card-primary a,
  html body .activities-page .activity-table td.activity-col-subject,
  html body .activities-page .activity-table td.activity-col-subject a{
    display:block!important;
    color:#071427!important;
    font-size:15px!important;
    line-height:20px!important;
    font-weight:950!important;
    text-decoration:none!important;
    white-space:normal!important;
    word-break:break-word!important;
    overflow:visible!important;
    text-align:left!important;
  }
  html body .activities-page .activity-table td.activity-col-due_at,
  html body .activities-page .activity-table td.activity-col-priority,
  html body .activities-page .activity-table td.activity-col-related_to,
  html body .activities-page .activity-table td.activity-col-owner_name,
  html body .activities-page .activity-table td.activity-col-task_owner{
    color:#0f172a!important;
    font-size:13px!important;
    line-height:18px!important;
    font-weight:750!important;
  }
  html body .activities-page .activity-table td.activity-col-status{
    margin-top:2px!important;
  }
  html body .activities-page .activity-table td.activity-col-status::before{
    display:none!important;
  }
  html body .activities-page .activity-table .tbact-status-badge{
    display:inline-flex!important;
    align-items:center!important;
    height:24px!important;
    max-width:max-content!important;
    padding:0 10px!important;
    border-radius:13px!important;
    font-size:11px!important;
    line-height:24px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }
  html body .activities-page .activity-table .owner-dot{
    width:20px!important;
    height:20px!important;
    min-width:20px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    font-size:10px!important;
    vertical-align:middle!important;
    margin-right:5px!important;
  }
  html body .activities-page .activity-table .client-row-actions{
    position:absolute!important;
    right:12px!important;
    top:12px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:flex-end!important;
    gap:8px!important;
    width:auto!important;
    min-width:auto!important;
    padding:0!important;
    margin:0!important;
    background:transparent!important;
    z-index:2!important;
  }
  html body .activities-page .activity-table .client-row-actions button{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    border-radius:17px!important;
    padding:0!important;
    margin:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    background:#eafff5!important;
    color:#00a86b!important;
    box-shadow:none!important;
    font-size:15px!important;
  }
  html body .activities-page .activity-table .client-row-actions button + button{
    background:#fff0f2!important;
    color:#ef4444!important;
  }
  html body .activities-page .activity-table .client-empty{
    display:block!important;
    width:100%!important;
    padding:34px 12px!important;
    margin:12px 0!important;
    border-radius:16px!important;
    background:#fff!important;
    color:#64748b!important;
    text-align:center!important;
  }
  html body .activities-page .client-footer-stats{
    display:none!important;
  }
  html body .activities-page .client-footer-bar{
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:calc(68px + env(safe-area-inset-bottom,0px))!important;
    z-index:42!important;
    width:100%!important;
    max-width:100%!important;
    height:54px!important;
    min-height:54px!important;
    margin:0!important;
    padding:7px 12px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border:0!important;
    border-top:1px solid #e3edf6!important;
    background:rgba(255,255,255,.97)!important;
    box-shadow:0 -8px 20px rgba(15,23,42,.10)!important;
    backdrop-filter:blur(10px)!important;
    box-sizing:border-box!important;
  }
  html body .activities-page .client-footer-pages{
    width:100%!important;
    display:grid!important;
    grid-template-columns:76px 40px 1fr 40px!important;
    align-items:center!important;
    justify-items:center!important;
    gap:8px!important;
    margin:0!important;
  }
  html body .activities-page .client-footer-pages > span{
    display:none!important;
  }
  html body .activities-page .client-footer-pages select{
    width:76px!important;
    height:36px!important;
    padding:0 12px!important;
    border-radius:18px!important;
    border:1px solid #cbd8e6!important;
    background:#fff!important;
    color:#0f172a!important;
    font-size:13px!important;
    font-weight:900!important;
    text-align:center!important;
  }
  html body .activities-page .client-footer-pages a{
    width:36px!important;
    height:36px!important;
    min-width:36px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    background:#f8fbff!important;
    color:#244260!important;
    border:1px solid #dbe8f4!important;
    text-decoration:none!important;
    opacity:1!important;
  }
  html body .activities-page .client-footer-pages a.disabled{
    opacity:.35!important;
    pointer-events:none!important;
  }
  html body .activities-page .client-footer-pages strong{
    font-size:12px!important;
    line-height:16px!important;
    font-weight:900!important;
    color:#111827!important;
    white-space:nowrap!important;
  }
  html body .activities-page .tb-activity-calendar,
  html body .activities-page .tb-activity-calendar-head,
  html body .activities-page .tb-activity-calendar-grid{
    display:none!important;
  }

  /* Activity detail page mobile polish */
  html body .activity-detail-page{
    background:#eef4f8!important;
    padding-bottom:calc(84px + env(safe-area-inset-bottom,0px))!important;
  }
  html body .activity-detail-page .detail-topbar{
    display:block!important;
    padding:14px 14px 10px!important;
    background:#fff!important;
    border-bottom:1px solid #e3edf6!important;
  }
  html body .activity-detail-page .detail-title-wrap{
    display:flex!important;
    align-items:flex-start!important;
    gap:10px!important;
    min-width:0!important;
  }
  html body .activity-detail-page .detail-title-wrap h1{
    font-size:19px!important;
    line-height:24px!important;
    font-weight:950!important;
    margin:0 0 5px!important;
    color:#071427!important;
    word-break:break-word!important;
  }
  html body .activity-detail-page .detail-actions{
    margin-top:12px!important;
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }
  html body .activity-detail-page .detail-actions form{flex:1 1 auto!important;}
  html body .activity-detail-page .detail-actions .drawer-save{
    width:100%!important;
    height:40px!important;
    border-radius:20px!important;
    font-size:13px!important;
    font-weight:900!important;
    white-space:nowrap!important;
  }
  html body .activity-detail-page .detail-round-btn{
    width:40px!important;
    height:40px!important;
    min-width:40px!important;
    border-radius:20px!important;
  }
  html body .activity-detail-page .activity-detail-layout{
    display:block!important;
    padding:12px!important;
    background:#eef4f8!important;
  }
  html body .activity-detail-page .activity-detail-main,
  html body .activity-detail-page .activity-detail-side{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    padding:0!important;
    margin:0!important;
    border:0!important;
    overflow:visible!important;
  }
  html body .activity-detail-page .activity-detail-card,
  html body .activity-detail-page .activity-related-card{
    border-radius:16px!important;
    border:1px solid #e2edf6!important;
    background:#fff!important;
    box-shadow:0 5px 14px rgba(15,23,42,.04)!important;
    padding:16px!important;
    margin:0 0 12px!important;
  }
  html body .activity-detail-page .activity-detail-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
  }
}

/* Mobile responsive pass 44 - activity spacing/actions and settings app tabs */
@media (max-width: 767.98px){
  /* Activity main list: remove excessive blank area before footer and prevent actions over dates. */
  html body .activities-page{
    min-height:auto!important;
    padding-bottom:calc(74px + env(safe-area-inset-bottom,0px))!important;
    background:#eef4f8!important;
  }
  html body .activities-page .client-body,
  html body .activities-page .client-list-area,
  html body .activities-page .client-table-wrap{
    min-height:0!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
  html body .activities-page .client-list-area{
    padding:12px 12px 6px!important;
  }
  html body .activities-page .activity-table tbody{
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
  html body .activities-page .activity-table tr.activity-list-row{
    min-height:0!important;
    padding:54px 16px 14px 16px!important;
    margin-bottom:10px!important;
    text-align:left!important;
  }
  html body .activities-page .activity-table td.activity-card-cell,
  html body .activities-page .activity-table td.activity-card-cell *,
  html body .activities-page .activity-table td.activity-card-primary,
  html body .activities-page .activity-table td.activity-card-primary *,
  html body .activities-page .activity-table td.activity-col-subject,
  html body .activities-page .activity-table td.activity-col-subject *,
  html body .activities-page .activity-table td.activity-col-due_at,
  html body .activities-page .activity-table td.activity-col-priority,
  html body .activities-page .activity-table td.activity-col-related_to,
  html body .activities-page .activity-table td.activity-col-owner_name,
  html body .activities-page .activity-table td.activity-col-task_owner{
    text-align:left!important;
  }
  html body .activities-page .activity-table .client-row-actions{
    top:12px!important;
    right:14px!important;
    z-index:4!important;
  }
  html body .activities-page .activity-table td.activity-card-primary,
  html body .activities-page .activity-table td.activity-col-subject{
    padding-right:0!important;
    margin-top:0!important;
  }
  html body .activities-page .activity-table td.activity-col-due_at{
    margin-top:4px!important;
    padding-right:0!important;
    clear:both!important;
  }
  html body .activities-page .activity-table td.activity-col-status{
    margin:4px 0 9px!important;
  }
  html body .activities-page .client-footer-bar{
    position:sticky!important;
    bottom:calc(68px + env(safe-area-inset-bottom,0px))!important;
    left:auto!important;
    right:auto!important;
    margin:2px 0 0!important;
    width:100%!important;
    border-radius:0!important;
  }

  /* Settings mobile: keep only Account, Users & Controls, Organization in top menu. */
  html body .settings-left{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    padding:9px 10px!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    background:#003f4c!important;
    border:0!important;
    box-shadow:0 2px 8px rgba(15,23,42,.12)!important;
    scrollbar-width:none!important;
  }
  html body .settings-left::-webkit-scrollbar{display:none!important;}
  html body .settings-left .settings-title,
  html body .settings-left .settings-group-title,
  html body .settings-left .settings-left-link{
    display:none!important;
  }
  html body .settings-left .settings-left-link[href*="s=account"],
  html body .settings-left .settings-left-link[href*="s=users_controls"],
  html body .settings-left .settings-left-link[href*="s=organization"]{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    min-width:max-content!important;
    height:34px!important;
    padding:0 13px!important;
    margin:0!important;
    border-radius:18px!important;
    border:1px solid rgba(255,255,255,.78)!important;
    background:rgba(255,255,255,.04)!important;
    color:#fff!important;
    font-size:12px!important;
    line-height:34px!important;
    font-weight:850!important;
    white-space:nowrap!important;
    text-decoration:none!important;
  }
  html body .settings-left .settings-left-link[href*="s=account"].active,
  html body .settings-left .settings-left-link[href*="s=users_controls"].active,
  html body .settings-left .settings-left-link[href*="s=organization"].active{
    background:#05b85f!important;
    border-color:#05b85f!important;
    color:#fff!important;
    box-shadow:0 6px 14px rgba(5,184,95,.20)!important;
  }

  /* Settings inner tabs: app-like horizontal pills/segments. */
  html body .settings-main .settings-top{
    position:sticky!important;
    top:52px!important;
    z-index:28!important;
    background:#fff!important;
    border-bottom:1px solid #e4edf5!important;
  }
  html body .settings-main .settings-tabs,
  html body .settings-status-tabs,
  html body .organization-tabs{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    height:auto!important;
    min-height:48px!important;
    padding:8px 12px!important;
    margin:0!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    white-space:nowrap!important;
    background:#fff!important;
    border:0!important;
    scrollbar-width:none!important;
    box-sizing:border-box!important;
  }
  html body .settings-main .settings-tabs::-webkit-scrollbar,
  html body .settings-status-tabs::-webkit-scrollbar,
  html body .organization-tabs::-webkit-scrollbar{display:none!important;}
  html body .settings-main .settings-tabs .settings-tab,
  html body .settings-status-tabs a,
  html body .organization-tabs a{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    flex:0 0 auto!important;
    height:34px!important;
    min-width:max-content!important;
    padding:0 14px!important;
    border-radius:18px!important;
    border:1px solid #d9e5f0!important;
    background:#fff!important;
    color:#12213a!important;
    font-size:13px!important;
    line-height:34px!important;
    font-weight:800!important;
    text-decoration:none!important;
    box-shadow:0 1px 4px rgba(15,23,42,.03)!important;
  }
  html body .settings-main .settings-tabs .settings-tab.active,
  html body .settings-status-tabs a.active,
  html body .organization-tabs a.active{
    background:#e9fff5!important;
    border-color:#05b85f!important;
    color:#007a40!important;
    box-shadow:0 5px 12px rgba(5,184,95,.10)!important;
  }
  html body .settings-content-box,
  html body .tb-account-settings-box{
    padding-bottom:calc(82px + env(safe-area-inset-bottom,0px))!important;
  }
}

/* Mobile responsive pass 45 - WhatsApp attachment menu cleanup */
@media (max-width: 767.98px){
  html body .tb-whatsapp-page .tb-wa-attach-menu,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu{
    left:10px!important;
    right:10px!important;
    bottom:70px!important;
    width:auto!important;
    min-width:0!important;
    max-width:calc(100vw - 20px)!important;
    max-height:42vh!important;
    padding:12px!important;
    border:1px solid rgba(15,23,42,.08)!important;
    border-radius:22px!important;
    background:#ffffff!important;
    box-shadow:0 18px 48px rgba(15,23,42,.24)!important;
    z-index:999999!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    box-sizing:border-box!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body.tb-wa-query-fullscreen-open .tb-whatsapp-page.query-embed .tb-wa-attach-menu,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu{
    position:fixed!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu.show,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu.show,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu.show{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu label,
  html body .tb-whatsapp-page .tb-wa-attach-menu button,
  html body .tb-whatsapp-page .tb-wa-attach-menu .tb-wa-attach-option,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu label,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu button,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu .tb-wa-attach-option,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu label,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu button,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu .tb-wa-attach-option{
    width:100%!important;
    min-width:0!important;
    min-height:86px!important;
    height:auto!important;
    margin:0!important;
    padding:10px 8px!important;
    border:0!important;
    border-radius:18px!important;
    background:#f8fafc!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:center!important;
    justify-content:center!important;
    gap:6px!important;
    text-align:center!important;
    box-sizing:border-box!important;
    white-space:normal!important;
    overflow:visible!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu label:hover,
  html body .tb-whatsapp-page .tb-wa-attach-menu button:hover,
  html body .tb-whatsapp-page .tb-wa-attach-menu .tb-wa-attach-option:hover{
    background:#eefcf5!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu span,
  html body .tb-whatsapp-page .tb-wa-attach-menu .tb-wa-attach-option span,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu span,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu .tb-wa-attach-option span,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu span,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu .tb-wa-attach-option span{
    grid-row:auto!important;
    width:42px!important;
    height:42px!important;
    min-width:42px!important;
    min-height:42px!important;
    border-radius:18px!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    margin:0!important;
    font-size:19px!important;
    line-height:1!important;
    flex:0 0 auto!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu span.doc{background:#7c3aed!important;color:#fff!important;}
  html body .tb-whatsapp-page .tb-wa-attach-menu span.media{background:#db2777!important;color:#fff!important;}
  html body .tb-whatsapp-page .tb-wa-attach-menu span.audio{background:#ea580c!important;color:#fff!important;}
  html body .tb-whatsapp-page .tb-wa-attach-menu span.contact{background:#059669!important;color:#fff!important;}
  html body .tb-whatsapp-page .tb-wa-attach-menu .tb-wa-attach-option span.crm{background:#fee2e2!important;color:#dc2626!important;}

  html body .tb-whatsapp-page .tb-wa-attach-menu b,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu b,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu b{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#0f172a!important;
    font-size:12px!important;
    font-weight:900!important;
    line-height:15px!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    text-align:center!important;
    overflow:visible!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu small,
  html body .tb-whatsapp-page.query-embed .tb-wa-attach-menu small,
  html body .tb-whatsapp-page:not(.query-embed) .tb-wa-attach-menu small{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    margin:0!important;
    padding:0!important;
    color:#64748b!important;
    font-size:10px!important;
    font-weight:700!important;
    line-height:13px!important;
    white-space:normal!important;
    word-break:normal!important;
    overflow-wrap:break-word!important;
    text-align:center!important;
    overflow:visible!important;
  }

  html body .tb-whatsapp-page .tb-wa-attach-menu input[type="file"]{
    display:none!important;
  }
}


/* v46 Mobile dashboard app-style polish */
@media (max-width: 767px){
  html body .content-area:has(.tb-fixed-dashboard){
    background:#eef5f8!important;
    overflow:auto!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:74px!important;
  }

  html body .tb-fixed-dashboard{
    min-height:auto!important;
    background:#eef5f8!important;
    padding:10px 12px 82px!important;
    color:#071827!important;
  }

  html body .tb-fixed-dashboard .tb-dash-head{
    display:block!important;
    width:100%!important;
    margin:0 0 12px!important;
    padding:14px!important;
    border:0!important;
    border-radius:22px!important;
    background:linear-gradient(145deg,#053f52 0%,#0b6b69 58%,#11b96e 100%)!important;
    box-shadow:0 14px 32px rgba(2,48,71,.18)!important;
    color:#fff!important;
  }

  html body .tb-fixed-dashboard .tb-dash-title{
    display:grid!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    align-items:center!important;
    gap:12px!important;
    margin:0 0 13px!important;
    min-width:0!important;
  }

  html body .tb-fixed-dashboard .tb-dash-title-icon{
    width:40px!important;
    height:40px!important;
    border-radius:16px!important;
    background:rgba(255,255,255,.18)!important;
    color:#fff!important;
    font-size:18px!important;
    box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)!important;
  }

  html body .tb-fixed-dashboard .tb-dash-title h1{
    margin:0!important;
    color:#fff!important;
    font-size:20px!important;
    line-height:24px!important;
    letter-spacing:-.02em!important;
    font-weight:950!important;
    white-space:normal!important;
  }

  html body .tb-fixed-dashboard .tb-dash-title p{
    margin:3px 0 0!important;
    color:rgba(255,255,255,.82)!important;
    font-size:12px!important;
    line-height:16px!important;
    font-weight:700!important;
    white-space:normal!important;
  }

  html body .tb-fixed-dashboard .tb-dash-title p span{color:#bfffe4!important;}

  html body .tb-fixed-dashboard .tb-dash-filter{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    width:100%!important;
    margin:0!important;
    align-items:center!important;
  }

  html body .tb-fixed-dashboard .tb-dash-filter>input[type="hidden"]{
    display:none!important;
  }

  html body .tb-fixed-dashboard .tb-dash-filter select,
  html body .tb-fixed-dashboard .tb-dash-filter input{
    width:100%!important;
    max-width:100%!important;
    height:42px!important;
    min-height:42px!important;
    padding:0 12px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    border-radius:14px!important;
    background:rgba(255,255,255,.95)!important;
    color:#0f172a!important;
    font-size:13px!important;
    font-weight:850!important;
    box-shadow:0 8px 16px rgba(2,48,71,.08)!important;
  }

  html body .tb-fixed-dashboard .tb-dash-filter select:first-of-type{
    grid-column:1 / -1!important;
  }

  html body .tb-fixed-dashboard .tb-dash-custom-dates{
    grid-column:1 / -1!important;
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    gap:9px!important;
    width:100%!important;
    margin:0!important;
  }

  html body .tb-fixed-dashboard .tb-dash-custom-dates button{
    grid-column:1 / -1!important;
    height:42px!important;
    border:0!important;
    border-radius:14px!important;
    background:#11b96e!important;
    color:#fff!important;
    font-size:14px!important;
    font-weight:950!important;
    box-shadow:0 10px 22px rgba(17,185,110,.24)!important;
  }

  html body .tb-fixed-dashboard .tb-dash-user-pill{
    width:100%!important;
    height:40px!important;
    border-radius:14px!important;
    border:1px solid rgba(255,255,255,.18)!important;
    background:rgba(255,255,255,.94)!important;
    color:#075e50!important;
    justify-content:center!important;
    font-size:13px!important;
    box-shadow:0 8px 16px rgba(2,48,71,.08)!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi-grid{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:10px!important;
    margin:0 0 12px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi{
    min-height:124px!important;
    height:auto!important;
    display:flex!important;
    flex-direction:column!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:8px!important;
    padding:13px!important;
    border:1px solid rgba(203,213,225,.72)!important;
    border-radius:20px!important;
    background:#fff!important;
    box-shadow:0 10px 24px rgba(15,23,42,.06)!important;
    overflow:hidden!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi:before{
    background:radial-gradient(circle at top right,rgba(var(--tb-accent-rgb),.12),transparent 52%)!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi-icon{
    width:36px!important;
    height:36px!important;
    border-radius:14px!important;
    font-size:16px!important;
    flex:0 0 auto!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi>div:nth-child(2){
    width:100%!important;
    min-width:0!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi span{
    margin:0 0 5px!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:14px!important;
    font-weight:900!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi b{
    color:#061624!important;
    font-size:20px!important;
    line-height:23px!important;
    letter-spacing:-.03em!important;
    font-weight:950!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi em{
    margin-top:5px!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:14px!important;
    font-weight:800!important;
  }

  html body .tb-fixed-dashboard .tb-dash-kpi-arrow{
    position:absolute!important;
    top:12px!important;
    right:12px!important;
    width:24px!important;
    height:24px!important;
    border-radius:10px!important;
    background:#f8fafc!important;
  }

  html body .tb-fixed-dashboard .tb-dash-grid,
  html body .tb-fixed-dashboard .tb-dash-grid-second,
  html body .tb-fixed-dashboard .tb-dash-grid-third,
  html body .tb-fixed-dashboard .tb-dash-grid-bottom,
  html body .tb-fixed-dashboard .tb-dash-grid-extra{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:12px!important;
    margin:0 0 12px!important;
  }

  html body .tb-fixed-dashboard .tb-span-3,
  html body .tb-fixed-dashboard .tb-span-4,
  html body .tb-fixed-dashboard .tb-span-12,
  html body .tb-fixed-dashboard .tb-dash-wide{
    grid-column:1 / -1!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card,
  html body .tb-fixed-dashboard .tb-dash-panel{
    min-height:0!important;
    height:auto!important;
    border:1px solid rgba(203,213,225,.66)!important;
    border-radius:22px!important;
    background:#fff!important;
    box-shadow:0 10px 26px rgba(15,23,42,.055)!important;
    overflow:hidden!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head{
    height:auto!important;
    min-height:0!important;
    padding:14px!important;
    border-bottom:1px solid #edf3f7!important;
    align-items:center!important;
    gap:10px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head>div{
    display:grid!important;
    grid-template-columns:34px minmax(0,1fr)!important;
    column-gap:10px!important;
    row-gap:0!important;
    align-items:center!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head i:first-child{
    width:34px!important;
    height:34px!important;
    border-radius:14px!important;
    font-size:16px!important;
    background:linear-gradient(135deg,rgba(var(--tb-accent-rgb),.15),rgba(20,184,166,.12))!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head h3{
    color:#061624!important;
    font-size:15px!important;
    line-height:19px!important;
    font-weight:950!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head p{
    margin-top:2px!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:14px!important;
    font-weight:800!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-card-head>a{
    width:32px!important;
    height:32px!important;
    border-radius:13px!important;
    background:#f7fbff!important;
    color:var(--tb-accent)!important;
    flex:0 0 auto!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list{
    padding:12px!important;
    display:flex!important;
    flex-direction:column!important;
    gap:9px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list.is-scrollable,
  html body .tb-fixed-dashboard .tb-dash-count-rows.is-scrollable{
    max-height:none!important;
    overflow:visible!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list-row{
    min-height:0!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:10px!important;
    align-items:center!important;
    padding:11px!important;
    border:1px solid #edf3f7!important;
    border-radius:16px!important;
    background:#f8fbfd!important;
    box-shadow:none!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list-row div{
    min-width:0!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list-row b{
    max-width:100%!important;
    color:#071827!important;
    font-size:12px!important;
    line-height:16px!important;
    font-weight:950!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list-row span{
    max-width:100%!important;
    color:#64748b!important;
    font-size:11px!important;
    line-height:14px!important;
    font-weight:800!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-list-row em,
  html body .tb-fixed-dashboard .tb-dash-followup-badge,
  html body .tb-fixed-dashboard .tb-dash-tour-badge{
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    min-height:24px!important;
    max-width:116px!important;
    padding:4px 8px!important;
    border-radius:999px!important;
    font-size:10px!important;
    line-height:12px!important;
    font-weight:950!important;
    white-space:normal!important;
    text-align:center!important;
    background:#eafff5!important;
    color:#008060!important;
  }

  html body .tb-fixed-dashboard .tb-dash-bars{
    padding:13px 14px 15px!important;
    gap:12px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-bar-row{
    display:grid!important;
    grid-template-columns:1fr auto!important;
    gap:7px 10px!important;
    align-items:center!important;
    padding:10px!important;
    border:1px solid #edf3f7!important;
    border-radius:15px!important;
    background:#f8fbfd!important;
  }

  html body .tb-fixed-dashboard .tb-dash-bar-row label{
    color:#334155!important;
    font-size:12px!important;
    line-height:15px!important;
    font-weight:900!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-bar-row div{
    grid-column:1 / -1!important;
    height:8px!important;
    border-radius:10px!important;
    background:#e7eef4!important;
  }

  html body .tb-fixed-dashboard .tb-dash-bar-row b{
    font-size:12px!important;
    font-weight:950!important;
    color:#0f172a!important;
  }

  html body .tb-fixed-dashboard .tb-dash-donut-wrap{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    padding:16px 14px!important;
    text-align:center!important;
    justify-items:center!important;
  }

  html body .tb-fixed-dashboard .tb-dash-donut{
    width:126px!important;
    height:126px!important;
    margin:0 auto!important;
  }

  html body .tb-fixed-dashboard .tb-dash-donut span{
    font-size:20px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-legend{
    width:100%!important;
    gap:8px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-legend a,
  html body .tb-fixed-dashboard .tb-dash-legend div{
    display:grid!important;
    grid-template-columns:12px minmax(0,1fr) auto!important;
    gap:9px!important;
    align-items:center!important;
    width:100%!important;
    padding:8px 10px!important;
    border-radius:13px!important;
    background:#f8fbfd!important;
    text-align:left!important;
    color:#475569!important;
    font-size:12px!important;
    line-height:15px!important;
    font-weight:850!important;
  }

  html body .tb-fixed-dashboard .tb-dash-legend span{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-trend{
    padding:12px 12px 26px!important;
    overflow-x:auto!important;
    -webkit-overflow-scrolling:touch!important;
  }

  html body .tb-fixed-dashboard .tb-dash-trend-legend{
    justify-content:flex-start!important;
    margin:0 0 10px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-trend-bars{
    min-width:520px!important;
    height:148px!important;
    display:grid!important;
    grid-template-columns:repeat(12,minmax(32px,1fr))!important;
    gap:8px!important;
    padding:0 4px 0!important;
    align-items:end!important;
  }

  html body .tb-fixed-dashboard .tb-dash-trend-bars a,
  html body .tb-fixed-dashboard .tb-dash-trend-bars div{
    height:100%!important;
    display:flex!important;
    align-items:flex-end!important;
    justify-content:center!important;
    gap:4px!important;
    position:relative!important;
    text-decoration:none!important;
    color:inherit!important;
  }

  html body .tb-fixed-dashboard .tb-dash-trend-bars span{
    width:9px!important;
    border-radius:8px 8px 0 0!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-list{
    padding:12px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-head{
    display:none!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-rows{
    display:flex!important;
    flex-direction:column!important;
    gap:8px!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto auto!important;
    gap:10px!important;
    align-items:center!important;
    padding:10px 11px!important;
    border:1px solid #edf3f7!important;
    border-radius:15px!important;
    background:#f8fbfd!important;
    text-decoration:none!important;
    color:#0f172a!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-row span{
    color:#071827!important;
    font-size:12px!important;
    line-height:15px!important;
    font-weight:900!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-row b{
    min-width:30px!important;
    height:24px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:999px!important;
    background:#edf6ff!important;
    color:#0f172a!important;
    font-size:11px!important;
    font-weight:950!important;
  }

  html body .tb-fixed-dashboard .tb-dash-count-row b.confirmed{
    background:#dcfce7!important;
    color:#007a54!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    padding:12px!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-item{
    display:grid!important;
    grid-template-columns:1fr 44px auto!important;
    align-items:center!important;
    gap:10px!important;
    min-height:64px!important;
    padding:11px!important;
    border:1px solid #edf3f7!important;
    border-radius:16px!important;
    background:#f8fbfd!important;
    text-align:left!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-item span{
    color:#071827!important;
    font-size:12px!important;
    font-weight:950!important;
    line-height:15px!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-item img,
  html body .tb-fixed-dashboard .tb-weather-dash-item>i{
    width:38px!important;
    height:38px!important;
    object-fit:contain!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-item b{
    color:#0f172a!important;
    font-size:18px!important;
    line-height:22px!important;
    font-weight:950!important;
  }

  html body .tb-fixed-dashboard .tb-weather-dash-foot{
    padding:0 14px 14px!important;
    color:#64748b!important;
    font-size:11px!important;
    font-weight:800!important;
    text-align:center!important;
  }

  html body .tb-fixed-dashboard .tb-dash-empty{
    min-height:92px!important;
    margin:12px!important;
    border-radius:16px!important;
    background:#f8fbfd!important;
    color:#94a3b8!important;
    font-size:12px!important;
  }
}

@media (max-width: 380px){
  html body .tb-fixed-dashboard .tb-dash-kpi b{
    font-size:18px!important;
    line-height:21px!important;
  }
  html body .tb-fixed-dashboard .tb-dash-kpi{
    padding:11px!important;
  }
  html body .tb-fixed-dashboard .tb-dash-filter{
    grid-template-columns:1fr!important;
  }
  html body .tb-fixed-dashboard .tb-dash-filter select:first-of-type,
  html body .tb-fixed-dashboard .tb-dash-custom-dates{
    grid-column:1 / -1!important;
  }
}

/* v47 Mobile dashboard: compact bottom spacing above footer menu */
@media (max-width: 767px){
  html body .content-area:has(.tb-fixed-dashboard){
    padding-bottom:0!important;
    margin-bottom:0!important;
  }
  html body .tb-fixed-dashboard{
    padding-bottom:calc(var(--tb-mobile-footer-h,68px) + 8px + env(safe-area-inset-bottom,0px))!important;
    margin-bottom:0!important;
  }
  html body .tb-fixed-dashboard > *:last-child,
  html body .tb-fixed-dashboard .tb-dash-grid-extra:last-child,
  html body .tb-fixed-dashboard .tb-dash-card:last-child,
  html body .tb-fixed-dashboard .tb-dash-panel:last-child{
    margin-bottom:0!important;
  }
  html body .tb-fixed-dashboard .tb-weather-dash-foot:last-child{
    margin-bottom:0!important;
    padding-bottom:0!important;
  }
}


/* v49 Query mobile listing stable app layout */
.query-mobile-card-list{display:none;}

@media (max-width: 767px){
  .query-page{background:#f3f7fb!important;min-height:calc(100dvh - 50px)!important;overflow:visible!important;}
  .query-page .client-body{padding:0 0 118px!important;overflow:visible!important;background:#f3f7fb!important;}
  .query-page .client-list-area{padding:0!important;overflow:visible!important;background:#f3f7fb!important;}

  /* Search/add area: simple app style, no broken nested pill */
  .query-page .content-toolbar.client-toolbar{position:sticky!important;top:0!important;z-index:40!important;background:#f3f7fb!important;padding:10px 10px!important;margin:0!important;border:0!important;box-shadow:0 8px 18px rgba(15,23,42,.04)!important;display:flex!important;flex-direction:row!important;align-items:center!important;gap:8px!important;min-height:58px!important;}
  .query-page .content-toolbar .left-tools{display:flex!important;flex:1 1 auto!important;min-width:0!important;width:auto!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important;}
  .query-page .content-toolbar .right-tools{display:flex!important;flex:0 0 auto!important;width:auto!important;align-items:center!important;gap:8px!important;flex-wrap:nowrap!important;margin-left:0!important;}
  .query-page .client-view-wrap,.query-page .tbqas-open-btn,.query-page .tbqas-clear-btn,.query-page .client-create-arrow,.query-page .client-more-wrap{display:none!important;}
  .query-page .query-custom-search{height:42px!important;min-height:42px!important;display:flex!important;align-items:center!important;flex:1 1 auto!important;width:auto!important;min-width:0!important;max-width:none!important;margin:0!important;background:#fff!important;border:1px solid #d9e4ef!important;border-radius:23px!important;padding:0 8px 0 14px!important;box-shadow:0 8px 18px rgba(15,23,42,.06)!important;overflow:hidden!important;}
  .query-page .query-custom-search input{height:40px!important;line-height:40px!important;min-height:40px!important;flex:1 1 auto!important;width:100%!important;min-width:0!important;border:0!important;background:transparent!important;padding:0!important;margin:0!important;box-shadow:none!important;outline:none!important;font-size:15px!important;font-weight:700!important;color:#0f172a!important;text-align:left!important;}
  .query-page .query-custom-search input::placeholder{color:#8a9ab0!important;font-weight:700!important;}
  .query-page .query-custom-search button{position:static!important;width:34px!important;height:34px!important;min-width:34px!important;border:0!important;border-radius:50%!important;background:#fff!important;color:#64748b!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0!important;margin:0!important;box-shadow:none!important;}
  .query-page .query-custom-search a{position:static!important;width:30px!important;height:30px!important;min-width:30px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;color:#64748b!important;text-decoration:none!important;}
  .query-page .client-create-wrap{display:flex!important;align-items:center!important;flex:0 0 auto!important;margin:0!important;}
  .query-page .client-main-create{height:42px!important;min-height:42px!important;border-radius:23px!important;padding:0 16px!important;background:#08b461!important;color:#fff!important;font-size:13px!important;font-weight:900!important;box-shadow:0 10px 18px rgba(8,180,97,.22)!important;white-space:nowrap!important;}
  .query-page .client-main-create i{font-size:13px!important;margin-right:5px!important;}

  /* Mobile card list replaces table */
  .query-page .client-table-wrap{display:none!important;}
  .query-page .query-mobile-card-list{display:block!important;padding:10px 10px 0!important;background:#f3f7fb!important;}
  .query-page .query-mobile-card{position:relative!important;margin:0 0 12px!important;background:#fff!important;border:1px solid #e6edf4!important;border-radius:18px!important;overflow:hidden!important;box-shadow:0 10px 24px rgba(15,23,42,.07)!important;cursor:pointer!important;}
  .query-page .query-mobile-card:active{transform:scale(.995)!important;}
  .query-page .query-mobile-card-link{position:absolute!important;inset:0!important;z-index:2!important;background:transparent!important;}
  .query-page .query-mobile-card-inner{position:relative!important;z-index:3!important;padding:13px 12px 11px!important;pointer-events:none!important;}
  .query-page .query-mobile-card-actions,.query-page .query-mobile-card-actions *{pointer-events:auto!important;}
  .query-page .query-mobile-card-head{display:flex!important;align-items:flex-start!important;justify-content:space-between!important;gap:10px!important;margin:0 0 10px!important;padding:0!important;}
  .query-page .query-mobile-head-main{min-width:0!important;flex:1!important;}
  .query-page .query-mobile-card-id{margin:0!important;padding:0!important;color:#0f172a!important;font-size:15.5px!important;line-height:1.2!important;font-weight:900!important;letter-spacing:-.01em!important;}
  .query-page .query-mobile-card-title{margin:4px 0 0!important;color:#58708a!important;font-size:12px!important;line-height:1.25!important;font-weight:800!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:210px!important;}
  .query-page .query-mobile-head-badge{display:flex!important;align-items:center!important;justify-content:flex-end!important;flex:0 0 auto!important;max-width:120px!important;}
  .query-page .query-mobile-head-badge .query-service-badge{height:26px!important;min-height:26px!important;border-radius:999px!important;padding:0 10px!important;font-size:11px!important;font-weight:900!important;white-space:nowrap!important;box-shadow:none!important;}

  .query-page .query-mobile-card-grid{display:block!important;border-top:1px solid #edf2f7!important;margin-top:8px!important;}
  .query-page .query-mobile-info-row{display:grid!important;grid-template-columns:105px minmax(0,1fr)!important;align-items:center!important;gap:8px!important;min-height:34px!important;padding:7px 0!important;border-bottom:1px solid #f0f4f8!important;}
  .query-page .query-mobile-info-row:last-child{border-bottom:0!important;}
  .query-page .query-mobile-info-row span{color:#657892!important;font-size:11.5px!important;line-height:1.2!important;font-weight:900!important;text-align:left!important;}
  .query-page .query-mobile-info-row strong{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:7px!important;min-width:0!important;text-align:right!important;color:#0f172a!important;font-size:13.2px!important;line-height:1.25!important;font-weight:900!important;word-break:normal!important;overflow-wrap:anywhere!important;}
  .query-page .query-mobile-info-row strong .query-stage-badge{margin-left:auto!important;height:24px!important;min-height:24px!important;padding:0 10px!important;font-size:11px!important;border-radius:999px!important;display:inline-flex!important;align-items:center!important;}
  .query-page .query-mobile-owner{justify-content:flex-end!important;}
  .query-page .query-mobile-owner em{display:none!important;}
  .query-page .query-mobile-owner .owner-chip,.query-page .query-mobile-owner .owner-badge,.query-page .query-mobile-owner .crm-owner-badge{margin-left:auto!important;}
  .query-page .query-mobile-card-foot{display:flex!important;align-items:center!important;justify-content:flex-end!important;margin-top:9px!important;padding-top:10px!important;border-top:1px solid #edf2f7!important;}
  .query-page .query-mobile-open-hint{display:none!important;}
  .query-page .query-mobile-card-actions{display:flex!important;align-items:center!important;justify-content:flex-end!important;gap:8px!important;position:relative!important;z-index:4!important;}
  .query-page .query-mobile-card-actions button{width:34px!important;height:34px!important;min-width:34px!important;border:1px solid #dfe8f2!important;background:#f8fbfd!important;border-radius:12px!important;color:#334155!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;padding:0!important;box-shadow:none!important;}
  .query-page .query-mobile-card-actions button i{font-size:15px!important;}
  .query-page .query-mobile-card-actions button:nth-child(2){color:#dc2626!important;background:#fff8f8!important;border-color:#fee2e2!important;}
  .query-page .query-mobile-empty{background:#fff!important;border:1px solid #e6edf4!important;border-radius:16px!important;padding:26px 16px!important;text-align:center!important;color:#64748b!important;font-size:14px!important;font-weight:800!important;}

  /* Clean fixed pagination above footer menu */
  .query-page .client-footer-bar{display:block!important;position:fixed!important;left:0!important;right:0!important;bottom:66px!important;z-index:55!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(12px)!important;border-top:1px solid #e2e8f0!important;box-shadow:0 -6px 18px rgba(15,23,42,.06)!important;padding:8px 12px!important;margin:0!important;height:50px!important;min-height:50px!important;}
  .query-page .client-footer-stats{display:none!important;}
  .query-page .client-footer-pages{height:34px!important;display:grid!important;grid-template-columns:74px 34px minmax(70px,1fr) 34px!important;align-items:center!important;gap:10px!important;width:100%!important;justify-content:normal!important;margin:0!important;padding:0!important;}
  .query-page .client-footer-pages span{display:none!important;}
  .query-page .client-footer-pages select{height:34px!important;width:74px!important;min-width:74px!important;border-radius:18px!important;border:1px solid #d9e4ef!important;background:#fff!important;padding:0 28px 0 12px!important;font-size:13px!important;font-weight:900!important;color:#0f172a!important;box-shadow:none!important;}
  .query-page .client-footer-pages a{width:34px!important;height:34px!important;min-width:34px!important;border-radius:50%!important;background:#f8fbfd!important;border:1px solid #d9e4ef!important;color:#64748b!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;text-decoration:none!important;box-shadow:none!important;}
  .query-page .client-footer-pages a.disabled{opacity:.45!important;pointer-events:none!important;}
  .query-page .client-footer-pages strong{justify-self:center!important;text-align:center!important;font-size:13px!important;font-weight:900!important;color:#0f172a!important;white-space:nowrap!important;}
}

@media (max-width:575px){
  .query-page .content-toolbar.client-toolbar{padding:9px 8px!important;gap:7px!important;}
  .query-page .query-custom-search{height:40px!important;min-height:40px!important;border-radius:21px!important;padding-left:13px!important;}
  .query-page .client-main-create{height:40px!important;min-height:40px!important;border-radius:21px!important;padding:0 14px!important;}
  .query-page .query-mobile-card-list{padding:9px 8px 0!important;}
  .query-page .query-mobile-card{border-radius:17px!important;margin-bottom:10px!important;}
  .query-page .query-mobile-card-inner{padding:12px 11px 10px!important;}
  .query-page .query-mobile-info-row{grid-template-columns:100px minmax(0,1fr)!important;min-height:33px!important;padding:6px 0!important;}
  .query-page .query-mobile-card-title{max-width:185px!important;}
  .query-page .client-footer-bar{bottom:62px!important;padding:8px 10px!important;height:50px!important;}
}


/* v50 Query mobile listing: restore scroll + pin pagination directly above bottom nav */
@media (max-width: 767px){
  html body .content-area:has(.query-page){
    height:calc(100dvh - 50px)!important;
    max-height:calc(100dvh - 50px)!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    -webkit-overflow-scrolling:touch!important;
    padding-bottom:0!important;
  }

  html body .query-page,
  html body .query-page.client-page{
    height:auto!important;
    min-height:calc(100dvh - 50px)!important;
    max-height:none!important;
    overflow:visible!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
    background:#f3f7fb!important;
  }

  html body .query-page .client-body,
  html body .query-page .client-list-area{
    height:auto!important;
    min-height:0!important;
    max-height:none!important;
    overflow:visible!important;
    background:#f3f7fb!important;
    padding-bottom:0!important;
    margin-bottom:0!important;
  }

  html body .query-page .query-mobile-card-list{
    display:block!important;
    overflow:visible!important;
    padding:10px 10px calc(50px + var(--tb-mobile-footer-h,62px) + 8px + env(safe-area-inset-bottom,0px))!important;
    margin:0!important;
    background:#f3f7fb!important;
  }

  html body .query-page .client-footer-bar{
    display:block!important;
    position:fixed!important;
    left:0!important;
    right:0!important;
    bottom:calc(var(--tb-mobile-footer-h,62px) + env(safe-area-inset-bottom,0px))!important;
    z-index:1200!important;
    width:100%!important;
    height:50px!important;
    min-height:50px!important;
    max-height:50px!important;
    padding:8px 12px!important;
    margin:0!important;
    background:rgba(255,255,255,.98)!important;
    border-top:1px solid #e2e8f0!important;
    box-shadow:0 -6px 18px rgba(15,23,42,.06)!important;
  }

  html body .query-page .client-footer-pages{
    width:100%!important;
    height:34px!important;
    display:grid!important;
    grid-template-columns:74px 34px minmax(70px,1fr) 34px!important;
    align-items:center!important;
    gap:10px!important;
    margin:0!important;
    padding:0!important;
    justify-content:normal!important;
  }

  html body .query-page .client-footer-pages span,
  html body .query-page .client-footer-stats,
  html body .query-page .query-footer-stage-stats{
    display:none!important;
  }

  html body .query-page .client-footer-pages strong{
    justify-self:center!important;
    text-align:center!important;
    font-size:13px!important;
    font-weight:900!important;
    color:#0f172a!important;
    white-space:nowrap!important;
  }

  html body .query-page .client-footer-pages select{
    height:34px!important;
    width:74px!important;
    min-width:74px!important;
    border-radius:18px!important;
    border:1px solid #d9e4ef!important;
    background:#fff!important;
    padding:0 28px 0 12px!important;
    font-size:13px!important;
    font-weight:900!important;
    color:#0f172a!important;
    box-shadow:none!important;
  }

  html body .query-page .client-footer-pages a{
    width:34px!important;
    height:34px!important;
    min-width:34px!important;
    border-radius:50%!important;
    background:#f8fbfd!important;
    border:1px solid #d9e4ef!important;
    color:#64748b!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:center!important;
    text-decoration:none!important;
    box-shadow:none!important;
  }

  html body .query-page .client-footer-pages a.disabled{
    opacity:.45!important;
    pointer-events:none!important;
  }
}

@media (max-width:575px){
  html body .query-page .query-mobile-card-list{
    padding-bottom:calc(50px + var(--tb-mobile-footer-h,62px) + 6px + env(safe-area-inset-bottom,0px))!important;
  }

  html body .query-page .client-footer-bar{
    bottom:calc(var(--tb-mobile-footer-h,62px) + env(safe-area-inset-bottom,0px))!important;
  }
}

/* v51: mobile query stage badge text must stay white */
@media (max-width: 767px){
  html body .query-page .query-mobile-card .query-stage-badge,
  html body .query-page .query-mobile-card .query-stage-badge *{
    color:#fff!important;
  }
}