body {
    background: #f4f6f9;
}

.sidebar {
    width: 230px;
    min-height: 100vh;

    /* FIX: não deixar o flex encolher a sidebar */
    flex: 0 0 230px;
    flex-shrink: 0;
}

.menu-link {
    display: block;
    padding: 10px;
    color: white;
    text-decoration: none;
    margin-bottom: 5px;
}

.menu-link:hover {
    background: #495057;
}

.content {
    background: #ffffff;
    flex: 1 1 auto;
    min-width: 0; /* evita overflow quebrando o layout */
}


.dark-mode {
    background: #1e1e1e !important;
    color: #ffffff !important;
}

.dark-mode .content {
    background: #2c2c2c !important;
}


/* ===== Documentos - Ultra Compact Table ===== */
.docs-table th, .docs-table td{
  vertical-align: middle !important;
  padding: 6px 10px !important;
}
.docs-table td{ line-height: 1.15; }

/* Ações: 2 linhas no máximo (compacto) */
.docs-actions-grid{
  display: grid;
  grid-template-columns: 140px 220px 1fr auto;
  gap: 6px 8px;
  align-items: center;
}

/* Em telas menores, quebra elegante */
@media (max-width: 1200px){
  .docs-actions-grid{ grid-template-columns: 140px 1fr auto; }
}
@media (max-width: 768px){
  .docs-actions-grid{ grid-template-columns: 1fr; }
}

/* Inputs pequenos */
.docs-table .form-control-sm{
  height: 30px;
  font-size: 13px;
  padding: 4px 8px;
}
.docs-table .docs-file{
  height: 30px;
  padding: 2px 6px;
  font-size: 12px;
}

/* Remove margens internas que aumentam linha */
.docs-actions-grid .mb-2,
.docs-actions-grid .mt-2,
.docs-actions-grid p,
.docs-actions-grid small{
  margin: 0 !important;
}

/* Botões compactos */
.docs-table .btn-sm{ padding: 4px 10px; font-size: 12px; height: 30px; }



/* ===== Documentos - Ações em 2 linhas (fix) ===== */
#documentos-table td, #documentos-table th{
  padding: 6px 10px !important;
  vertical-align: middle !important;
}
#documentos-table td{ line-height: 1.15 !important; }

/* Compactar inputs e botões */
#documentos-table .form-control,
#documentos-table .form-control-sm{
  height: 30px !important;
  padding: 4px 8px !important;
  font-size: 13px !important;
}
#documentos-table input[type="file"]{
  height: 30px !important;
  padding: 2px 6px !important;
  font-size: 12px !important;
}
#documentos-table .btn, #documentos-table .btn-sm{
  height: 30px !important;
  padding: 4px 10px !important;
  font-size: 12px !important;
}

/* Layout 2 linhas: (linha1) data+obs | (linha2) arquivo+enviar+ações
   Fix: quando já existe arquivo anexado, aparece também o dropdown "Ações".
   Em telas médias/grandes, isso podia "espremer" o botão Substituir.
   Solução: permitir quebra controlada na 2ª linha e remover min-width rígido. */
.docs-actions-2row{ display:flex; flex-direction:column; gap:6px; width: 100%; }
.docs-row1{ display:flex; gap:8px; align-items:center; flex-wrap:nowrap; }
.docs-row2{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.docs-row1 .docs-custom{ width: 220px; }
.docs-row1 .docs-date{ width: 150px; }
.docs-row1 .docs-obs{ width: 240px; }
.docs-row2 .docs-file{ flex: 1 1 220px; min-width: 200px; max-width: 460px; }
.docs-row2 .btn{ white-space: nowrap; }

/* Responsivo */
@media (max-width: 1200px){
  .docs-row1, .docs-row2{ flex-wrap: wrap; }
  .docs-actions-2row{ min-width: auto; }
  .docs-row1 .docs-obs{ flex:1 1 240px; width:auto; }
  .docs-row2 .docs-file{ flex:1 1 280px; max-width:none; }
}