/* DSA CRM v10.6 — adaptation tactile isolée des écrans ordinateur. */

.mobile-nav-toggle,.mobile-nav-scrim{display:none}

@media(max-width:1180px){
  html,body,#app{width:100%;max-width:100%;height:100%;height:100dvh}
  body{overscroll-behavior:none;-webkit-text-size-adjust:100%;touch-action:manipulation}
  #app.on{display:flex}
  .mn{width:100%;min-width:0}
  .sb{position:fixed;z-index:920;inset:0 auto 0 0;width:min(340px,88vw);height:100%;height:100dvh;transform:translate3d(-102%,0,0);transition:transform .28s cubic-bezier(.22,.72,0,1);box-shadow:18px 0 50px rgba(0,0,0,.18);border-right:1px solid var(--bord);overscroll-behavior:contain}
  body.mobile-nav-open .sb{transform:translate3d(0,0,0)}
  .mobile-nav-scrim{display:block;position:fixed;z-index:910;inset:0;border:0;background:rgba(15,15,17,.38);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);opacity:0;pointer-events:none;transition:opacity .22s ease}
  body.mobile-nav-open .mobile-nav-scrim{opacity:1;pointer-events:auto}
  .mobile-nav-toggle{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;border:1px solid var(--bord);border-radius:12px;background:var(--bg);color:var(--ink);font-size:22px;line-height:1;cursor:pointer}
  .sb-top{padding-top:max(20px,env(safe-area-inset-top))}
  .sb-logo{width:118px}
  .nav{padding-bottom:16px}
  .nsec{font-size:12px;padding:15px 18px 6px}
  .ni{min-height:48px;padding:11px 18px;font-size:16px;gap:12px}
  .ni-ic{width:22px;font-size:17px}
  .sb-bot{padding-bottom:max(16px,env(safe-area-inset-bottom))}
  .logout,#dark-toggle{min-height:44px;font-size:14px!important}
  .topbar{min-height:64px;height:auto;padding:8px 14px;gap:10px}
  .topbar .tb-title{font-size:19px;max-width:none}
  .topbar #topbar-extra{min-width:0;max-width:100%;overflow-x:auto;scrollbar-width:none}
  .topbar #topbar-extra::-webkit-scrollbar,.frow::-webkit-scrollbar,.mandat-tabs::-webkit-scrollbar{display:none}
  .content{padding:18px;min-width:0;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .kgrid,.kgrid-5,.kgrid-3,.personal-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .g3,.g4{grid-template-columns:repeat(2,minmax(0,1fr))}
  .kc,.card,.todo-card,.sales-agent-card{max-width:100%}
  .btn,.inp,.sel,.ta,.form-inp,.form-sel,.v10-input{min-height:44px}
  button,.btn,.chip,.ni,select,input[type="date"],input[type="time"]{touch-action:manipulation}
  input,select,textarea{font-size:16px!important}
  .panel{width:min(760px,94vw);max-width:none}
  .panel.mandat-create-panel{width:min(920px,96vw)}
  .modal{max-width:94vw}
  .mov .modal{max-height:92dvh}
  .form-row.c3,.r3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .mandat-page-head{align-items:flex-start}
  .mandat-tabs{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap;overscroll-behavior-x:contain}
  .mandat-tab{min-height:42px;display:flex;align-items:center}
  .doc-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .doc-card-preview{height:170px!important}
  .twrap,.sales-table-wrap,.metric-table-wrap,.card{scrollbar-width:thin}
  .twrap,.sales-table-wrap,.metric-table-wrap{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
  .sales-table{min-width:820px}
  .signature-box canvas{touch-action:none;min-height:170px}
  .v9-gcal-shell,.v9-calendar-shell{max-width:100%}
  .v9-gcal-scroll{scroll-behavior:smooth;scrollbar-width:thin;overscroll-behavior-x:contain}
  .v9-gcal-head,.v9-gcal-reminders{position:relative}
  .contract-studio-body{grid-template-columns:1fr;overflow:auto}
  .contract-preview{height:58dvh;min-height:460px}
  .contract-editor{overflow:visible}
}

@media(min-width:681px) and (max-width:1180px){
  .content{padding:18px 20px}
  .kgrid-5{grid-template-columns:repeat(3,minmax(0,1fr))}
  .topbar{padding-left:18px;padding-right:18px}
  .todo-overview,.todo-workspace{grid-template-columns:1fr!important}
  .todo-side-stack{grid-template-columns:repeat(2,minmax(0,1fr))!important;grid-template-rows:auto!important}
  .v10-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .doc-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
}

@media(max-width:680px){
  :root{--rad:10px;--radl:14px}
  body{font-size:15px;line-height:1.48}
  .topbar{display:grid!important;grid-template-columns:44px minmax(0,1fr) auto!important;grid-template-rows:auto auto;column-gap:9px;row-gap:7px;padding:8px 10px!important;padding-top:max(8px,env(safe-area-inset-top))!important}
  .mobile-nav-toggle{grid-column:1;grid-row:1}
  .topbar .tb-title{grid-column:2;grid-row:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:18px!important}
  .topbar .sp{display:none}
  .topbar #sync-status{grid-column:3!important;grid-row:1!important;margin:0!important}
  .topbar #topbar-extra{grid-column:1/-1!important;grid-row:2!important;width:100%;padding-bottom:1px}
  .topbar #btn-new-mandat{grid-column:1/-1;grid-row:3;width:100%;margin-top:1px}
  .v9-toolbar{min-width:max-content;padding-right:2px}
  .v9-compact-control{min-height:46px}
  .content{padding:12px 10px max(18px,env(safe-area-inset-bottom));overflow-x:hidden}
  .content.todo-content{padding:10px!important}
  .view.on{width:100%;min-width:0}
  .kgrid,.kgrid-5,.kgrid-3,.personal-kpis,.g2,.g3,.g4,.dash-goals{grid-template-columns:1fr!important;gap:10px}
  .kc{padding:15px 16px}.kv{font-size:27px}.kl{font-size:12px}.kd{font-size:13px}
  .card,.todo-card{padding:14px;margin-bottom:11px}
  .ct{font-size:17px}.cs{font-size:14px;line-height:1.45}
  .frow{flex-wrap:nowrap;overflow-x:auto;margin-left:-10px;margin-right:-10px;padding:0 10px 6px;scroll-snap-type:x proximity;overscroll-behavior-x:contain}
  .frow>*{flex:0 0 auto;scroll-snap-align:start}
  .frow .fsearch{width:210px;min-height:42px}
  .chip{min-height:42px;display:inline-flex;align-items:center;padding:8px 14px;font-size:14px}
  .twrap,.sales-table-wrap,.metric-table-wrap,.view .card:has(>table){overflow:auto;max-width:100%;border-radius:12px}
  .twrap>table,.card>table,.view table:not(.sales-table):not(.metric-table){min-width:680px}
  th{padding:11px 12px;font-size:12px}td{padding:12px;font-size:14px}
  .panel,.panel.mandat-create-panel{inset:0;width:100vw!important;max-width:none!important;height:100dvh;border-radius:0}
  .ph{position:sticky;top:0;z-index:4;padding:14px 15px;padding-top:max(14px,env(safe-area-inset-top))}
  .ph-t{font-size:17px}.ph-x{width:42px;height:42px}
  #pb{padding:15px 14px max(24px,env(safe-area-inset-bottom))}
  .form-row.c2,.form-row.c3,.r2,.r3,.contract-field-grid,.v10-form-grid,.v10-form-grid.cols3{grid-template-columns:1fr!important}
  .form-actions,.v10-actions{position:sticky;bottom:0;z-index:3;padding:12px 0 max(8px,env(safe-area-inset-bottom));background:var(--bg);flex-direction:column-reverse}
  .form-actions .btn,.v10-actions>*{width:100%}
  .phone-row{display:grid;grid-template-columns:105px minmax(0,1fr)}
  .phone-row .form-sel{width:100%}
  .mov{padding:0!important;align-items:stretch!important}
  .mov .modal{width:100vw!important;max-width:none!important;height:100dvh!important;max-height:none!important;border-radius:0!important;margin:0!important;padding-bottom:env(safe-area-inset-bottom)}
  .mt{padding:16px 15px 2px!important;padding-top:max(16px,env(safe-area-inset-top))!important;font-size:19px!important}
  .ms2{padding-left:15px!important;padding-right:15px!important}
  #mo-b{padding:14px 15px 22px!important;max-height:calc(100dvh - 82px)!important;overflow:auto!important}
  .doc-viewer-head,.contract-studio-head{min-height:auto;padding:12px;gap:9px;flex-wrap:wrap;padding-top:max(12px,env(safe-area-inset-top))}
  .doc-viewer-title,.contract-studio-title{flex:1 1 calc(100% - 96px);min-width:0}
  #doc-viewer-download{order:3;flex:1 1 100%;text-align:center}
  .doc-viewer-close{min-height:44px;padding:8px 12px}
  .doc-viewer-body{padding:4px!important}
  .doc-viewer-content iframe,.doc-viewer-content img{max-width:100%}
  .contract-studio-body{padding:5px!important}
  .contract-preview{height:48dvh;min-height:340px}
  .contract-editor{padding:13px!important}
  .mandat-page-head{flex-direction:column;padding:15px}
  .mandat-page-head>div:last-child{width:100%;justify-content:flex-start!important}
  .mandat-page-main,.mandat-vault{padding:13px!important}
  .mandat-tabs{margin-left:-2px;margin-right:-2px;padding-bottom:10px;scroll-snap-type:x proximity}
  .mandat-tab{scroll-snap-align:start;padding:10px 14px;font-size:14px}
  .certificate-item{padding:12px}
  .certificate-actions .btn{flex:1 1 auto}
  .sales-agent-head{grid-template-columns:1fr!important;padding:15px}
  .sales-agent-id{grid-column:auto!important}
  .sales-metric{padding:10px 0 0!important;border-left:0!important;border-top:1px solid var(--bord)}
  .sales-metric-value{font-size:22px}
  .doc-grid{grid-template-columns:1fr!important}
  .doc-card-preview{height:210px!important}
  .doc-drive-toolbar{grid-template-columns:1fr!important}
  .doc-drive-toolbar>*{grid-column:auto!important;grid-row:auto!important;width:100%}
  .doc-view-switch{justify-content:flex-start}
  .todo-shell{gap:10px!important}
  .todo-overview,.todo-workspace,.todo-side-stack{grid-template-columns:1fr!important}
  .todo-hero{padding:15px!important}.todo-title{font-size:24px!important}
  .todo-calendar-card{padding-left:0!important;padding-right:0!important;overflow:hidden}
  .todo-calendar-card>.todo-card-title{padding-left:14px;padding-right:14px}
  .v9-calendar-header{padding:15px!important}.v9-calendar-header h2{font-size:22px!important}
  .v9-calendar-toolbar{padding:0 15px 12px!important}.v9-calendar-legend{padding:10px 15px!important}
  .v9-gcal-head{grid-template-columns:62px repeat(var(--day-count,5),minmax(150px,1fr))!important;min-width:812px!important}
  .v9-gcal-scroll{grid-template-columns:62px minmax(0,1fr)!important;height:610px!important}
  .v9-gcal-days{grid-template-columns:repeat(var(--day-count),minmax(150px,1fr))!important;min-width:calc(var(--day-count) * 150px)!important}
  .v9-gcal-reminders{grid-template-columns:62px repeat(var(--day-count),minmax(150px,1fr))!important;min-width:812px!important}
  .v9-gcal-time{font-size:12px!important;padding-right:8px!important}
  .v9-gcal-event{font-size:13px!important;line-height:1.3!important}
  .v9-now-line{height:3px!important;box-shadow:0 0 0 1px rgba(255,255,255,.8),0 1px 5px rgba(180,20,35,.45)!important}
  .v10-settings-head{align-items:flex-start;gap:10px}.v10-settings-title{font-size:25px!important}
  .v10-setting-tile{min-height:96px;padding:16px}
  .v10-person{padding:14px!important}
  .v10-person .v10-secondary,.v10-person .v10-danger{width:100%;height:44px!important}
  .l-logo{width:190px}.lc{width:min(360px,92vw)}.lc>div[style]{width:min(300px,84vw)!important}
}

@media(max-width:680px) and (orientation:landscape){
  .sb{width:min(360px,66vw)}
  .contract-preview{height:68dvh}
  .v9-gcal-scroll{height:520px!important}
}

@media(prefers-reduced-motion:reduce){
  .sb,.mobile-nav-scrim{transition:none!important}
}
