/*
 * Finnanza 1.24.49 — camada global de responsividade
 * Objetivo: impedir overflow horizontal e harmonizar app, Admin Master,
 * autenticação/recuperação e páginas comerciais entre 320px e desktop amplo.
 * Esta folha deve ser carregada depois dos módulos e antes da tipografia/marca.
 */

:root{
  --responsive-content-gutter:clamp(.75rem,2.4vw,2rem);
  --responsive-card-gap:clamp(.55rem,1.5vw,1rem);
}

html,body{
  max-width:100%;
  overflow-x:hidden;
  overflow-x:clip;
}

img,video,canvas,svg{
  max-width:100%;
}

.app-shell,
.app-main,
.content,
.master-main,
.master-settings-content,
.marketing-page,
.recovery-commercial-main,
.recovery-commercial-hero,
.auth-shell,
.install-shell{
  min-width:0;
  max-width:100%;
}

.content>* ,
.master-main>* ,
.panel>* ,
.form-section>* ,
.page-head>* ,
.form-page-head>* ,
.panel-head>* ,
.actions>* ,
.topbar-actions>* ,
[class*="-grid"]>* ,
[class*="-row"]>* ,
[class*="-head"]>*{
  min-width:0;
}

.table-wrap,
.master-users-table-wrap,
.category-detail-table-wrap,
.business-table-wrap{
  max-width:100%;
  overscroll-behavior-inline:contain;
  -webkit-overflow-scrolling:touch;
}

.data-table,
.master-users-table,
.business-table{
  max-width:100%;
}

/* Mantém a barra lateral e o conteúdo sincronizados no notebook compacto. */
@media(min-width:61.3125rem) and (max-width:68.75rem){
  .sidebar{width:15.5rem!important}
  .app-main{margin-left:15.5rem!important}
  .content{padding-left:1.25rem!important;padding-right:1.25rem!important}
}

/* Tablets largos e navegação off-canvas. */
@media(max-width:61.25rem){
  .app-main{margin-left:0!important;width:100%!important}
  .sidebar{
    width:min(20rem,88vw)!important;
    max-width:88vw!important;
    transform:translateX(-105%)!important;
  }
  .sidebar.is-open{transform:translateX(0)!important}
  .topbar{
    width:100%;
    gap:.75rem;
    padding-left:max(1rem,env(safe-area-inset-left,0px))!important;
    padding-right:max(1rem,env(safe-area-inset-right,0px))!important;
  }
  .topbar-title{min-width:0;flex:1}
  .topbar-actions{flex:0 0 auto;min-width:0}
  .user-trigger{min-width:0}
  .content{
    width:100%!important;
    max-width:none!important;
    padding-left:max(1rem,env(safe-area-inset-left,0px))!important;
    padding-right:max(1rem,env(safe-area-inset-right,0px))!important;
    padding-bottom:calc(6.25rem + env(safe-area-inset-bottom,0px))!important;
  }
  .bottom-nav{
    width:100%!important;
    min-width:0!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
  }
  .bottom-nav>a,.bottom-nav>button{min-width:0!important;max-width:100%!important}
}

/* Faixa principal solicitada: celulares grandes e tablets pequenos (431–767px). */
@media(min-width:26.9375rem) and (max-width:47.9375rem){
  .content{
    padding-top:1.1rem!important;
    padding-left:max(1rem,env(safe-area-inset-left,0px))!important;
    padding-right:max(1rem,env(safe-area-inset-right,0px))!important;
  }

  .page-head,
  .form-page-head,
  .master-page-head,
  .business-page-heading{
    width:100%;
    align-items:stretch!important;
    flex-direction:column!important;
    gap:.75rem!important;
  }

  .page-head>div:first-child,
  .form-page-head>div:first-child,
  .master-page-head>div:first-child,
  .business-page-heading>div:first-child{
    width:100%;
  }

  .page-head>.actions,
  .form-page-head>.actions,
  .master-page-head>.actions{
    width:100%;
  }

  .actions{
    align-items:stretch;
  }

  .actions>.button,
  .actions>form,
  .actions>form>.button{
    min-width:0;
  }

  .dashboard-page-head .dashboard-month-form,
  .smart-month-picker,
  .simulator-month-panel .dashboard-month-form{
    width:100%!important;
    max-width:none!important;
  }

  .dashboard-month-trigger{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }

  .metric-grid,
  .dashboard-financial-kpis,
  .category-detail-kpis,
  .consolidated-kpis,
  .business-kpi-grid,
  .business-summary-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .dashboard-grid,
  .report-grid,
  .smart-grid-two,
  .smart-kpis,
  .smart-cash-grid,
  .first-due-summary,
  .business-dashboard-grid,
  .business-report-grid,
  .business-contact-grid,
  .business-contact-detail-grid,
  .business-two-column,
  .workspace-cards,
  .goal-history-layout,
  .support-ticket-layout{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .account-grid,
  .credit-card-grid,
  .goal-grid,
  .debt-grid,
  .billing-plans-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .form-grid,
  .form-grid-3,
  .master-form-grid,
  .date-grid,
  .business-contact-form .form-grid,
  .business-entry-form .form-grid{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .span-2,
  .master-form-grid .span-2{
    grid-column:auto!important;
  }

  .panel,
  .form-section,
  .metric,
  .entity-card,
  .mobile-card{
    max-width:100%;
  }

  .panel-head{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .panel-head>h2,
  .panel-head>div{
    min-width:0;
  }

  .filters,
  #transaction-filters .transaction-filter-form,
  .master-users-filter{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .filters .filter-search,
  #transaction-filters .transaction-filter-search,
  .master-users-filter .filter-search{
    grid-column:1/-1!important;
  }

  .form-actions,
  .professional-form-actions,
  .business-form-actions{
    width:100%;
    flex-wrap:wrap;
  }

  .form-actions>.button,
  .professional-form-actions>.button{
    flex:1 1 11rem;
  }

  .calendar-grid{
    min-width:0;
  }

  .bar-row{
    grid-template-columns:minmax(5.5rem,.75fr) minmax(0,1.5fr) minmax(5rem,.7fr)!important;
  }
}

/* Tablet/telefone: layout operacional sem overflow. */
@media(max-width:47.9375rem){
  body,
  .app-shell,
  .app-main,
  .content{
    width:100%;
  }

  .content{
    overflow:visible!important;
  }

  .topbar{
    min-height:4.35rem!important;
    height:auto!important;
  }

  /* Em telas compactas o header deve priorizar menu + conta; o título fica no conteúdo. */
  .topbar-title{display:none!important}
  .user-trigger>div{display:none!important}
  .user-trigger{padding:.25rem!important}
  .topbar-actions{margin-left:auto}

  .sidebar{
    padding-left:max(1rem,env(safe-area-inset-left,0px))!important;
    padding-right:1rem!important;
  }

  .sidebar-brand,
  .workspace-switcher,
  .workspace-switcher-menu,
  .sidebar-nav,
  .sidebar-nav a{
    max-width:100%;
    min-width:0;
  }

  .sidebar-nav a>span,
  .workspace-switcher-copy,
  .workspace-switcher-menu button>span:nth-child(2){
    min-width:0;
  }

  .page-head,
  .form-page-head{
    min-width:0;
  }

  .page-head h1,
  .page-head h2,
  .form-page-head h1,
  .form-page-head h2{
    max-width:100%;
  }

  .button,
  .icon-button,
  .quick-add,
  .tm-btn{
    max-width:100%;
  }

  .button>span,
  .button>strong{
    min-width:0;
  }

  /* Dashboard */
  .dashboard-financial-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:.6rem!important;
  }

  .dashboard-financial-kpis .metric{
    min-width:0!important;
  }

  .dashboard-financial-kpis .metric-value{
    max-width:100%;
    overflow-wrap:normal;
  }

  .dashboard-secondary-kpis{
    grid-template-columns:minmax(0,1fr)!important;
    gap:.55rem!important;
  }

  .dashboard-secondary-card{
    min-width:0!important;
    width:100%!important;
  }

  .spending-item-head{
    align-items:flex-start;
    gap:.65rem;
  }

  .spending-item-head>span:first-child{
    min-width:0;
    flex:1;
  }

  .dashboard-category-value{
    flex:0 0 auto;
  }

  /* Movimentações: cabeçalho compacto, meses roláveis e itens sem colisão. */
  .transactions-list-head{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    align-items:center!important;
    gap:.65rem!important;
  }

  .transactions-list-head>div:first-child{
    min-width:0!important;
  }

  .transactions-list-head .transactions-head-actions{
    width:auto!important;
    min-width:0!important;
    display:flex!important;
    flex-wrap:nowrap!important;
    gap:.4rem!important;
  }

  .transactions-filter-button,
  .transactions-export-button,
  .transactions-add-button{
    flex:0 0 2.65rem!important;
    width:2.65rem!important;
    min-width:2.65rem!important;
    height:2.65rem!important;
    padding:0!important;
  }

  .transactions-filter-button>span,
  .transactions-export-button>span,
  .transactions-add-button>span{
    display:none!important;
  }

  .transaction-months,
  .business-status-tabs{
    width:100%;
    max-width:100%;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    overscroll-behavior-inline:contain;
    scroll-snap-type:x proximity;
  }

  .transaction-months>a,
  .business-status-tabs>a{
    flex:0 0 auto;
    scroll-snap-align:start;
  }

  .transaction-day-group,
  .transaction-day-list,
  .transaction-list-item{
    max-width:100%;
  }

  .transaction-list-item{
    grid-template-columns:2.45rem minmax(0,1fr) auto!important;
    gap:.55rem!important;
  }

  .transaction-list-main strong,
  .transaction-list-main small{
    max-width:100%!important;
  }

  .transaction-list-meta{
    min-width:0!important;
    max-width:8.75rem;
  }

  .transaction-list-meta strong,
  .transaction-list-meta small{
    max-width:100%;
  }

  .transaction-detail-summary,
  .transaction-detail-grid{
    max-width:100%;
  }

  /* Tabelas/cards responsivos */
  [data-responsive-table],
  [data-responsive-table] tbody,
  [data-responsive-table] tr,
  [data-responsive-table] td{
    max-width:100%!important;
  }

  [data-responsive-table] tr{
    overflow:hidden;
  }

  [data-responsive-table] td>*{
    min-width:0;
    max-width:100%;
  }

  .table-actions{
    flex-wrap:wrap;
  }

  /* Formulários */
  .field,
  .field input,
  .field select,
  .field textarea,
  .input-prefix,
  .input-suffix,
  .professional-form,
  .master-form{
    min-width:0;
    max-width:100%;
  }

  .input-prefix>span,
  .input-suffix>span{
    flex:0 0 auto;
  }

  .type-selector{
    min-width:0;
  }

  .recurrence-toggle-row,
  .savings-allocation-head,
  .debt-summary,
  .smart-report-head,
  .smart-cash-head{
    min-width:0;
  }

  /* Modais e folhas */
  .modal-backdrop,
  .quick-pay-backdrop,
  .series-edit-backdrop,
  .series-delete-backdrop,
  .savings-allocation-backdrop,
  .dashboard-month-picker-backdrop,
  .support-image-dialog-backdrop{
    max-width:100vw;
  }

  .modal-card,
  .quick-pay-sheet,
  .series-edit-sheet,
  .series-delete-sheet,
  .savings-allocation-sheet,
  .dashboard-month-picker,
  .support-image-dialog{
    max-width:100%!important;
  }

  /* Admin Master */
  .master-topbar{
    position:sticky!important;
    top:0;
    flex-wrap:wrap;
    align-items:center;
    gap:.55rem!important;
    padding:.65rem max(.75rem,env(safe-area-inset-right,0px)) .65rem max(.75rem,env(safe-area-inset-left,0px))!important;
  }

  .master-brand{min-width:0}
  .master-brand>div{min-width:0}
  .master-brand strong,
  .master-brand small{white-space:nowrap}

  .master-user{margin-left:auto;min-width:0}
  .master-user>div{display:none!important}
  .master-user .button{min-width:2.65rem;padding-inline:.7rem}

  .master-topbar-links{
    order:3;
    width:100%;
    display:flex;
    gap:.45rem;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .master-topbar-links::-webkit-scrollbar{display:none}
  .master-topbar-links .button{flex:0 0 auto}

  .master-main{
    width:100%!important;
    padding:1rem max(.75rem,env(safe-area-inset-right,0px)) 2rem max(.75rem,env(safe-area-inset-left,0px))!important;
  }

  .master-head-stats,
  .master-plan-summary,
  .master-test-actions,
  .master-users-filter-actions{
    min-width:0;
    max-width:100%;
  }

  .master-settings-nav{
    max-width:100%;
  }

  .master-settings-content{
    width:100%;
  }

  /* Páginas empresariais */
  .business-toolbar,
  .business-page-heading,
  .business-custom-field-list article{
    min-width:0;
  }

  .business-search-form,
  .business-toolbar-actions{
    width:100%!important;
    min-width:0!important;
  }

  .business-toolbar-actions{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }

  .business-inline-details form{
    right:auto!important;
    left:0!important;
    max-width:min(18rem,calc(100vw - 2rem));
  }

  /* Suporte */
  .support-shell,
  .support-ticket,
  .support-message,
  .support-admin-attachments,
  .support-message-attachments{
    min-width:0;
    max-width:100%;
  }

  .support-message-attachments,
  .support-admin-attachments{
    grid-template-columns:minmax(0,1fr)!important;
  }

  /* Recuperação e site comercial */
  .recovery-commercial-main,
  body.recovery-page .recovery-commercial-hero,
  .tm-hero,
  .tm-section,
  .tm-final,
  .tm-footer-main{
    max-width:100%;
  }

  .recovery-commercial-card,
  .tm-dashboard-card,
  .tm-feature-card,
  .tm-resource-card{
    max-width:100%;
  }
}

/* Celulares estreitos. */
@media(max-width:26.875rem){
  .content{
    padding-left:max(.75rem,env(safe-area-inset-left,0px))!important;
    padding-right:max(.75rem,env(safe-area-inset-right,0px))!important;
  }

  .page-head,
  .form-page-head{
    gap:.6rem!important;
  }

  .actions,
  .page-head>.actions,
  .form-actions,
  .professional-form-actions,
  .business-toolbar-actions,
  .master-users-filter-actions{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%!important;
  }

  .actions>.button,
  .actions>form,
  .actions>form>.button,
  .form-actions>.button,
  .professional-form-actions>.button,
  .business-toolbar-actions .button,
  .master-users-filter-actions .button{
    width:100%!important;
  }

  .dashboard-financial-kpis{
    gap:.5rem!important;
  }

  .dashboard-financial-kpis .metric{
    padding:.7rem!important;
  }

  .dashboard-financial-kpis .metric-topline{
    gap:.3rem!important;
  }

  .dashboard-financial-kpis .metric-status{
    max-width:6rem;
    overflow:hidden;
    text-overflow:ellipsis;
  }

  .dashboard-secondary-card{
    grid-template-columns:2rem minmax(0,1fr) auto!important;
    gap:.45rem!important;
  }

  .secondary-kpi-meta{
    max-width:5.75rem!important;
  }

  .transaction-list-item{
    grid-template-columns:2.25rem minmax(0,1fr) auto!important;
    padding-left:.65rem!important;
    padding-right:.65rem!important;
  }

  .transaction-type-icon{
    width:2.25rem!important;
    height:2.25rem!important;
  }

  .transaction-list-meta{
    max-width:6.9rem;
  }

  .type-selector{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .type-option>span{
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    justify-items:start!important;
    text-align:left!important;
    padding:.65rem .75rem!important;
  }

  .type-option .icon{grid-row:1/3!important}

  .metric-grid:not(.dashboard-financial-kpis),
  .category-detail-kpis,
  .consolidated-kpis,
  .business-kpi-grid,
  .business-summary-strip,
  .account-grid,
  .credit-card-grid,
  .goal-grid,
  .debt-grid,
  .billing-plans-grid,
  .business-contact-summary,
  .business-monthly-report{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .filters,
  #transaction-filters .transaction-filter-form,
  .master-users-filter{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .filters .filter-search,
  #transaction-filters .transaction-filter-search,
  .master-users-filter .filter-search{
    grid-column:auto!important;
  }

  .bottom-nav>a,.bottom-nav>button{
    padding-inline:.05rem!important;
  }

  .bottom-nav .bottom-add{
    width:2.8rem!important;
    min-width:2.8rem!important;
    height:2.8rem!important;
    min-height:2.8rem!important;
  }

  [data-responsive-table] td{
    grid-template-columns:minmax(0,1fr)!important;
    gap:.2rem!important;
  }

  .master-head-stats,
  .master-plan-summary{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    width:100%;
  }
}

/* Telas muito estreitas: preserva o dashboard em duas colunas, mas evita qualquer corte. */
@media(max-width:22.5rem){
  .dashboard-financial-kpis .metric{
    padding:.6rem!important;
  }

  .dashboard-financial-kpis .metric-icon-soft{
    width:1.8rem!important;
    height:1.8rem!important;
  }

  .transactions-list-head{
    grid-template-columns:minmax(0,1fr)!important;
  }

  .transactions-list-head .transactions-head-actions{
    justify-content:flex-start!important;
  }

  .transaction-list-meta{
    max-width:5.8rem;
  }
}

/* Desktop amplo: aproveita melhor a área sem esticar conteúdo indefinidamente. */
@media(min-width:100rem){
  .content{max-width:110rem!important}
  .master-main{max-width:104rem!important}
}


/* Em tablets com largura útil maior, mantém o cabeçalho do Dashboard e os dois cards secundários lado a lado. */
@media(min-width:35rem) and (max-width:47.9375rem){
  .dashboard-page-head{
    flex-direction:row!important;
    align-items:center!important;
  }
  .dashboard-page-head>div:first-child{
    flex:1 1 auto;
    width:auto!important;
  }
  .dashboard-page-head .dashboard-month-form{
    flex:0 1 18rem;
    width:min(18rem,46%)!important;
  }
  .dashboard-secondary-kpis{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}


/* Finnanza 1.24.58 — Dashboard mobile: período sem título redundante. */
@media(max-width:47.9375rem){
  .dashboard-page-head .dashboard-page-head-copy{
    display:none!important;
  }
  .dashboard-page-head{
    display:block!important;
    min-height:0!important;
    margin-bottom:12px!important;
  }
  .dashboard-page-head .dashboard-month-form{
    width:100%!important;
    max-width:none!important;
    flex:1 1 100%!important;
  }
}


/* Finnanza 1.24.63 — ordem dos cards secundários no mobile. */
@media(max-width:47.9375rem){
  .dashboard-secondary-kpis .dashboard-secondary-card.projected{order:1}
  .dashboard-secondary-kpis .dashboard-secondary-card.savings{order:2}
}
