/* ===== Base ===== */
body { font-size: 0.9rem; }
#sidebar .nav-link.active { background-color: rgba(255,255,255,0.1); }

/* ===== Acabamentos ===== */
.finishes-grid-header,
.finishes-grid-row { background-color: #f8f9fa; }

.finishes-grid-row:nth-child(even) { background-color: #f1f3f5; }

.finishes-block { border-left: 2px solid #dee2e6; }

/* ===== Modo compacto ===== */
#items-table-wrapper.compact-mode table.table-sm td,
#items-table-wrapper.compact-mode table.table-sm th {
  padding-top: .15rem;
  padding-bottom: .15rem;
  font-size: 0.75rem; /* ~11px */
}

#items-table-wrapper.compact-mode .finishes-grid-header,
#items-table-wrapper.compact-mode .finishes-grid-row {
  font-size: 0.75rem !important;
}

/* ===== Estado da linha (badge + texto) ===== */
.line-status { font-size: 0.8rem; }

.line-status-badge{
  border: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding-inline: 0.6rem;
  padding-block: 0.15rem;
}

.icon-status { width: 14px; height: 14px; }

.line-status-badge-none   { background: #e9ecef; color: #495057; }
.line-status-badge-partial{ background: #fff3cd; color: #856404; }
.line-status-badge-full   { background: #d1e7dd; color: #0f5132; }

tr.item-row.line-status-row-partial td { background-color: #fffdf5; }
tr.item-row.line-status-row-full td    { background-color: #f5fbf7; }

/* Métricas (Qtd/m²) mais compactas e permitem quebrar linha */
.line-metrics{
  white-space: normal;
  font-size: .75rem;
  line-height: 1.15;
}

/* ===== Entregas (accordion) ===== */
.delivery-toggle-icon{
  display: inline-block;
  width: 1rem;
  text-align: center;
  font-size: 0.85rem;
}
.delivery-header-row td{ padding-top: 4px; padding-bottom: 4px; }

.card-toggle .chevron{ transition: transform 0.15s ease-in-out; }
.card-toggle[aria-expanded="true"] .chevron{ transform: rotate(90deg); }

/* ===== Botões compactos ===== */
.btn-xs { padding: 0 4px !important; font-size: 10px !important; }

.compact-add-btn{
  padding: 1px 6px !important;
  font-size: 11px !important;
  line-height: 1.2 !important;
  height: 22px !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

/* ===== Choices.js (unificado, sem duplicados) ===== */
.choices { margin-bottom: 0 !important; }
td .choices { margin-bottom: 0; }

.choices__inner{
  padding: 2px 6px !important;
  min-height: calc(1.5em + .5rem + 2px) !important;
  font-size: .875rem;
  border-radius: .2rem;
  border-color: #ced4da;
}

.choices[data-type*="select-one"]::after{
  border-color: #6c757d transparent transparent;
}

.choices__list--single{ padding: 0 !important; }
.choices__placeholder{ opacity: .6; }

.choices{
  margin-bottom: 0 !important;
  z-index: 2000;
  overflow: visible !important;   /* garante que o dropdown não é cortado */
}




.choices__list--dropdown .choices__input{
  font-size: 0.875rem;
  padding: 0.25rem 0.5rem;
}




/* =========================
   TABELA LINHAS PEDRA + CHOICES (ÚNICO)
   ========================= */

/* OUTER: scroll só horizontal (NÃO criar scroll vertical!) */
#items-table-scroll{
  overflow-x: auto;
  overflow-y: hidden;
}
#items-table-wrapper{
  overflow: visible !important;
}


/* tabela */
#items-table{
  width: 100%;
  min-width: 1180px;
}

/* Choices dentro da tabela */
#items-table td .choices{
  position: relative;
  z-index: 6000;
  overflow: visible !important;
}

/* dropdown: “flutua” e tem scroll interno */
#items-table td .choices__list--dropdown{
  z-index: 7000 !important;
  max-height: calc(100vh - 220px);
  overflow-y: auto !important;
  overflow-x: hidden !important;
  -webkit-overflow-scrolling: touch;
}

/* itens a 2 linhas */
#items-table td .choices__list--dropdown .choices__item--choice{
  white-space: normal !important;
  line-height: 1.15;
  padding-top: .35rem;
  padding-bottom: .35rem;
}

#items-table td .choices__list--dropdown{
  position: absolute !important;
}









/* em larguras menores, mete métricas em 2 linhas sem empurrar tudo */
@media (max-width: 1400px){
  #items-table td:nth-child(2) .line-status{
    flex-wrap:wrap;
    justify-content:flex-start !important;
  }
  #items-table td:nth-child(2) .line-metrics{
    flex: 0 0 100%;
    margin-left:0 !important;
    white-space:normal;
    line-height:1.15;
    font-size:.75rem;
  }
}


/* IMPORTANTÍSSIMO: impedir overflow horizontal global */
html, body { overflow-x: hidden; }

/* =========================
   LAYOUT + SIDEBAR (ÚNICO)
   ========================= */
.layout{
  display:flex;
  min-height:100vh;
}

/* isto é CRUCIAL para não “empurrar” e criar overflow */
.main{
  min-width:0;
  flex:1 1 auto;
}

/* Sidebar desktop */
#sidebar{
  width:220px;
  min-width:220px;
  flex:0 0 220px;
}

/* Overlay (mobile) */
.sidebar-overlay{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.35);
  z-index:1040;
}

/* Botão SEMPRE visível (como queres) */
.sidebar-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Desktop: estado colapsado (fica estreita) */
body.sidebar-collapsed #sidebar{
  width:64px;
  min-width:64px;
  flex-basis:64px;
  padding: .75rem;
}

/* esconde textos (fica estilo “icons only” — mesmo sem icons, reduz o texto) */
body.sidebar-collapsed #sidebar .text-secondary,
body.sidebar-collapsed #sidebar .nav-link{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:clip;
}

/* Mobile: sidebar vira offcanvas */
@media (max-width: 992px){
  #sidebar{
    position:fixed;
    top:0;
    left:0;
    height:100vh;
    width:260px;
    min-width:260px;
    transform:translateX(-100%);
    transition:transform .2s ease-in-out;
    z-index:1050;
    box-shadow:0 .5rem 1rem rgba(0,0,0,.35);
  }

  body.sidebar-open #sidebar{
    transform:translateX(0);
  }

  body.sidebar-open .sidebar-overlay{
    display:block;
  }

  /* em mobile, não usamos “collapsed”: sempre largura normal */
  body.sidebar-collapsed #sidebar{
    width:260px;
    min-width:260px;
  }
}

/* evita scroll horizontal do BODY */
html, body{
  overflow-x:hidden;
}

/* Choices dropdown “portal” para o body */
.choices-portal {
  position: fixed !important;
  z-index: 99999 !important;
  max-height: calc(100vh - 160px) !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}


