/* CAVAPerfo mobile layer. Loaded only below 769px so desktop stays untouched. */
:root{--mobile-gutter:12px;--mobile-nav-height:calc(62px + env(safe-area-inset-bottom))}
html{height:100%;overflow:hidden;touch-action:manipulation}
body{width:100%;max-width:100vw}
button,a,input,select,textarea{touch-action:manipulation}

/* A calm app shell with clear, thumb-sized controls. */
#tb{padding-top:env(safe-area-inset-top);height:calc(58px + env(safe-area-inset-top));flex:0 0 auto}
#tb-hamburger{width:42px;height:42px}
#tb>.tbleft,#tb>div:first-child{min-width:0;flex:1}
#tb>div:last-child{flex:0 0 auto;max-width:45vw}
.mc{scrollbar-width:none;overscroll-behavior-y:contain;scroll-padding-bottom:calc(var(--mobile-nav-height) + 16px)}
.mc::-webkit-scrollbar{display:none}
.view{min-width:0;width:100%}
.view.on{display:flex;flex-direction:column;gap:14px}

/* Toolbars wrap instead of forcing the whole page wider than the viewport. */
.pctrl,.ttb,.analyse-toolbar,.retc-toolbar{max-width:100%}
.ttb{flex-wrap:wrap;overflow:visible}
.ttb>div{min-width:0;max-width:100%}
.pctrl{padding-bottom:4px;scroll-snap-type:x proximity}
.pctrl>*{scroll-snap-align:start}
.btn{min-height:44px;padding:10px 14px}
.bico{min-width:44px;min-height:44px}
.fi,.flt{min-height:44px;max-width:100%}

/* Dense dashboard content becomes readable cards rather than tiny columns. */
.kgrid:not(.analyse-kpis){margin-inline:calc(var(--mobile-gutter) * -1);padding-inline:var(--mobile-gutter);scroll-padding-inline:var(--mobile-gutter)}
.analyse-kpis{margin-inline:0;max-width:100%;padding-inline:0}
.kc{min-width:min(76vw,220px);min-height:112px}
.crow{gap:12px}
.cc,.tc,.fcard{box-shadow:0 2px 12px rgba(17,19,24,.06)}
canvas{max-width:100%!important}

/* Reliable two-axis table scrolling on iOS/Android. The JS supplies state and labels. */
.tw,.retc-table-wrap,.retc-modal-table,.workflow-entry-table-wrap,.svc-entry-wrap,
.analyse-table-card,.mobile-scroll-region{
  position:relative;display:block;max-width:100%;width:100%;
  overflow-x:scroll!important;overflow-y:auto;
  -webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;
  overscroll-behavior-x:contain;scrollbar-gutter:stable;
}
.tw,.retc-table-wrap,.workflow-entry-table-wrap,.svc-entry-wrap,.analyse-table-card{cursor:grab}
.tw:active,.retc-table-wrap:active,.workflow-entry-table-wrap:active,.svc-entry-wrap:active,.analyse-table-card:active{cursor:grabbing}
.mobile-scroll-region[data-scrollable="true"]{border-bottom:2px solid color-mix(in srgb,var(--pr) 26%,var(--bd))}
.mobile-scroll-region[data-scrollable="true"]::after{
  content:"Glisser pour voir la suite  →";position:sticky;left:12px;display:inline-flex;
  align-items:center;height:26px;margin:5px 0 7px;padding:0 10px;border-radius:999px;
  background:color-mix(in srgb,var(--sf) 90%,var(--pr) 10%);color:var(--pr);
  border:1px solid color-mix(in srgb,var(--pr) 28%,transparent);font-size:9px;font-weight:700;
  pointer-events:none;opacity:.9;transition:opacity .2s;
}
.mobile-scroll-region[data-scroll-end="true"]::after{opacity:0}
.mobile-scroll-region:focus-visible{outline:2px solid var(--pr);outline-offset:2px}
.dt{width:max-content;min-width:max(720px,100%)}
.dt th,.dt td{height:44px}

/* Modals stay centered in the visible viewport and scroll internally when needed. */
.mov{padding:12px!important}
.modal{padding:20px var(--mobile-gutter) calc(20px + env(safe-area-inset-bottom));max-height:calc(100dvh - 24px)!important}
.mhdr{position:sticky;top:-20px;z-index:8;margin:-20px calc(var(--mobile-gutter) * -1) 14px;padding:16px var(--mobile-gutter) 12px;background:var(--sf);border-bottom:1px solid var(--bd)}
.modal .fgrid{gap:12px}

/* Navigation remains legible even when role-specific tabs change. */
#mob-nav{height:var(--mobile-nav-height);padding-inline:4px;box-shadow:0 -8px 28px rgba(17,19,24,.08)}
.mob-tab{min-width:0;padding-top:7px}
.mob-tab span{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#mob-fab{bottom:calc(var(--mobile-nav-height) + 10px)}
#toasts{left:var(--mobile-gutter);right:var(--mobile-gutter);bottom:calc(var(--mobile-nav-height) + 12px)}
.toast{max-width:none;width:100%}

@media(max-width:390px){
  :root{--mobile-gutter:10px}
  #tbtitle{font-size:14px}
  .mc{padding-inline:var(--mobile-gutter)}
  .kc{min-width:78vw}
  .mob-tab span{font-size:8px}
  .analyse-kpis .kc{min-height:100px}
}

@media(orientation:landscape) and (max-height:520px){
  #tb{height:50px;padding-top:0}
  #mob-nav{height:52px;padding-bottom:0}
  .mob-tab{flex-direction:row;gap:5px;padding:4px}
  .mob-tab span{font-size:9px}
  #mob-fab{bottom:62px}
  .modal{max-height:calc(100dvh - 16px)!important}
}

@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}

/* Installation de l’application sur Android et iOS. */
.pwa-login-install{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;
  min-height:44px;margin-top:-8px;border:1px solid rgba(202,218,42,.28);border-radius:12px;
  color:#CADA2A;background:rgba(202,218,42,.07);font-size:12px;font-weight:700;
}
.pwa-login-install:active{background:rgba(202,218,42,.14);transform:scale(.99)}
.pwa-install-banner{
  position:fixed;left:var(--mobile-gutter);right:var(--mobile-gutter);
  bottom:calc(var(--mobile-nav-height) + 66px);z-index:350;
  display:flex;align-items:center;gap:10px;min-height:68px;padding:10px 42px 10px 10px;
  border:1px solid color-mix(in srgb,var(--pr) 28%,var(--bd));border-radius:17px;
  background:color-mix(in srgb,var(--sf) 94%,var(--pr) 6%);box-shadow:0 16px 40px rgba(17,19,24,.2);
  opacity:0;transform:translateY(18px);pointer-events:none;
  transition:opacity .22s ease,transform .22s cubic-bezier(.34,1.2,.64,1);
}
.pwa-install-banner.on{opacity:1;transform:translateY(0);pointer-events:auto}
.pwa-install-banner img{width:44px;height:44px;border-radius:12px;flex:0 0 auto}
.pwa-install-banner-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:2px}
.pwa-install-banner-copy strong{font-size:12px;line-height:1.25;color:var(--tx)}
.pwa-install-banner-copy span{font-size:10px;line-height:1.3;color:var(--mt)}
.pwa-install-banner .btn{min-height:40px;padding-inline:12px}
.pwa-install-dismiss{
  position:absolute;right:7px;top:5px;width:30px;height:30px;border-radius:50%;
  color:var(--mt);font-size:21px;line-height:1;
}
.pwa-install-dismiss:active{background:var(--soff)}
.pwa-install-sheet{display:flex;flex-direction:column;gap:16px}
.pwa-install-eyebrow{display:block;margin-bottom:3px;color:var(--prc);font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.pwa-install-app{display:flex;align-items:center;gap:14px;padding:14px;border:1px solid var(--bd);border-radius:16px;background:var(--s2)}
.pwa-install-app img{width:58px;height:58px;border-radius:16px;box-shadow:0 5px 16px rgba(17,19,24,.16)}
.pwa-install-app div{display:flex;min-width:0;flex-direction:column;gap:3px}
.pwa-install-app strong{font-family:'Syne',sans-serif;font-size:17px;color:var(--tx)}
.pwa-install-app span{font-size:11px;color:var(--mt)}
.pwa-install-intro{font-size:13px;line-height:1.55;color:var(--mt)}
.pwa-install-steps{display:flex;flex-direction:column;gap:11px;list-style:none}
.pwa-install-steps li{display:grid;grid-template-columns:30px 1fr;align-items:start;gap:10px;font-size:13px;line-height:1.5;color:var(--tx)}
.pwa-step-number{display:grid;place-items:center;width:30px;height:30px;border-radius:10px;background:var(--prhi);color:var(--prc);font:800 12px 'JetBrains Mono',monospace}
.pwa-install-note{padding:10px 12px;border-radius:11px;background:var(--orhi);color:var(--or);font-size:11px;line-height:1.45}
.pwa-install-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:2px}

@media(max-width:390px){
  .pwa-install-banner{padding-right:38px}
  .pwa-install-banner-copy span{display:none}
  .pwa-install-banner .btn{font-size:11px;padding-inline:10px}
}

/* Expérience mobile complète : navigation, données et commandes sans défilement latéral imposé. */
body.mobile-layer-open{overflow:hidden}

/* En-tête stable : le titre et deux actions seulement, tout le reste vit dans une feuille dédiée. */
#tb{box-shadow:0 1px 0 var(--bd),0 8px 24px rgba(17,19,24,.04)}
#tb>div:last-of-type{display:none!important}
#tbtitle{flex:1;max-width:none!important;line-height:1.2}
#tb-mobile-actions{
  display:flex!important;align-items:center;justify-content:center;flex:0 0 auto;
  width:42px;height:42px;border:1px solid var(--bd);border-radius:13px;
  background:var(--sf);color:var(--tx);box-shadow:var(--shsm);
}
#tb-mobile-actions svg{width:21px;height:21px}
#tb-mobile-actions:active{background:var(--soff);transform:scale(.96)}

#mob-actions-sheet{
  display:flex!important;position:fixed;z-index:320;left:0;right:0;bottom:0;
  max-height:min(82dvh,720px);flex-direction:column;gap:14px;
  padding:8px var(--mobile-gutter) calc(18px + env(safe-area-inset-bottom));
  border:1px solid var(--bd);border-bottom:0;border-radius:24px 24px 0 0;
  background:var(--sf);box-shadow:0 -24px 70px rgba(17,19,24,.24);
  opacity:0;pointer-events:none;transform:translateY(calc(100% + 24px));
  transition:transform .28s cubic-bezier(.22,1,.36,1),opacity .2s ease;
}
#mob-actions-sheet.on{opacity:1;pointer-events:auto;transform:translateY(0)}
.mob-actions-handle{width:42px;height:4px;margin:0 auto 2px;border-radius:99px;background:var(--bd)}
.mob-actions-header{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mob-actions-header>div{display:flex;min-width:0;flex-direction:column;gap:2px}
.mob-actions-header strong{font-family:'Syne',sans-serif;font-size:19px;color:var(--tx)}
.mob-actions-eyebrow{color:var(--prc);font-size:9px;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.mob-actions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;overflow-y:auto}
.mob-action{
  display:flex;min-width:0;min-height:72px;align-items:center;gap:10px;padding:12px;
  border:1px solid var(--bd);border-radius:15px;background:var(--s2);color:var(--tx);
  text-align:left;text-decoration:none;-webkit-tap-highlight-color:transparent;
}
.mob-action>svg{width:20px;height:20px;flex:0 0 auto;color:var(--prc)}
.mob-action>span{display:flex;min-width:0;flex-direction:column;gap:3px}
.mob-action strong{font-size:11.5px;line-height:1.25}
.mob-action small{overflow:hidden;color:var(--mt);font-size:9.5px;line-height:1.25;text-overflow:ellipsis;white-space:nowrap}
.mob-action-primary{border-color:color-mix(in srgb,var(--pr) 34%,var(--bd));background:var(--prhi)}
.mob-action:active{border-color:var(--pr);transform:scale(.985)}

/* Cinq destinations maximum : quatre écrans fréquents et le menu complet. */
#mob-nav .mob-tab-more{display:flex!important;border:0;background:transparent;font-family:inherit}
#mob-nav .mob-tab-more svg{width:20px;height:20px}
#mob-nav #mob-tab-analyse,#mob-nav .mob-tab[data-view="commission"]{display:none!important}
body:not([data-mobile-role="service"]) #mob-tab-service{display:none!important}
body[data-mobile-role="service"] #mob-tab-service{display:flex!important}

/* KPI : lecture directe en grille, sans carrousel horizontal. */
.kgrid,.evt-kpis,.retc-kpis,.rp-pay-kpis,.profitability-kpis,.commercial-references-kpis{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:10px!important;max-width:100%;margin-inline:0!important;padding-inline:0!important;
  overflow:visible!important;scroll-snap-type:none!important;
}
.kgrid .kc,.evt-kpis .kc,.retc-kpis .retc-kpi,.rp-pay-kpis .rp-pay-kpi,.profitability-kpis .profitability-kpi,.commercial-references-kpis .kc{
  width:auto!important;min-width:0!important;min-height:104px;scroll-snap-align:none;
}
.kc{padding:14px!important;gap:7px}
.kval{font-size:clamp(18px,5.3vw,23px)!important;line-height:1.15;white-space:normal;overflow-wrap:anywhere}
.klbl,.retc-kpi-label{white-space:normal!important;line-height:1.25}
.retc-kpi-value,.rp-pay-kpi strong{white-space:normal!important;overflow-wrap:anywhere}

/* Filtres et barres d’outils : retour à la ligne naturel et cibles tactiles pleine largeur. */
.ttb,.pctrl,.retc-tabs,.retc-toolbar-actions{
  overflow:visible!important;flex-wrap:wrap!important;max-width:100%;scroll-snap-type:none!important;
}
.ttb{align-items:center!important}
.ttb>h3,.ttb>div:first-child{flex:1 1 170px}
.ttb>.btn{flex:1 1 auto;justify-content:center}
.svc-subview>div:first-child{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px!important;
  overflow:visible!important;padding-bottom:0!important;
}
.svc-subview>div:first-child>*{width:100%!important;min-width:0!important}
.svc-subview>div:first-child>.btn{justify-content:center}
.retc-toolbar-actions>*{flex:1 1 auto;justify-content:center}
.fgrid{gap:12px!important}
.fg{min-width:0}
.fi,.flt{width:100%;min-width:0}

/* Tableaux courts : ils tiennent dans l’écran. */
.mobile-fit-region{max-width:100%;overflow-x:hidden!important}
table.mobile-fit-table{width:100%!important;min-width:100%!important;table-layout:auto}
table.mobile-fit-table th,table.mobile-fit-table td{padding:10px 8px!important;white-space:normal!important;font-size:10.5px}

/* Tableaux larges : fiches lisibles par défaut, tableau complet disponible sur demande. */
.mobile-card-region{max-width:100%;overflow:visible!important;cursor:default!important;border-radius:14px}
.mobile-card-region::after{display:none!important}
.mobile-table-controls{
  display:flex;position:relative;z-index:5;align-items:center;justify-content:space-between;gap:10px;
  width:100%;padding:9px 10px;border-bottom:1px solid var(--bd);background:var(--s2);
}
.mobile-table-controls>span{color:var(--mt);font-size:9px;font-weight:700}
.mobile-table-mode{
  min-height:36px;padding:7px 10px;border:1px solid color-mix(in srgb,var(--pr) 28%,var(--bd));
  border-radius:10px;background:var(--sf);color:var(--prc);font-size:9.5px;font-weight:800;white-space:nowrap;
}
table.mobile-card-table{display:block;width:100%!important;min-width:0!important;border-collapse:separate!important}
table.mobile-card-table>thead{
  position:absolute!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;
  overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap!important;border:0!important;
}
table.mobile-card-table>tbody{display:grid;gap:10px;padding:10px;background:var(--bg)}
table.mobile-card-table>tbody>tr{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0;
  overflow:hidden;border:1px solid var(--bd);border-radius:14px;background:var(--sf);box-shadow:var(--shsm);
}
table.mobile-card-table>tbody>tr:hover{background:var(--sf)}
table.mobile-card-table>tbody>tr>td,table.mobile-card-table>tbody>tr>th{
  display:flex!important;position:relative!important;left:auto!important;min-width:0!important;height:auto!important;
  flex-direction:column;align-items:flex-start!important;justify-content:flex-start!important;gap:4px;
  padding:10px!important;border:0!important;border-bottom:1px solid var(--bd)!important;
  background:transparent!important;box-shadow:none!important;color:var(--tx);font-size:11px!important;
  text-align:left!important;white-space:normal!important;overflow-wrap:anywhere;
}
table.mobile-card-table>tbody>tr>td:nth-child(odd){border-right:1px solid var(--bd)!important}
table.mobile-card-table>tbody>tr>td:first-child{
  grid-column:1/-1;border-right:0!important;background:var(--s2)!important;font-weight:800!important;
}
table.mobile-card-table>tbody>tr>td::before,table.mobile-card-table>tbody>tr>th::before{
  content:attr(data-mobile-label);display:block;color:var(--mt);font-size:8px;font-weight:800;
  letter-spacing:.055em;line-height:1.2;text-transform:uppercase;
}
table.mobile-card-table>tbody>tr>td[data-mobile-label=""]::before{display:none}
table.mobile-card-table>tbody>tr>td.mobile-span-cell,
table.mobile-card-table>tbody>tr>td[data-mobile-label*="Action"],
table.mobile-card-table>tbody>tr>td[data-mobile-label*="Suivi"]{grid-column:1/-1;border-right:0!important}
table.mobile-card-table>tbody>tr>td>div:not(.tel-line-track):not(.btrack):not(.spark){
  width:100%;max-width:100%;justify-content:flex-start!important;text-align:left!important;
}
table.mobile-card-table input,table.mobile-card-table select,table.mobile-card-table textarea{width:100%!important;max-width:100%}
table.mobile-card-table .btn,table.mobile-card-table .bico{min-height:40px}
table.mobile-card-table>tfoot{display:block;padding:0 10px 10px;background:var(--bg)}
table.mobile-card-table>tfoot>tr{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));overflow:hidden;border:1px solid var(--bd);border-radius:12px;background:var(--sf)}
table.mobile-card-table>tfoot td{display:flex!important;min-width:0;flex-direction:column;padding:10px!important;white-space:normal!important}

.mobile-card-region.mobile-table-wide{
  display:block;overflow-x:auto!important;-webkit-overflow-scrolling:touch;touch-action:pan-x pan-y;cursor:grab!important;
}
.mobile-card-region.mobile-table-wide[data-scrollable="true"]::after{display:inline-flex!important}
.mobile-table-wide .mobile-table-controls{position:sticky;left:0;min-width:min(100vw - 24px,100%)}
.mobile-table-wide table.mobile-card-table{display:table;width:max-content!important;min-width:max(900px,100%)!important;border-collapse:collapse!important}
.mobile-table-wide table.mobile-card-table>thead{position:static!important;width:auto!important;height:auto!important;margin:0!important;overflow:visible!important;clip:auto!important;white-space:normal!important}
.mobile-table-wide table.mobile-card-table>tbody{display:table-row-group;padding:0;background:transparent}
.mobile-table-wide table.mobile-card-table>tfoot{display:table-footer-group;padding:0;background:transparent}
.mobile-table-wide table.mobile-card-table>tbody>tr,.mobile-table-wide table.mobile-card-table>tfoot>tr{display:table-row;border:0;background:transparent;box-shadow:none}
.mobile-table-wide table.mobile-card-table>tbody>tr>td,.mobile-table-wide table.mobile-card-table>tbody>tr>th,.mobile-table-wide table.mobile-card-table>tfoot td{
  display:table-cell!important;position:static!important;height:44px!important;padding:10px 12px!important;
  border-bottom:1px solid var(--bd)!important;background:transparent!important;text-align:center!important;white-space:nowrap!important;
}
.mobile-table-wide table.mobile-card-table>tbody>tr>td::before,.mobile-table-wide table.mobile-card-table>tbody>tr>th::before{display:none}

/* Écrans denses et fenêtres : tout reste dans la largeur utile. */
.tc,.cc,.fcard,.analyse-chart-card,.retc-head,.workflow-table-card{max-width:100%}
.modal .pwa-install-actions,.modal>div:last-child{flex-wrap:wrap}
.modal .pwa-install-actions>.btn{flex:1 1 140px;justify-content:center}
.calls-frame-wrap{min-height:calc(100dvh - 190px)}

@media(max-width:390px){
  .mob-actions-grid{grid-template-columns:1fr 1fr;gap:7px}
  .mob-action{min-height:68px;padding:10px}
  .svc-subview>div:first-child{grid-template-columns:1fr}
  .kgrid,.evt-kpis,.retc-kpis,.rp-pay-kpis{gap:8px!important}
  .kgrid .kc,.evt-kpis .kc,.retc-kpis .retc-kpi,.rp-pay-kpis .rp-pay-kpi{min-height:96px}
}

@media(max-width:350px){
  .mob-actions-grid{grid-template-columns:1fr}
  table.mobile-card-table>tbody>tr,table.mobile-card-table>tfoot>tr{grid-template-columns:1fr}
  table.mobile-card-table>tbody>tr>td{border-right:0!important}
  .mobile-table-controls{align-items:stretch;flex-direction:column}
  .mobile-table-mode{width:100%}
}