/* Cockpit X3D : confort sur téléphone et petite tablette */
.bnav{display:none}

@media (max-width:760px){
  /* En-tête compacte sur une seule ligne */
  .topin{flex-wrap:nowrap;gap:8px;padding:8px 12px}
  .crumb{gap:8px;flex:1;min-width:0}
  .crumb>div{min-width:0}
  #crumbG{display:none}
  #crumbT{font-size:17px;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
  .menuBtn{width:40px;height:40px;min-height:40px;padding:0!important;font-size:0!important;flex:none;display:inline-block!important;background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E1233' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E") center/22px 22px no-repeat!important}
  .menuBtn::before,.menuBtn::after{display:none!important;content:none!important}
  .tools{gap:6px;flex:none;flex-wrap:nowrap}
  .searchbtn{width:40px;height:40px;padding:0;justify-content:center}
  #qaBtn{width:40px;height:40px;min-height:40px;padding:0!important;font-size:0!important;border-radius:12px;display:inline-block!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E"),linear-gradient(120deg,#1D3FA8,#4A3BDE)!important;background-position:center,center!important;background-size:22px 22px,cover!important;background-repeat:no-repeat!important}
  #qaBtn::before,#qaBtn::after{display:none!important;content:none!important}
  .tools label.f[for="year"]{font-size:0;gap:0!important}
  .tools label.f[for="year"] select{font-size:14px!important;padding:6px 20px 6px 6px;height:40px;width:82px!important;min-width:82px}
  #exportBtn{display:none!important}
  .qamenu{position:fixed!important;left:12px!important;right:12px!important;top:62px!important;width:auto!important;max-height:70vh;overflow:auto}

  /* Contenu */
  main{padding:14px 12px calc(84px + env(safe-area-inset-bottom,0px));gap:14px}
  .subtabs{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;width:100%;align-self:stretch;position:sticky;top:57px;z-index:9}
  .subtabs::-webkit-scrollbar{display:none}
  .subtabs button{padding:9px 13px;flex:none}
  #leads-view{position:static;display:grid;grid-template-columns:1fr 1fr;overflow:visible}
  #leads-view button{white-space:normal;line-height:1.25;text-align:center}
  .panel{padding:14px;border-radius:14px}
  .panel h2,h2{font-size:17px}

  /* Champs : 16 px pour éviter le zoom automatique de l'iPhone, cibles tactiles confortables */
  input,select,textarea{font-size:16px!important}
  .btn,.icon,button.icon{min-height:38px}
  .modal{width:100%!important;padding:16px 14px calc(16px + env(safe-area-inset-bottom,0px))}
  .modal>.ph h2{font-size:17px}
  .modal .row:last-child{flex-wrap:wrap}
  .modal .row:last-child .btn{flex:1 1 auto}

  /* Tableaux transformés en cartes lisibles */
  .scroll table.mcards thead{display:none}
  .scroll table.mcards,.scroll table.mcards tbody,.scroll table.mcards tr,.scroll table.mcards td{display:block;width:100%}
  .scroll table.mcards tr{border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin:0 0 10px;background:var(--surface)}
  .scroll table.mcards td{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;border:0!important;padding:5px 0!important;text-align:right!important;min-height:0}
  .scroll table.mcards td{overflow-wrap:anywhere;white-space:normal}
  .scroll table.mcards td>*{max-width:100%}
  .scroll table.mcards td::before{content:attr(data-label);font-weight:600;color:var(--muted);text-align:left;flex:none;max-width:45%}
  .scroll table.mcards td:not([data-label])::before,.scroll table.mcards td[data-label=""]::before{display:none}
  .scroll table.mcards td:not([data-label]),.scroll table.mcards td[data-label=""]{justify-content:flex-end}
  .scroll table.mcards td[colspan]{display:block;text-align:center!important}
  .scroll table.mcards td[colspan]::before{display:none}

  /* Barre de navigation du bas */
  .bnav{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:40;background:var(--surface);border-top:1px solid var(--line);box-shadow:0 -6px 24px rgba(5,8,20,.10);padding:4px 4px calc(4px + env(safe-area-inset-bottom,0px))}
  .bnav button{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:none;color:var(--muted);font:600 11px var(--font);padding:6px 2px;border-radius:10px;cursor:pointer;min-height:52px}
  .bnav button svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .bnav button[aria-current="page"]{color:var(--blue,#1D3FA8)}
  .bnav button[aria-current="page"]::after{content:"";position:absolute;top:0;left:30%;right:30%;height:3px;border-radius:0 0 3px 3px;background:currentColor}
  .bnav .bcnt{position:absolute;top:2px;left:calc(50% + 6px);background:#E5484D;color:#fff;font-size:10px;font-weight:700;border-radius:999px;padding:0 5px;min-width:16px;text-align:center;line-height:16px}
  .ov{z-index:50}
  body:has(#ovl>*) .bnav{display:none}
  .exit-hint{bottom:calc(84px + env(safe-area-inset-bottom,0px))}
  .toast,#toast{bottom:calc(80px + env(safe-area-inset-bottom,0px))!important}
}
@media (max-width:380px){.bnav button{font-size:10px}}
@media (max-width:760px) and (prefers-color-scheme: dark){
  :root:not([data-theme="light"]) .menuBtn{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E")!important}
}
/* En-tête du téléphone aux couleurs de la barre latérale */
@media (max-width:760px){
  .top{background:radial-gradient(260px 120px at 100% 0%,rgba(29,91,230,.35),transparent 70%),linear-gradient(120deg,#05173A 0%,#0B1340 60%,#140F3D 100%)!important;border-bottom:0!important;box-shadow:0 4px 18px rgba(5,8,20,.25)}
  .top #crumbT{color:#fff}
  .top .menuBtn{background-color:rgba(255,255,255,.10)!important;border-color:rgba(255,255,255,.18)!important;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E")!important}
  .top .searchbtn{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);color:#fff}
  .top .searchbtn svg{stroke:#fff}
  .top label.f[for="year"] select{background-color:rgba(255,255,255,.10);border-color:rgba(255,255,255,.18);color:#fff;color-scheme:dark}
  .top label.f[for="year"] select option{color:#0E1233;background:#fff}
  .subtabs{top:57px}
}
@media (max-width:760px){ .top{top:0!important;padding-top:env(safe-area-inset-top,0px)} }