.flosi-install{position:fixed;inset-inline:16px;bottom:max(16px,env(safe-area-inset-bottom));z-index:1040;display:flex;align-items:center;gap:12px;max-width:560px;margin:auto;background:#fff;color:#183b30;border:1px solid #d4e7df;border-radius:18px;padding:14px;box-shadow:0 8px 32px #102d2426;font-family:system-ui,sans-serif}
.flosi-install img{border-radius:12px;flex-shrink:0}.flosi-install p{margin:4px 0 0;font-size:13px;line-height:1.6}.flosi-install button{min-height:44px;border:0;border-radius:10px;cursor:pointer}.flosi-install-action{background:#087f5b;color:#fff;padding:8px 16px}.flosi-install-close{background:transparent;color:#566a63;font-size:26px;min-width:44px}
.flosi-sidebar-close{display:none}
.mobile-details-toggle{display:none}
.customer-photo-fallback{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#eaf4f0;color:#087f5b;font-size:20px}
.customer-photo-fallback[hidden]{display:none}
.dashboard-summary-link:hover,.dashboard-summary-link:focus-visible{border-color:var(--bs-primary,#087f5b);box-shadow:0 2px 10px rgba(8,127,91,.12)}
.followup-actions{min-width:280px}
.flosi-notification-menu{width:380px;padding:0;overflow:hidden;border-radius:16px}
.flosi-notification-list{max-height: min(440px,60dvh);overflow-y:auto;overscroll-behavior:contain}
.pc-header .flosi-notification-item{display:flex;align-items:center;gap:8px;white-space:normal;padding:10px 12px;border-bottom:1px solid var(--bs-border-color,#edf1ef)}
.flosi-notification-item>div,.flosi-alert-text{min-width:0;flex:1}
.flosi-notification-item strong,.flosi-alert-text strong{font-size:13px;line-height:1.5;display:block}
.flosi-notification-item p,.flosi-alert-text p{font-size:12px;line-height:1.5;margin:2px 0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.flosi-notification-item small,.flosi-alert-text small{font-size:11px}
.flosi-alert-link{min-width:0}
.flosi-alert-dismiss{min-width:36px;min-height:36px}
.flosi-notification-item.is-unread{background:rgba(8,127,91,.06)}
.pc-header .pc-head-link:has(.flosi-notification-count){position:relative}
.flosi-notification-count{position:absolute;top:-3px;inset-inline-end:-4px;font-size:10px;min-width:18px}
@media(max-width:1024px){
    body .pc-sidebar{left:0!important;right:auto!important;transform:translateX(-100%);transition:transform .2s ease}
    body[data-pc-direction=rtl] .pc-sidebar{right:0!important;left:auto!important;transform:translateX(100%)}
    body .pc-sidebar.mob-sidebar-active,body[data-pc-direction=rtl] .pc-sidebar.mob-sidebar-active{transform:translateX(0)}
    /* Use the visible viewport, not the space underneath mobile browser controls. */
    body .pc-sidebar{height:100vh;height:100dvh;bottom:auto;max-width:calc(100vw - 48px)}
    body .pc-sidebar .navbar-wrapper{display:block;height:100%;width:100%;min-height:0;overflow-y:auto!important;overflow-x:hidden!important;touch-action:pan-y;overscroll-behavior-y:contain;-webkit-overflow-scrolling:touch;padding-top:env(safe-area-inset-top);padding-bottom:max(40px,env(safe-area-inset-bottom));box-sizing:border-box;position:relative;z-index:5}
    body .pc-sidebar .m-header{flex:0 0 72px;height:72px;padding:12px;gap:8px}
    body .pc-sidebar .m-header .b-brand{flex:1;min-width:0}
    body .pc-sidebar .m-header .logo{max-width:100%!important;max-height:48px;object-fit:contain}
    body .pc-sidebar .navbar-content{display:block;min-height:0;height:auto!important;max-height:none!important;overflow:visible!important;padding-bottom:24px}
    /* Also flatten custom scrollbar wrappers when resizing from desktop to phone. */
    body .pc-sidebar .navbar-content .simplebar-wrapper,
    body .pc-sidebar .navbar-content .simplebar-mask,
    body .pc-sidebar .navbar-content .simplebar-offset,
    body .pc-sidebar .navbar-content .simplebar-content-wrapper{display:contents!important}
    body .pc-sidebar .navbar-content .simplebar-placeholder,
    body .pc-sidebar .navbar-content .simplebar-height-auto-observer-wrapper,
    body .pc-sidebar .navbar-content .simplebar-track{display:none!important}
    body .pc-sidebar .navbar-content .simplebar-content{padding-bottom:max(32px,env(safe-area-inset-bottom))!important}
    body .pc-sidebar .pc-navbar{width:100%;padding-bottom:24px}
    .flosi-sidebar-close{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border:0;border-radius:10px;background:transparent;color:var(--pc-sidebar-color);font-size:28px;cursor:pointer}
    body .pc-header{left:0!important;right:0!important;width:100%;min-height:64px}
    body .pc-header .header-wrapper{display:flex!important;align-items:center;justify-content:space-between;flex-wrap:nowrap;width:100%;min-width:0;padding-inline:8px}
    .pc-header .pc-mob-drp{flex:0 0 auto}
    .pc-header .flosi-header-actions{display:block!important;visibility:visible!important;flex:0 1 auto;min-width:0}
    .pc-header .flosi-header-actions>ul{display:flex!important;align-items:center;gap:4px;flex-wrap:nowrap;padding:0;margin:0}
    .pc-header .flosi-header-actions .pc-h-item{display:inline-flex!important;visibility:visible!important;align-items:center;min-height:64px}
    .pc-header .flosi-header-actions .pc-head-link{display:inline-flex!important;align-items:center;justify-content:center;width:44px;height:44px;padding:8px;margin:0!important}
    .pc-header .flosi-header-actions .user-avtar{width:28px;height:28px;object-fit:cover}
    .pc-header .flosi-header-actions .header-user-profile .pc-head-link>span{display:none}
    .pc-header .flosi-header-actions .dropdown-item{min-height:44px}
}
@media(max-width:767.98px){
    body{font-size:15px;line-height:1.65;-webkit-text-size-adjust:100%}
    body[data-pc-direction=rtl]{font-family:Tahoma,Arial,system-ui,sans-serif}
    .pc-container .pc-content{padding:12px 8px 24px}
    .pc-content .card{border-radius:14px;margin-bottom:16px;min-width:0}
    .pc-content .card-body,.pc-content .card-header{padding:16px}
    .pc-content .page-header{margin-inline:0;padding:12px}
    .pc-content .breadcrumb{flex-wrap:wrap;font-size:13px}
    .pc-content h4,.pc-content h5{line-height:1.55;overflow-wrap:anywhere}
    .pc-content .btn,.modal .btn,.auth-main .btn{min-height:44px;display:inline-flex;align-items:center;justify-content:center;white-space:normal}
    .pc-content .avtar.avtar-xs{width:44px;height:44px;min-width:44px;border-radius:10px}
    .cart-action,.cart-action form{flex-wrap:wrap;gap:6px}
    .pc-content .form-control,.pc-content .form-select,.modal .form-control,.modal .form-select,.auth-main .form-control{font-size:16px;min-height:46px}
    .pc-content .form-label,.modal .form-label{margin-bottom:8px}
    .pc-content textarea.form-control{min-height:110px}
    .pc-content .select2-container{max-width:100%}
    .pc-content .nav-tabs,.pc-content .nav-pills{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:6px}
    .pc-content .nav-tabs .nav-link,.pc-content .nav-pills .nav-link{white-space:nowrap;min-height:44px}
    .pc-header .header-wrapper{padding-inline:8px;align-items:center}
    .pc-header .pc-head-link{margin-inline:2px;min-width:44px;min-height:44px}
    .pc-header .dropdown-menu{min-width:0!important;max-width:calc(100vw - 24px)!important}
    .pc-sidebar .pc-link{min-height:48px}
    .modal-dialog{margin:10px}.modal-body{padding:16px;overflow-wrap:anywhere}.modal-footer{gap:8px}
    .auth-main .auth-wrapper .auth-form{padding:16px;max-width:100%}
    .auth-main .card-body{padding:24px 18px}
    .auth-main .logo{max-width:220px!important}
    .dataTables_wrapper .dt-buttons{display:flex;flex-wrap:wrap;gap:6px;float:none;margin-bottom:12px}
    .dataTables_wrapper .dt-buttons>.btn{margin:0;border-radius:8px!important}
    .dataTables_wrapper .dataTables_filter{float:none;text-align:start;margin-bottom:14px}
    .dataTables_wrapper .dataTables_filter label{display:flex;align-items:center;gap:8px;width:100%}
    .dataTables_wrapper .dataTables_filter input{width:100%;min-width:0;margin:0;font-size:16px;min-height:44px}
    .dataTables_wrapper .dataTables_paginate .pagination{flex-wrap:wrap;gap:4px;justify-content:center}
    .dataTables_wrapper .page-link{min-width:44px;min-height:44px;text-align:center}
    .dataTables_scrollHead:has(table.mobile-records){display:none}
    .dataTables_scrollBody:has(table.mobile-records){overflow:visible!important}
    table.mobile-records{display:block;width:100%!important;border:0!important}
    table.mobile-records>thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
    table.mobile-records>tbody{display:block;width:100%}
    table.mobile-records>tbody>tr{display:block;border:1px solid var(--bs-border-color,#dbe5e0);border-radius:12px;margin-bottom:14px;padding:8px;background:var(--bs-body-bg,#fff)}
    table.mobile-records>tbody>tr>td{display:block;width:100%!important;white-space:normal!important;overflow-wrap:anywhere;border:0!important;padding:10px!important;box-shadow:none!important}
    table.mobile-records>tbody>tr>td[data-mobile-label]::before{content:attr(data-mobile-label);display:block;color:var(--bs-secondary-color,#65776f);font-size:12px;font-weight:600;margin-bottom:5px}
    table.mobile-records>tbody>tr>td+td{border-top:1px solid var(--bs-border-color,#e8eeeb)!important}
    table.mobile-compact-list.mobile-records>tbody>tr{padding:0;margin-bottom:8px}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child{display:flex;align-items:center;gap:8px;direction:rtl;padding:8px 10px!important}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child>.d-flex{flex:1;min-width:0;flex-direction:row-reverse;gap:8px}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child .flex-grow-1{margin:0!important;text-align:right;min-width:0}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child h5{font-size:14px;line-height:1.4;margin:0!important}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child .wid-40{width:32px!important}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child img{width:32px;height:32px;object-fit:cover;border-radius:50%}
    table.mobile-compact-list.mobile-records>tbody>tr>td:first-child::before{display:none}
    table.mobile-compact-list.mobile-records>tbody>tr:not(.mobile-details-open)>td:not(:first-child){display:none}
    table.mobile-compact-list.mobile-records>tbody>tr:not(.mobile-details-open)>td:first-child p{display:none}
    table.mobile-compact-list .mobile-details-toggle{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;margin:0;padding:0;border:0;border-radius:8px;background:transparent;color:var(--bs-secondary,#087f5b)}
    table.mobile-compact-list .mobile-details-toggle>span:first-child{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
    .mobile-details-chevron{font-size:22px;line-height:1;transition:transform .15s}
    .mobile-details-open .mobile-details-chevron{transform:rotate(180deg)}
    .followup-compact-list .followup-recipient{flex:1;min-width:0;text-align:right}
    .followup-compact-list .followup-recipient h5{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .followup-compact-list .followup-recipient small{text-align:right;font-size:12px;line-height:1.4}
    .followup-compact-list .followup-actions{min-width:0}
    table.mobile-compact-list .compact-record-name{flex:1;min-width:0;text-align:right}
    table.mobile-compact-list .compact-record-name h5{margin:0;font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
    table.mobile-compact-list>tbody>tr>td:first-child .wid-40{width:32px!important;min-width:32px;height:32px;overflow:hidden}
    table.mobile-compact-list>tbody>tr>td:first-child h5{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
    .pc-content .table-responsive{max-width:100%;-webkit-overflow-scrolling:touch}
    .flosi-install{inset-inline:10px;padding:12px;gap:8px;flex-wrap:wrap}
    .flosi-install>div{flex:1;min-width:150px}
}
@media(display-mode:standalone){body{padding-bottom:env(safe-area-inset-bottom)}.pc-header{padding-top:env(safe-area-inset-top)}}

/* Compact system settings reuse the existing per-record mobile disclosure. */
.settings-record-label{display:none}
@media(max-width:767.98px){
    .settings-compact-list .settings-record-label{display:inline;color:var(--bs-secondary-color,#65776f);font-size:12px;font-weight:600}
    table.settings-compact-list .compact-record-name{white-space:normal;overflow-wrap:anywhere}
}
