/* DINÁ - Tema Moderno (carregar após app.css) */
:root{
  --m-bg:#f6f8fc;
  --m-card:#ffffff;
  --m-border:rgba(15,23,42,.08);
  --m-shadow:0 10px 30px rgba(2,6,23,.12);
  --m-shadow-sm:0 6px 18px rgba(2,6,23,.10);
  --m-primary:#3b82f6;
  --m-primary2:#2563eb;
  --m-success:#22c55e;
  --m-danger:#ef4444;
  --m-warning:#f59e0b;
  --m-radius:16px;
  --m-radius-sm:12px;
}

body{ background:var(--m-bg); }

.admin-content{ min-width:0; overflow-x:hidden; }

/* ===== Admin: layout com scroll apenas no conteudo (desktop + mobile) ===== */
body.has-admin{ overflow: hidden; }
.admin-layout{
  display: flex;
  min-height: 100vh;
  height: 100vh;
  overflow: hidden; /* impede scroll do body; scroll fica no main */
}
.admin-content{
  flex: 1 1 auto;
  min-width: 0;
  height: 100vh;
  overflow-y: auto;
  overflow-x: hidden;
  background: var(--m-bg);
}

/* Botao hamburguer (mobile) */
.sidebar-toggle{
  border-radius: 12px !important;
  box-shadow: none !important;
}

/* Sidebar premium */
.admin-sidebar{
  background:
    radial-gradient(1200px 600px at 10% 0%, rgba(59,130,246,.20), transparent 55%),
    radial-gradient(800px 500px at 85% 12%, rgba(245,158,11,.18), transparent 55%),
    linear-gradient(180deg, #0b1220 0%, #0a1020 100%);
  color: rgba(255,255,255,.92);
  box-shadow: 0 0 0 1px rgba(255,255,255,.05) inset;
  border-right: 1px solid rgba(255,255,255,.06);
  width: 280px;
  flex: 0 0 280px;
  min-width: 280px;
  max-width: 280px;
}

.admin-sidebar .brand{ padding: 18px 16px; }
.admin-sidebar .brand .text-dark{ color:#fff !important; }
.admin-sidebar .brand .text-muted{ color: rgba(255,255,255,.65) !important; }
.admin-sidebar .border-secondary-subtle{ border-color: rgba(255,255,255,.12) !important; }

.admin-sidebar .nav{ padding: 8px; }
.admin-sidebar .nav-link{
  border-radius: 14px;
  padding: 11px 12px;
  margin: 2px 0;
  color: rgba(255,255,255,.86);
  transition: .18s ease;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.admin-sidebar .nav-link i{ opacity:.95; }
.admin-sidebar .nav-link:hover{
  background: rgba(255,255,255,.08);
  color: #fff;
  transform: translateY(-1px);
}
.admin-sidebar .nav-link.active{
  background: linear-gradient(90deg, rgba(245,158,11,.22), rgba(245,158,11,.10));
  box-shadow: inset 0 0 0 1px rgba(245,158,11,.25);
  color: #fff;
}

.admin-sidebar-footer .text-muted{ color: rgba(255,255,255,.65) !important; }
.admin-sidebar-footer .text-dark{ color:#fff !important; }

/* Cards e modais */
.card{ border: 1px solid var(--m-border); border-radius: var(--m-radius); box-shadow: var(--m-shadow-sm); }
.modal-content{ border-radius: var(--m-radius); border: 1px solid var(--m-border); box-shadow: var(--m-shadow); }

/* Tabelas */
.table thead th{ font-size: 12px; text-transform: uppercase; letter-spacing: .08em; color: rgba(15,23,42,.65); }
.table tbody tr:hover > *{ background: rgba(59,130,246,.04); }

/* Inputs */
.form-control, .form-select, textarea{
  border-radius: var(--m-radius-sm) !important;
  border: 1px solid rgba(15,23,42,.12) !important;
  padding: 10px 12px !important;
  transition: .15s ease;
}
.form-control:focus, .form-select:focus, textarea:focus{
  border-color: rgba(59,130,246,.55) !important;
  box-shadow: 0 0 0 4px rgba(59,130,246,.15) !important;
}

/* Botões modernos (global) */
.btn, button, input[type="submit"], input[type="button"]{
  border-radius: var(--m-radius-sm) !important;
  font-weight: 700 !important;
  letter-spacing: .2px;
  padding: 10px 14px;
  transition: .16s ease;
  box-shadow: 0 8px 18px rgba(2,6,23,.08);
}
.btn:hover, button:hover{ transform: translateY(-1px); }

.btn-primary{
  background: linear-gradient(180deg, var(--m-primary) 0%, var(--m-primary2) 100%) !important;
  border-color: rgba(37,99,235,.25) !important;
}
.btn-success{ background: linear-gradient(180deg, #22c55e, #16a34a) !important; border-color: rgba(34,197,94,.30) !important; }
.btn-danger{ background: linear-gradient(180deg, #ef4444, #dc2626) !important; border-color: rgba(239,68,68,.30) !important; }
.btn-warning{ background: linear-gradient(180deg, #f59e0b, #d97706) !important; border-color: rgba(245,158,11,.30) !important; }

.btn-outline-primary{
  border-radius: var(--m-radius-sm) !important;
}

/* Botao icone (olho/lixeira) */
.btn-icon{
  width: 40px;
  height: 40px;
  padding: 0 !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 12px !important;
  box-shadow: none !important;
}

/* ===== Sidebar: menu sempre para baixo (sem quebrar para direita) + scroll invisível ===== */
.admin-sidebar{ 
  position: sticky;
  top: 0;
  height: 100vh;
  display: flex;
  flex-direction: column;
}

/* o menu (nav) é a área rolável; header e footer ficam fixos */
.admin-sidebar .nav{
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  min-height: 0; /* importante em flex para o overflow funcionar */
  scrollbar-width: none;        /* Firefox */
  -ms-overflow-style: none;     /* IE/Edge antigo */
}
.admin-sidebar .nav::-webkit-scrollbar{ width: 0; height: 0; }

/* Não cortar texto (sem ellipsis); quebra linha se precisar */
.admin-sidebar .nav-link{
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: unset !important;
  line-height: 1.25;
}

/* Bootstrap nav por padrão pode quebrar em outra coluna; força coluna única */
.admin-sidebar .nav{
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
}

/* mantém rodapé sempre no final da sidebar */
.admin-sidebar-footer{ margin-top: auto; }

/* ===== Admin (mobile): sidebar off-canvas ===== */
@media (max-width: 991.98px){
  .admin-sidebar{
    position: fixed;
    left: 0;
    top: 0;
    height: 100vh;
    transform: translateX(-105%);
    transition: transform .22s ease;
    z-index: 1050;
  }
  .admin-layout.sidebar-open .admin-sidebar{ transform: translateX(0); }
  .admin-layout.sidebar-open::before{
    content: '';
    position: fixed;
    inset: 0;
    background: rgba(2,6,23,.45);
    z-index: 1040;
  }
  .admin-topbar{ position: sticky; top: 0; z-index: 1030; }

  /* Botão flutuante caso a página não tenha topbar */
  .sidebar-fab{
    position: fixed;
    left: 12px;
    top: 12px;
    z-index: 1060;
    width: 42px;
    height: 42px;
    border-radius: 14px;
    border: 1px solid rgba(15,23,42,.14);
    background: rgba(255,255,255,.94);
    backdrop-filter: blur(8px);
    box-shadow: 0 10px 22px rgba(2,6,23,.18);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }
}

@media (max-width: 575.98px){
  .admin-topbar{ padding-left: 14px !important; padding-right: 14px !important; }
  .card{ border-radius: 14px; }
}

/* ===== PDV (mobile): empilha produtos + carrinho ===== */
@media (max-width: 991.98px){
  .pos-main{ flex-direction: column; }
  .pos-cart{
    width: 100% !important;
    border-left: 0 !important;
    border-top: 1px solid rgba(15,23,42,.08);
    max-height: 45vh;
  }
  .pos-products{ max-height: 55vh; }
  .pos-topbar .brand-logo{ width: 40px; height: 40px; }
  .pos-search .input-group{ width: 100%; }
}

/* ===== Login (mobile): card mais fluido ===== */
.auth-card{ width: 100%; max-width: 520px; }
