/* Shared reflow rules: wrap content rather than clipping the document. */
html{overflow-wrap:anywhere;scroll-padding-top:80px}
img,video,canvas{max-width:100%}
fieldset{min-inline-size:0}
input,select,textarea{min-width:0;max-width:100%}
pre{white-space:pre-wrap;overflow-wrap:anywhere;max-width:100%}
.app-shell .main-content,.app-shell .content-wrapper,.app-shell .content-wrapper>.container,.app-shell .content-wrapper>.container-fluid{min-width:0}
.app-shell .row>*{min-width:0}
.app-shell .btn{white-space:normal;max-width:100%;text-align:center}
.app-shell .content-wrapper :is(h1,h2,h3,p,dd,strong,small,a){overflow-wrap:anywhere}
.app-shell :is(input,select,textarea,button,a,summary){scroll-margin-top:88px;scroll-margin-bottom:110px}
.app-shell .app-navbar .container-fluid{display:flex;align-items:center;min-width:0}
.app-shell .app-navbar .container-fluid>.ms-auto{min-width:0;flex-shrink:0}
.app-shell .app-user{max-width:100%}
.app-shell .app-user .d-md-inline{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.app-shell .account-menu-head>div{min-width:0;overflow-wrap:anywhere}
@media(max-width:1023px){
 .app-shell .app-user .d-md-inline{display:none!important}
 .app-shell .app-user{min-width:44px;min-height:44px}
 .app-shell .app-navbar .topbar-breadcrumb{flex-shrink:1;overflow:hidden}
 .app-shell .content-wrapper :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){font-size:16px}
 .app-shell :is(.btn,.btn-soft,.btn-ghost,.back-link,.password-toggle){min-height:44px}
 .app-shell .password-toggle{width:44px}
 .app-shell .modal-dialog{max-width:calc(100% - 24px)}
 .app-shell .modal-content{max-height:calc(100dvh - 24px);overflow-y:auto}
 .app-shell .modal-header{position:sticky;top:0;z-index:2;background:var(--cellaro-surface)}
 .app-shell .modal-footer{position:sticky;bottom:0;z-index:2;background:var(--cellaro-surface)}
}
@media(max-width:639px){
 .app-shell .shop-switcher{flex:1;max-width:none;margin-left:0}
 .app-shell .app-navbar .container-fluid{gap:8px}
 .app-shell .app-navbar .container-fluid>.ms-auto{margin-left:0!important}
 .app-shell .shop-switcher select{width:100%;min-width:0}
 .app-shell .credit-payment-heading{flex-wrap:wrap}
 .app-shell .receipt-actions{align-items:stretch}
}
@media(max-width:768px) and (pointer:coarse){
 .app-shell:has(input:not([type=checkbox]):not([type=radio]):not([type=hidden]):focus,textarea:focus,select:focus) .mobile-bottom-nav{display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.app-shell .employee-summary{min-width:0;gap:12px;flex-wrap:wrap}
.app-shell .employee-summary>div{min-width:0;flex:1 1 150px;overflow-wrap:anywhere}
.app-shell .contact-item,.app-shell .contact-text{min-width:0;max-width:100%;overflow-wrap:anywhere;white-space:normal}
.app-shell .account-menu{max-height:calc(100dvh - 82px)}
.app-shell .account-menu-head strong{white-space:normal;overflow-wrap:anywhere}
@media(max-width:1023px){.app-shell .account-menu :is(.dropdown-item,.account-logout,.module-toggle){min-height:44px}}

@media(max-width:1023px){
 .app-shell :is(.inventory-sell,.inventory-view,.row-actions summary,.row-action-menu a,.row-action-menu button){min-height:44px}
 .app-shell .row-actions summary{min-width:44px}
}
@media(max-width:639px){
 .app-shell .inventory-header>.d-flex{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}
 .app-shell .inventory-header>.d-flex>.btn-primary{grid-column:1/-1;grid-row:1}
 .app-shell .inventory-header>.d-flex>.btn{display:flex;align-items:center;justify-content:center}
 .app-shell .stock-summary .stat-card--money{grid-column:1/-1}
 .app-shell .stock-summary .stat-card--money+.stat-card{grid-column:1/-1}
 .app-shell .stat-card--money>div{flex:1}
 .app-shell .stat-card--money strong{font-size:22px;line-height:30px}
}

@media(max-width:1023px){
 .auth-body :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){font-size:16px}
 .auth-body :is(.btn,button[type=submit],.password-toggle){min-height:44px}
 .app-shell .app-navbar{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}
 .app-shell .content-wrapper{padding-left:max(24px,env(safe-area-inset-left));padding-right:max(24px,env(safe-area-inset-right))}
 .app-shell #sidebar .sidebar-inner{padding-top:max(24px,env(safe-area-inset-top));padding-left:max(16px,env(safe-area-inset-left));padding-bottom:max(24px,env(safe-area-inset-bottom))}
}
@media(max-width:639px){.app-shell .content-wrapper{padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}}
@media(max-width:359px){.app-shell .content-wrapper{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}}

@media(max-width:639px){
 .app-shell .stock-summary :is(.stat-card--money,.stat-card--money+.stat-card){flex-direction:row;align-items:center}
}
@media(max-width:1023px){.app-shell :is(.stock-filter-options>summary,.sales-filter-options>summary,.report-other a){min-height:44px}}

.app-shell .ent-header{flex-direction:row;flex-wrap:wrap}
.app-shell .ent-titlewrap{min-width:0;flex:1 1 280px}
.app-shell .ent-titlewrap>div:last-child{min-width:0}
.app-shell .ent-logo{flex-shrink:0}
.app-shell .ent-actions{flex:0 0 auto}

.app-shell .sales-search-row>.btn{flex-shrink:0}
.app-shell .fournisseur-card__footer{flex-wrap:wrap;gap:12px}
.app-shell .fournisseur-actions{min-width:0;flex-wrap:wrap}
.app-shell .fournisseur-actions>.btn{flex-shrink:0}
.app-shell .phone-detail-page .table-responsive{min-width:0;max-width:100%;overscroll-behavior-x:contain}
.app-shell .phone-detail-page .table-responsive table{min-width:640px}
.app-shell .phone-detail-page .table-responsive .btn{min-width:120px}
.app-shell .phone-detail-page section.card>.d-flex{flex-wrap:wrap}

/* Same accessible price dialog from Stock and a phone detail. */
.app-shell #price-modal{width:min(680px,95vw);max-height:calc(100dvh - 16px);margin:auto;box-shadow:var(--shadow-floating)}
.app-shell .price-modal-topbar{position:sticky;top:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:64px;padding:16px 20px;background:var(--cellaro-surface);border-bottom:1px solid var(--cellaro-border)}
.app-shell .price-modal-topbar h2{margin:0}
.app-shell .price-modal-topbar .btn-close{padding:12px;flex-shrink:0}
.app-shell #price-modal [data-price-feedback]{position:sticky;top:64px;z-index:3;margin:0;border-radius:0}
.app-shell #price-modal [data-price-feedback][role=alert]{background:var(--danger-bg);color:var(--cellaro-danger)}
.app-shell #price-modal .price-editor-footer{position:sticky;bottom:0;z-index:2;background:var(--cellaro-surface);padding:16px 0}
@media(max-width:639px){.app-shell #price-modal{width:calc(100vw - 16px)}}
@media(max-width:1023px){.app-shell .modal-panel{max-height:calc(100dvh - 24px);overflow-y:auto}}
