/*
  V11.62.3 — Mobile Budget Preview + Dates + Goals Fix Safe
  Escopo: SOMENTE mobile via media queries.
  Corrige preview de orçamento, campos de data/mês e cortes na aba Metas.
  Não altera desktop, Supabase, cache, PDF ou regras de negócio.
*/

@media (max-width:900px){
  /* Segurança geral mobile: nada deve gerar largura maior que a tela. */
  #orcamentos,
  #metas,
  #followups,
  #financeiro,
  #conteudo,
  #demandas,
  #clientes,
  #compras,
  #contratos,
  #notas,
  #links{
    max-width:100vw!important;
    overflow-x:hidden!important;
  }

  #orcamentos *,
  #metas *{
    min-width:0!important;
    box-sizing:border-box!important;
  }

  /* Campos de data/mês no mobile: centralizados, legíveis e sem corte lateral. */
  input[type="date"],
  input[type="month"],
  .modal-box input[type="date"],
  .modal-box input[type="month"],
  .drawer input[type="date"],
  .drawer input[type="month"],
  #orcamentos input[type="date"],
  #orcamentos input[type="month"],
  #metas input[type="date"],
  #metas input[type="month"],
  #followups input[type="date"],
  #followups input[type="month"],
  #financeiro input[type="date"],
  #financeiro input[type="month"],
  #conteudo input[type="date"],
  #conteudo input[type="month"],
  #demandas input[type="date"],
  #demandas input[type="month"]{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:46px!important;
    min-height:46px!important;
    padding-left:10px!important;
    padding-right:10px!important;
    text-align:center!important;
    text-align-last:center!important;
    font-size:16px!important;
    line-height:1.2!important;
    letter-spacing:-.02em!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:clip!important;
  }

  input[type="date"]::-webkit-date-and-time-value,
  input[type="month"]::-webkit-date-and-time-value{
    text-align:center!important;
    min-height:1.2em!important;
  }

  /* Orçamentos: no mobile o preview vira leitura responsiva completa.
     O PDF continua A4 porque o printQuotePDF usa CSS próprio no print window. */
  #orcamentos .quote-builder-shell{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:14px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-preview-wrap{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    position:relative!important;
    top:auto!important;
    overflow:hidden!important;
    padding:0!important;
  }

  #orcamentos .quote-preview-toolbar{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    display:block!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-preview-toolbar h2,
  #orcamentos .quote-preview-toolbar p{
    max-width:100%!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:break-word!important;
  }

  #orcamentos .quote-preview{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    border-radius:20px!important;
    transform:none!important;
  }

  #orcamentos .quote-doc{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-cover{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    min-height:auto!important;
    padding:22px 18px!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-cover-content{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:16px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:start!important;
    justify-content:start!important;
  }

  #orcamentos .quote-cover-content > div,
  #orcamentos .quote-cover-content > div[style],
  #orcamentos .quote-cover-content [style*="text-align:right"],
  #orcamentos .quote-cover-content [style*="text-align: right"]{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    text-align:left!important;
  }

  #orcamentos .quote-cover h1{
    font-size:clamp(28px,9vw,42px)!important;
    line-height:.98!important;
    letter-spacing:-.06em!important;
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  #orcamentos .quote-cover small,
  #orcamentos .quote-cover-content div,
  #orcamentos .quote-cover-content b{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  #orcamentos .quote-logo{
    max-width:132px!important;
    max-height:54px!important;
  }

  #orcamentos .quote-body{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    padding:18px!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-section,
  #orcamentos .quote-box,
  #orcamentos .quote-info,
  #orcamentos .quote-bank-box,
  #orcamentos .quote-message{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    overflow-wrap:break-word!important;
    white-space:pre-wrap!important;
  }

  #orcamentos .quote-info-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
  }

  #orcamentos .quote-info b,
  #orcamentos .quote-info small,
  #orcamentos .quote-section h3{
    max-width:100%!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  /* Tabela do orçamento vira cards no preview mobile. */
  #orcamentos .quote-table,
  #orcamentos .quote-table thead,
  #orcamentos .quote-table tbody,
  #orcamentos .quote-table tr,
  #orcamentos .quote-table th,
  #orcamentos .quote-table td{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  #orcamentos .quote-table{
    border-spacing:0!important;
  }

  #orcamentos .quote-table thead{
    display:none!important;
  }

  #orcamentos .quote-table tr{
    background:#fff!important;
    border:1px solid #e7e7e0!important;
    border-radius:16px!important;
    margin:0 0 10px!important;
    padding:12px!important;
    overflow:hidden!important;
  }

  #orcamentos .quote-table td{
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    padding:4px 0!important;
    text-align:left!important;
    color:#111!important;
    overflow-wrap:break-word!important;
    white-space:normal!important;
  }

  #orcamentos .quote-table td:nth-child(2),
  #orcamentos .quote-table td:nth-child(3){
    display:flex!important;
    justify-content:space-between!important;
    gap:10px!important;
    font-weight:800!important;
  }

  #orcamentos .quote-table td:nth-child(2)::before{
    content:'Qtd.';
    color:#777;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.06em;
  }

  #orcamentos .quote-table td:nth-child(3)::before{
    content:'Valor';
    color:#777;
    font-size:11px;
    font-weight:900;
    text-transform:uppercase;
    letter-spacing:.06em;
  }

  #orcamentos .quote-item-detail{
    display:block!important;
    margin-top:5px!important;
    color:#555!important;
    font-size:12px!important;
    line-height:1.42!important;
  }

  #orcamentos .quote-total{
    display:block!important;
    width:100%!important;
    max-width:100%!important;
  }

  #orcamentos .quote-total-box{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    border-radius:16px!important;
    padding:16px!important;
  }

  #orcamentos .quote-total-box b{
    font-size:clamp(22px,7vw,30px)!important;
    white-space:normal!important;
    overflow-wrap:break-word!important;
  }

  #orcamentos .quote-footer{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:6px!important;
  }

  /* Metas: libera texto que herdava ellipsis global e evita corte lateral. */
  #metas .goal-simple-shell,
  #metas .goal-simple-main,
  #metas .goal-simple-side,
  #metas .goal-status-card,
  #metas .goal-two-col,
  #metas .goal-source-grid,
  #metas .goal-path-grid,
  #metas .goal-actions-list,
  #metas .goal-op-list{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }

  #metas .goal-simple-side,
  #metas .goal-status-card{
    padding:16px!important;
    border-radius:22px!important;
  }

  #metas .goal-status-card h2,
  #metas .goal-status-card p,
  #metas .goal-status-card .meta,
  #metas .goal-action-simple b,
  #metas .goal-action-simple span,
  #metas .goal-op-simple b,
  #metas .goal-op-simple span,
  #metas .goal-path b,
  #metas .goal-path span,
  #metas .goal-source b,
  #metas .goal-source span,
  #metas .goal-reading,
  #metas .goal-history-compact-row,
  #metas .goal-history-compact-row *{
    max-width:100%!important;
    min-width:0!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:break-word!important;
    word-break:normal!important;
  }

  #metas .goal-status-card .meta{
    display:block!important;
    line-height:1.45!important;
  }

  #metas .goal-status-top{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
  }

  #metas .goal-source-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  #metas .goal-path-grid{
    grid-template-columns:1fr!important;
    gap:10px!important;
  }

  #metas .goal-two-col{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }

  #metas .goal-action-simple,
  #metas .goal-op-simple{
    grid-template-columns:1fr!important;
    gap:10px!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  #metas .goal-action-simple .btn,
  #metas .goal-op-simple .btn,
  #metas .goal-op-simple .actions{
    width:100%!important;
    max-width:100%!important;
    justify-content:stretch!important;
  }

  #metas .goal-op-simple .actions{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:8px!important;
  }

  #metas .goal-month-mini{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    width:100%!important;
    max-width:100%!important;
    overflow:hidden!important;
  }

  #metas .goal-month-mini button{
    width:100%!important;
    min-width:0!important;
    justify-content:space-between!important;
    gap:6px!important;
    overflow:hidden!important;
  }

  #metas .goal-month-mini button b,
  #metas .goal-month-mini button span{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
  }
}

@media (max-width:390px){
  #orcamentos .quote-body,
  #orcamentos .quote-cover{
    padding-left:15px!important;
    padding-right:15px!important;
  }

  #metas .goal-month-mini{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}