/* Layout: sidebar fixa no desktop, offcanvas no mobile */
:root { --sidebar-w: 240px; --topbar-h: 56px; }

.app-body { background: var(--bs-body-bg); }
.app-shell { display: flex; min-height: 100vh; }

.app-sidebar {
  width: var(--sidebar-w); flex: 0 0 var(--sidebar-w);
  position: sticky; top: 0; height: 100vh;
  background: var(--bs-tertiary-bg); border-right: 1px solid var(--bs-border-color);
}
.app-offcanvas { width: var(--sidebar-w); background: var(--bs-tertiary-bg); }
.sidebar-brand { border-bottom: 1px solid var(--bs-border-color); }
.app-sidebar .nav-link, .app-offcanvas .nav-link { color: var(--bs-body-color); border-radius: .5rem; }
.app-sidebar .nav-link.active, .app-offcanvas .nav-link.active { background: var(--bs-primary); color: #fff; }

.app-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }
.app-topbar {
  height: var(--topbar-h); position: sticky; top: 0; z-index: 1020;
  background: var(--bs-body-bg); border-bottom: 1px solid var(--bs-border-color);
}
.app-content { flex: 1 1 auto; }

/* Autenticacao */
.auth-wrap { background: var(--bs-tertiary-bg); }
.auth-card { max-width: 440px; border: 0; }

/* Touch */
.btn-touch { min-height: 44px; }
@media (min-width: 992px) { .btn-touch { min-height: 38px; } .btn-sm.btn-touch { min-height: 32px; } }

.flash-stack .alert { margin-bottom: .5rem; }
.settings-nav .nav-link { white-space: nowrap; }

/* Tabelas viram cards no mobile */
@media (max-width: 767.98px) {
  .table-responsive-cards table, .table-responsive-cards tbody, .table-responsive-cards tr, .table-responsive-cards td { display: block; width: 100%; }
  .table-responsive-cards thead { display: none; }
  .table-responsive-cards tr { border: 1px solid var(--bs-border-color); border-radius: .5rem; margin-bottom: .75rem; padding: .5rem .75rem; background: var(--bs-body-bg); }
  .table-responsive-cards td { border: 0; padding: .35rem 0; display: flex; justify-content: space-between; gap: 1rem; text-align: right !important; }
  .table-responsive-cards td::before { content: attr(data-label); font-weight: 600; color: var(--bs-secondary-color); text-align: left; }
  .table-responsive-cards td[colspan] { display: block; text-align: center !important; }
  .table-responsive-cards td[colspan]::before { content: none; }
}
@media (min-width: 768px) { .table-responsive-cards { overflow-x: auto; } }

@media print { .app-sidebar, .app-topbar, .btn, .alert { display: none !important; } }