/* NowBusiness v1.0.1 / ND199 — hotfix mobile: modal, campos, dock e pilha de flutuantes. */

:root{
  --nb-mobile-fab-size:54px;
  --nb-mobile-fab-gap:10px;
  --nb-mobile-fab-right:14px;
}

/* A camada final só contém; não muda contratos desktop da ND198. */
body.nf-redesign :is(.center-modal-card,.quote-modal-card,.quote-workspace,.quote-builder,.quote-builder-section,.quote-items,.quote-item,.quote-summary,.quote-summary-card),
body.nf-redesign :is(.form-grid-2,.form-grid-3,.form-grid-4)>*,
body.nf-redesign .quote-modal-card :is(label,input,select,textarea,button,.btn){
  min-width:0!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}

@media(max-width:900px){
  /* Quando existe dock mobile, o modal ocupa somente a área realmente visível acima dele. */
  body.nf-redesign:has(.nf-mobile-bottom-nav) .center-modal{
    inset:0 0 calc(var(--nb-pwa-bottom-nav-height,84px) + var(--nb-pwa-safe-bottom,8px)) 0!important;
    min-height:0!important;
    height:auto!important;
    padding:10px!important;
    place-items:center!important;
    overflow:hidden!important;
  }
  body.nf-redesign:has(.nf-mobile-bottom-nav) .center-modal-backdrop{inset:0!important;}
  body.nf-redesign:has(.nf-mobile-bottom-nav) .center-modal-card{
    max-height:100%!important;
    scroll-padding-bottom:24px!important;
  }

  /* Fallback seguro para superfícies sem dock. */
  body.nf-redesign .center-modal{
    box-sizing:border-box!important;
    max-width:100vw!important;
    overflow:hidden!important;
  }
  body.nf-redesign .center-modal-card{
    box-sizing:border-box!important;
    margin-inline:auto!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }

  /* Uma única régua para os três atalhos flutuantes. */
  body.nf-redesign{
    --nb-mobile-fab-base:calc(var(--nb-pwa-bottom-nav-height,84px) + var(--nb-pwa-safe-bottom,8px) + 14px);
  }
  body.nf-redesign .nowchat-support-fab,
  body.nf-redesign .page-help-fab,
  body.nf-redesign .contextual-intelligence-toggle{
    width:var(--nb-mobile-fab-size)!important;
    min-width:var(--nb-mobile-fab-size)!important;
    max-width:var(--nb-mobile-fab-size)!important;
    height:var(--nb-mobile-fab-size)!important;
    min-height:var(--nb-mobile-fab-size)!important;
    max-height:var(--nb-mobile-fab-size)!important;
    padding:0!important;
    border-radius:50%!important;
    display:grid!important;
    place-items:center!important;
    box-sizing:border-box!important;
  }
  body.nf-redesign .nowchat-support-fab{
    right:var(--nb-mobile-fab-right)!important;
    bottom:var(--nb-mobile-fab-base)!important;
  }
  body.nf-redesign .contextual-intelligence{
    right:var(--nb-mobile-fab-right)!important;
    bottom:calc(var(--nb-mobile-fab-base) + var(--nb-mobile-fab-size) + var(--nb-mobile-fab-gap))!important;
    width:var(--nb-mobile-fab-size)!important;
    max-width:var(--nb-mobile-fab-size)!important;
    align-items:center!important;
    gap:var(--nb-mobile-fab-gap)!important;
  }
  body.nf-redesign .contextual-intelligence-toggle{position:static!important;margin:0!important;}
  body.nf-redesign .contextual-intelligence-toggle strong,
  body.nf-redesign .contextual-intelligence-toggle b{display:none!important;}
  body.nf-redesign .contextual-intelligence-toggle>span{display:grid!important;place-items:center!important;margin:0!important;}
  body.nf-redesign .page-help-fab{
    right:var(--nb-mobile-fab-right)!important;
    bottom:calc(var(--nb-mobile-fab-base) + var(--nb-mobile-fab-size) + var(--nb-mobile-fab-gap) + var(--nb-mobile-fab-size) + var(--nb-mobile-fab-gap))!important;
  }
  body.nf-redesign .page-help-fab span{display:none!important;}

  /* Painéis abertos expandem para a esquerda, mantendo o botão ancorado na régua da direita. */
  body.nf-redesign .contextual-intelligence-panel{
    position:fixed!important;
    right:var(--nb-mobile-fab-right)!important;
    bottom:calc(var(--nb-mobile-fab-base) + var(--nb-mobile-fab-size) + var(--nb-mobile-fab-gap))!important;
    width:min(400px,calc(100vw - 28px))!important;
    max-width:calc(100vw - 28px)!important;
    max-height:calc(var(--nb-visual-viewport-height,100dvh) - var(--nb-pwa-bottom-nav-height,84px) - 120px)!important;
    overflow:auto!important;
  }
  body.nf-redesign .nowchat-support-frame{
    right:var(--nb-mobile-fab-right)!important;
    bottom:calc(var(--nb-mobile-fab-base) + var(--nb-mobile-fab-size) + var(--nb-mobile-fab-gap))!important;
    max-width:calc(100vw - var(--nb-mobile-fab-right) - var(--nb-mobile-fab-right))!important;
  }

  /* Modal aberto tem prioridade visual: flutuantes não cobrem campos nem ações. */
  body.nf-redesign:has(.center-modal:not([hidden])) :is(.nowchat-support-fab,.page-help-fab,.contextual-intelligence){
    opacity:0!important;
    visibility:hidden!important;
    pointer-events:none!important;
  }

  /* Conteúdo normal também precisa terminar acima do dock, inclusive telas sem sugestões. */
  body.nf-redesign .content{
    padding-bottom:calc(var(--nb-pwa-bottom-nav-height,84px) + var(--nb-pwa-safe-bottom,8px) + 32px)!important;
    scroll-padding-bottom:calc(var(--nb-pwa-bottom-nav-height,84px) + var(--nb-pwa-safe-bottom,8px) + 32px)!important;
  }
}

@media(max-width:620px){
  /* O modal usa a largura do container já descontado o padding: nunca 100vw dentro de pai com padding. */
  body.nf-redesign .center-modal{padding:8px!important;}
  body.nf-redesign .quote-modal-card{
    width:100%!important;
    max-width:100%!important;
    margin:0 auto!important;
    padding:clamp(16px,4vw,22px)!important;
    border-radius:18px!important;
  }
  body.nf-redesign .quote-modal-card .center-modal-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:start!important;
    gap:12px!important;
  }
  body.nf-redesign .quote-modal-card .center-modal-head>div{min-width:0!important;}
  body.nf-redesign .quote-modal-card .center-modal-head .icon-btn{grid-column:2!important;grid-row:1!important;}
  body.nf-redesign .quote-modal-card .center-modal-head h2{
    font-size:clamp(27px,8.5vw,36px)!important;
    line-height:1.08!important;
    overflow-wrap:anywhere!important;
  }

  body.nf-redesign .quote-workspace,
  body.nf-redesign .quote-builder,
  body.nf-redesign .quote-summary,
  body.nf-redesign .quote-modal-card :is(.form-grid-2,.form-grid-3,.form-grid-4){
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:minmax(0,1fr)!important;
  }
  body.nf-redesign .quote-builder-section,
  body.nf-redesign .quote-summary-card{
    width:100%!important;
    max-width:100%!important;
    padding:clamp(14px,4vw,18px)!important;
  }
  body.nf-redesign .quote-modal-card label{width:100%!important;min-width:0!important;}
  body.nf-redesign .quote-modal-card :is(input:not([type="checkbox"]):not([type="radio"]),select,textarea){
    display:block!important;
    inline-size:100%!important;
    width:100%!important;
    min-inline-size:0!important;
    max-inline-size:100%!important;
    max-width:100%!important;
    font-size:16px!important;
  }
  body.nf-redesign .quote-modal-card input[type="date"]{
    min-width:0!important;
    width:100%!important;
    max-width:100%!important;
  }

  /* Itens e ações do orçamento deixam de carregar mínimos desktop escondidos. */
  body.nf-redesign .quote-item{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:minmax(0,1fr)!important;
    overflow:hidden!important;
  }
  body.nf-redesign .quote-item>*{width:100%!important;min-width:0!important;max-width:100%!important;}
  body.nf-redesign .quote-item-actions{width:100%!important;max-width:100%!important;grid-column:auto!important;}
  body.nf-redesign .quote-item-actions-buttons{
    width:100%!important;
    max-width:100%!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  body.nf-redesign .quote-item-action{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    white-space:normal!important;
  }

  body.nf-redesign .quote-summary{position:static!important;}
  body.nf-redesign .quote-summary-line{min-width:0!important;}
  body.nf-redesign .quote-summary-line span{min-width:0!important;overflow-wrap:anywhere!important;}
  body.nf-redesign .quote-summary-line strong{flex:0 0 auto!important;}

  body.nf-redesign .quote-modal-card .form-footer{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
  }
  body.nf-redesign .quote-modal-card .form-footer>*{width:100%!important;max-width:100%!important;}
}

@media(max-width:390px){
  :root{--nb-mobile-fab-size:50px;--nb-mobile-fab-gap:9px;--nb-mobile-fab-right:10px;}
  body.nf-redesign .quote-modal-card{padding:15px!important;}
  body.nf-redesign .quote-builder-section,body.nf-redesign .quote-summary-card{padding:13px!important;}
  body.nf-redesign .quote-item-actions-buttons{grid-template-columns:minmax(0,1fr)!important;}
}

/* Etapa 0.2 — navegação canônica e Financeiro sem sobrecarregar o menu principal. */
body.nf-redesign .central-workspace-more{
  flex:0 0 auto;
  min-height:38px;
  border:1px solid var(--border);
  border-radius:999px;
  color:var(--muted);
  background:color-mix(in srgb,var(--surface) 94%,transparent);
}
body.nf-redesign .central-workspace-more>summary{
  min-height:36px;
  padding:8px 14px;
  display:flex;
  align-items:center;
  cursor:pointer;
  list-style:none;
  white-space:nowrap;
  font-weight:750;
}
body.nf-redesign .central-workspace-more>summary::-webkit-details-marker{display:none}
body.nf-redesign .central-workspace-more>summary::after{content:'›';margin-left:8px;transition:transform .18s ease}
body.nf-redesign .central-workspace-more[open]{display:flex;align-items:center;gap:4px;padding-right:6px;border-radius:22px}
body.nf-redesign .central-workspace-more[open]>summary::after{transform:rotate(180deg)}
body.nf-redesign .central-workspace-more.is-active{border-color:color-mix(in srgb,var(--primary) 55%,var(--border))}
body.nf-redesign .central-workspace-more-links{display:flex;align-items:center;gap:6px}
body.nf-redesign .central-workspace-more-links a{min-height:34px;padding:7px 12px;font-size:.9rem}
body.nf-redesign button.nf-mobile-nav-item{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  cursor:pointer;
}
@media(max-width:560px){
  body.nf-redesign .central-workspace-more{min-height:36px}
  body.nf-redesign .central-workspace-more>summary{min-height:34px;padding:7px 12px;font-size:.88rem}
  body.nf-redesign .central-workspace-more-links a{font-size:.86rem}
}
