/* Modo mobile (body.mobile) — ativado automaticamente por static/mobile.js. Mesmos tokens do design system. */
.m-fab,.m-stage-picker,.m-contact{display:none}
.contact-btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:10px;border:1px solid var(--line);background:var(--panel);font-weight:600;font-size:13px;margin-right:8px}
.contact-btn.wa{border-color:#1f6e4d;color:var(--green)}

body.mobile{-webkit-tap-highlight-color:transparent;overscroll-behavior-y:none}
body.mobile .m-contact{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}

/* Estrutura: sem barra lateral; barra superior compacta; navegação inferior com área segura do iPhone */
body.mobile .shell{display:block}
body.mobile .sidebar{position:fixed;left:-260px;width:250px;transition:left .2s;z-index:60}
body.mobile .sidebar.open{left:0;box-shadow:20px 0 60px #0008}
body.mobile .topbar{position:sticky;top:0;z-index:40;height:auto;min-height:60px;padding:calc(env(safe-area-inset-top) + 8px) 14px 8px;gap:10px;background:#071116f2;backdrop-filter:blur(10px)}
body.mobile .topbar .top-left{display:none}
body.mobile .mobile-toggle{display:none}
body.mobile .top-actions .tag,body.mobile .top-actions .label,body.mobile .topbar .avatar{display:none}
body.mobile .search{flex:1;max-width:none}
body.mobile main{padding:18px 14px calc(96px + env(safe-area-inset-bottom))}
body.mobile .sync{display:none}
body.mobile .mobile-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));position:fixed;bottom:0;left:0;right:0;height:calc(64px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:#0a161df7;backdrop-filter:blur(12px);border-top:1px solid var(--line);z-index:45}
body.mobile .mobile-nav a,body.mobile .mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-size:11px;font-weight:600;color:#a0b3be;background:none;border:0;border-radius:0;padding:0;min-height:56px}
body.mobile .mobile-nav .icon{width:22px;height:22px}
body.mobile .mobile-nav a.active{color:var(--green)}
body.mobile .mobile-nav a.active .icon{filter:drop-shadow(0 0 6px #00db8966)}

/* Tipografia e toque: campos ≥ 16 px (evita zoom no iPhone), alvos ≥ 44 px */
body.mobile input,body.mobile select,body.mobile textarea{font-size:16px!important;min-height:44px}
body.mobile .field{font-size:13px}
body.mobile main button,body.mobile #drawer button,body.mobile .crm-chip,body.mobile .segmented a,body.mobile .small-link{min-height:44px}
body.mobile main button.small,body.mobile #drawer button.small{padding:10px 14px;font-size:13px}
body.mobile h1{font-size:26px;letter-spacing:-.6px}
body.mobile .page-heading{flex-direction:column;align-items:stretch;gap:14px;margin-bottom:16px}
body.mobile .heading-actions{display:flex;flex-wrap:wrap;gap:8px}
body.mobile .heading-actions>button{flex:1 1 auto}
body.mobile .subtext{font-size:13px}

/* Cartões de indicadores: valores longos cabem na largura */
body.mobile .kpis{grid-template-columns:1fr 1fr;gap:10px}
body.mobile .kpi{padding:16px!important}
body.mobile .kpi .value{font-size:clamp(17px,5.4vw,24px)!important;white-space:normal;word-break:break-word;margin:10px 0 8px}
body.mobile .kpi .icon-wrap{display:none}
body.mobile .grid2,body.mobile .grid3,body.mobile .dashboard-mid,body.mobile .pricing-grid,body.mobile .grid-cal-wrap,body.mobile .chat-layout{grid-template-columns:1fr!important}
body.mobile .card{padding:16px;border-radius:14px}
body.mobile .form-grid{grid-template-columns:1fr}
body.mobile .result-line{gap:10px}

/* Tabelas viram cartões empilhados com rótulos */
body.mobile .table-wrap{overflow:visible;border:0;background:none}
body.mobile table.m-cards,body.mobile table.m-cards tbody,body.mobile table.m-cards tr,body.mobile table.m-cards td{display:block;width:100%}
body.mobile table.m-cards thead{display:none}
body.mobile table.m-cards tr{background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:6px 14px;margin-bottom:10px}
body.mobile table.m-cards td{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border:0;border-bottom:1px solid #1a2c34;text-align:right;min-height:40px;word-break:break-word}
body.mobile table.m-cards td:last-child{border-bottom:0}
body.mobile table.m-cards td::before{content:attr(data-label);color:var(--muted);font-size:12px;font-weight:600;text-align:left;flex:0 0 40%}
body.mobile table.m-cards td[data-label=""]::before{display:none}
body.mobile table.m-cards td[data-label=""]{justify-content:center}
body.mobile table.m-cards td .actions{justify-content:flex-end;flex-wrap:wrap}
body.mobile .toolbar{flex-direction:column;align-items:stretch;gap:6px}
body.mobile .pagination{justify-content:center}

/* Drawers viram folhas inferiores em tela cheia */
body.mobile dialog#drawer{inset:auto 0 0 0;width:100%;max-width:100%;height:auto;max-height:92dvh;border-left:0;border-top:1px solid var(--line);border-radius:18px 18px 0 0;box-shadow:0 -20px 60px #0008;padding-bottom:env(safe-area-inset-bottom)}
body.mobile dialog#drawer[open]{animation:m-up .22s ease-out}
@keyframes m-up{from{transform:translateY(40px);opacity:.4}to{transform:none;opacity:1}}
body.mobile .drawer-head{position:sticky;top:0;background:var(--surface);z-index:2;padding:16px 18px 10px}
body.mobile .drawer-head::before{content:"";position:absolute;top:6px;left:50%;width:42px;height:4px;margin-left:-21px;border-radius:4px;background:var(--line)}
body.mobile .drawer-body{padding:8px 18px 18px}
body.mobile .drawer-footer{position:sticky;bottom:0;background:var(--surface);padding:12px 0 4px;display:grid;grid-template-columns:1fr 1.4fr;gap:10px}

/* Menu "Mais" e ações rápidas */
.m-sheet h3{font-size:11px;letter-spacing:1.4px;text-transform:uppercase;color:var(--muted);margin:18px 0 8px}
.m-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.m-item{display:flex;align-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--panel);font-weight:600;font-size:13px;min-height:52px;text-align:left;justify-content:flex-start;color:var(--text)}
.m-item.active{border-color:var(--green);color:var(--green)}
.m-user{display:flex;align-items:center;gap:12px}
.m-user small{display:block;color:var(--muted)}
.m-prefs{display:flex;flex-direction:column;gap:10px}
.m-prefs button{justify-content:flex-start}
body.mobile .m-fab{display:inline-flex;position:fixed;right:16px;bottom:calc(78px + env(safe-area-inset-bottom));width:58px;height:58px;border-radius:50%;z-index:50;box-shadow:0 10px 30px #00db8955;padding:0}
body.mobile .m-fab .icon{width:26px;height:26px}

/* Widget "Atenção do dia" */
body.mobile .crm-widget{padding:14px!important}
body.mobile .crm-chips{grid-template-columns:1fr 1fr}
body.mobile .crm-chip:last-child{grid-column:1/-1}

/* CRM */
body.mobile .crm-top{flex-direction:column;align-items:stretch;gap:10px;margin-bottom:8px}
body.mobile .crm-search{min-width:0}
body.mobile .crm-tabs{position:sticky;top:calc(60px + env(safe-area-inset-top));z-index:30;background:var(--bg);margin:0 -14px 14px;padding:0 10px;scrollbar-width:none}
body.mobile .crm-tabs::-webkit-scrollbar{display:none}
body.mobile .crm-tabs a{padding:12px 10px;font-size:13px}
body.mobile .crm-filters{flex-direction:column;align-items:stretch;gap:8px}
body.mobile .crm-filters .field{min-width:0}
body.mobile .crm-shortcuts{margin-left:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
body.mobile .crm-kpis{grid-template-columns:1fr 1fr;gap:8px}
body.mobile .crm-kpi .value{font-size:clamp(17px,5.2vw,22px)!important;white-space:normal;word-break:break-word}
body.mobile .m-stage-picker{display:flex;gap:6px;overflow-x:auto;padding:2px 0 10px;scrollbar-width:none;margin-bottom:6px}
body.mobile .m-stage-picker::-webkit-scrollbar{display:none}
body.mobile .m-stage-picker button{flex:0 0 auto;border-radius:20px;padding:9px 14px;font-size:13px;white-space:nowrap}
body.mobile .m-stage-picker button.active{background:var(--green);color:#03251a;border-color:var(--green)}
body.mobile .m-stage-picker button.perdida.active{background:var(--danger);border-color:var(--danger)}
body.mobile .m-stage-picker b{opacity:.75;margin-left:4px}
body.mobile .kanban.m-one{display:block}
body.mobile .kanban.m-one .kanban-col{border:0;background:none;padding:0}
body.mobile .kanban.m-one .kanban-col header{display:none}
body.mobile .kanban-card{cursor:default;font-size:13px;padding:14px}
body.mobile .kanban-card .kanban-move{min-height:44px}
body.mobile .crm-customer-head .actions{flex-wrap:nowrap;overflow-x:auto;padding-bottom:6px;scrollbar-width:none}
body.mobile .crm-customer-head .actions button{flex:0 0 auto}
body.mobile .task-row{flex-direction:column;align-items:stretch}
body.mobile .task-row strong{max-width:none;justify-content:flex-start}
body.mobile .m-day{margin-bottom:10px}
body.mobile .m-day h3{text-transform:capitalize;margin-bottom:6px}
body.mobile .m-day.today{border-color:var(--green)}
body.mobile .m-day.late{border-color:var(--danger)}
body.mobile .radar-card{grid-template-columns:1fr;gap:10px}
body.mobile .radar-score{flex-direction:row;gap:10px;justify-content:flex-start;padding:10px 14px}
body.mobile .chat-messages{max-height:55dvh}
body.mobile .msg{max-width:88%}
body.mobile .assist-form{grid-template-columns:1fr}
body.mobile .chips{flex-wrap:nowrap;overflow-x:auto}
body.mobile .chips button{flex:0 0 auto}
body.mobile .prop-item{grid-template-columns:1fr 1fr}
body.mobile .prop-item .field:first-child{grid-column:1/-1}

/* Login */
body.mobile .login-page{grid-template-columns:1fr}
body.mobile .login-visual{display:none}
body.mobile .login-side{min-height:100dvh;padding:calc(env(safe-area-inset-top) + 24px) 20px 24px}

/* Telas largas em modo mobile forçado */
@media(min-width:821px){body.mobile main{max-width:760px;margin:0 auto}}
@media(prefers-reduced-motion:reduce){body.mobile dialog#drawer[open]{animation:none}}
/* Nada pode alargar a viewport do celular */
body.mobile .workspace,body.mobile #app{overflow-x:clip;max-width:100vw}
body.mobile table.m-cards td{flex-wrap:wrap;min-width:0}
body.mobile table.m-cards td>*{min-width:0;max-width:100%}
body.mobile table.m-cards td .tag,body.mobile table.m-cards td small{white-space:normal;word-break:break-word}
body.mobile table.m-cards td .empty{white-space:normal;width:100%;text-align:center}
body.mobile .tag{white-space:normal}
