/* Sidebar: esconder texto do botão configuração quando fechado */
#sidebar:not(.expanded) .sidebar-config-label {
  display: none;
}
#sidebar.expanded .sidebar-config-label {
  display: inline;
}
/* Esconde o texto do botão Sair/Entrar quando a sidebar está colapsada */
.sidebar-collapsible:not(.expanded) .logout-text {
  display: none !important;
}
/* Garantir scroll na sidebar */
#sidebar {
  overflow-x: hidden !important;  /*auto */
  height: 100vh;
  max-height: 100vh;
  scrollbar-width: thin;
  scrollbar-color: #bdbdbd #f5f5f5;
}

#sidebar::-webkit-scrollbar {
  width: 8px;
}
#sidebar::-webkit-scrollbar-thumb {
  background: #bdbdbd;
  border-radius: 4px;
}
#sidebar::-webkit-scrollbar-track {
  background: #f5f5f5;
}
/* estilos removidos pois agora estão em css/pages/dashboard.css */
/*
IMPORTANTE: Mover os estilos específicos de cada página para seus respectivos arquivos em css/pages/NOME.css
E adicionar o link no bloco head do HTML correspondente:
{% block head %}
  <link rel="stylesheet" href="{{ url_for('static', filename='css/pages/NOME.css') }}">
{% endblock %}
*/
/* Sidebar expandida: visual moderno, alinhamento e espaçamento igual ao print */
.sidebar-collapsible.expanded {
  width: 210px !important;
  min-width: 210px !important;
  max-width: 210px !important;
  box-shadow: 2px 0 8px rgba(0,0,0,0.04);
}
.sidebar-collapsible.expanded .sidebar-icons-list .nav-link {
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  padding: 0.7rem 0.8rem;
  gap: 0.6rem;
  font-size: 1.02rem;
}
.sidebar-collapsible.expanded .sidebar-icons-list .nav-link i {
  font-size: 1.5rem;
  margin-bottom: 0;
  margin-right: 0;
}
.sidebar-collapsible.expanded .sidebar-label {
  display: inline !important;
  font-size: 1.08rem;
  font-weight: 500;
  color: #222;
}
.sidebar-collapsible.expanded .bi-chevron-down {
  margin-left: auto;
  font-size: 1.2rem;
  color: #444;
  display: inline !important;
}
.sidebar-collapsible .bi-chevron-down {
  display: none !important;
}
.sidebar-collapsible.expanded .sidebar-header {
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: 1rem 0.8rem 0.8rem 0.8rem !important;
  gap: 0.7rem;
}
.sidebar-collapsible.expanded .sidebar-header img {
  margin-bottom: 0 !important;
  margin-right: 0.5rem;
  display: block !important;
}
.sidebar-collapsible.expanded .sidebar-header span {
  display: inline-block !important;
  font-size: 1.08rem;
  font-weight: 700;
  color: #222;
  margin-left: 0.1rem;
  vertical-align: middle;
}
.sidebar-collapsible.expanded #sidebarToggle {
  margin-right: 0.5rem;
}
.sidebar-collapsible.expanded .sidebar-bottom {
  padding-left: 0.8rem !important;
  padding-right: 0.8rem !important;
}
.sidebar-collapsible.expanded .sidebar-bottom .sidebar-label {
  display: inline !important;
  margin-left: 0.5rem;
}
/* Garante que submenus fiquem ocultos quando sidebar está colapsada */


.sidebar-collapsible:not(.expanded) .collapse {
  display: none;
}

.sidebar-collapsible {
  width: 80px !important;
  transition: width 0.3s;
}
.sidebar-collapsible.expanded {
  width: 260px !important;
}
.sidebar-collapsible .sidebar-header span {
  display: none;
}
.sidebar-collapsible.expanded .sidebar-header span {
  display: inline-block !important;
}
.sidebar-label {
  display: none;
  font-size: 0.95rem;
  margin-top: 0.2rem;
}
.sidebar-collapsible.expanded .sidebar-label {
  display: block !important;
}
.sidebar-icons-list .nav-link {
  justify-content: center;
  align-items: center;
  flex-direction: column;
  padding: 1.2rem 0;
  font-size: 1.1rem;
}
.sidebar-icons-list .nav-link i {
  font-size: 2rem;
  margin-bottom: 0.2rem;
}
.sidebar-bottom .sidebar-label {
  display: none;
}
.sidebar-collapsible.expanded .sidebar-bottom .sidebar-label {
  display: block !important;
}
#sidebarToggle {
  font-size: 1.7rem;
  color: #333;
}
.sidebar-header img {
  width: 40px;
  height: 40px;
}
.sidebar-user-initial {
  width: 40px;
  height: 40px;
  font-size: 1.2rem;
}
.sidebar-user-email {
  font-size: 0.9em;
}
.main-content {
  margin-left: 260px;
  transition: margin-left 0.3s;
}
.sidebar-collapsible:not(.expanded) ~ .main-content {
  margin-left: 80px;
}
/* Sidebar customizada */
#sidebar {
  box-shadow: 2px 0 8px rgba(0,0,0,0.04);
  z-index: 1030;
}
#sidebar .nav-link {
  color: #333;
  border-radius: 6px;
  transition: background 0.2s, color 0.2s;
  font-weight: 500;
}
#sidebar .nav-link.active, #sidebar .nav-link:hover, #sidebar .nav-link:focus {
  background: #f0f4ff;
  color: #2563eb;
}
#sidebar .nav-link i {
  min-width: 24px;
  text-align: center;
}
#sidebar .sidebar-header {
  background: #fff;
}
#sidebar .btn-outline-danger {
  border-radius: 6px;
}
#sidebar .rounded-circle {
  border: 2px solid #2563eb;
}
@media (max-width: 991.98px) {
  #sidebar {
    position: relative;
    width: 100%;
    min-height: auto;
    box-shadow: none;
  }
  .flex-grow-1 {
    margin-left: 0 !important;
  }
}
body {
  background: #f8fafc;
}
html, body {
  overflow-x: hidden;
}
*, *::before, *::after {
  box-sizing: border-box;
}
img, video, svg, canvas {
  max-width: 100%;
  height: auto;
}
.container, .container-fluid, .main-content, .main-content-custom {
  max-width: 100%;
  width: 100%;
}
.d-flex > *, .d-grid > * {
  min-width: 0;
}
/* Fim sidebar customizada */

/* Nome do cliente em fiado vencido */
.fiado-vencido {
  color: #dc3545 !important;
  font-weight: bold;
}
/* Cor azul personalizada para textos principais */
.text-primary-blue {
  color: #1976d2 !important;
}

/* ====== UTILITÁRIOS DE TÍTULO DE SEÇÃO ====== */
.section-title {
  font-size: 1.5rem;
  margin-bottom: 0;
}

/* Exibir formulários de ação inline */
.form-inline-action {
  display: inline;
}
/* Botão com gap entre ícone e texto */
.btn-gap {
  gap: 0.3em !important;
}
/* Botão com texto menor */
.btn-small-text {
  font-size: 0.95em !important;
  padding-top: 0.25em !important;
  padding-bottom: 0.25em !important;
}
/* Display inline para formulários de ação */
.d-inline {
  display: inline !important;
}

/* Chat balões */
.chat-box {
  min-height: 300px;
  max-height: 400px;
  overflow-y: auto;
  background: #f8f9fa;
}
.chat-msg-row {
  display: flex;
  margin-bottom: 0.5rem;
}
.chat-msg-right {
  justify-content: flex-end;
}
.chat-msg-left {
  justify-content: flex-start;
}
.chat-bubble {
  max-width: 70%;
  padding: 0.5rem 0.75rem;
  border-radius: 1rem;
  word-break: break-word;
}
.chat-bubble-right {
  background: #007bff;
  color: #fff;
  text-align: right;
}
.chat-bubble-left {
  background: #e9ecef;
  color: #343a40;
  text-align: left;
}
.chat-remetente {
  font-size: 0.9em;
  font-weight: bold;
  margin-bottom: 0.2em;
}
/* Utilitário para esconder elementos dinamicamente */
.d-none {
  display: none !important;
}
.d-inline {
  display: inline !important;
}
body {
  background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
  font-family: 'Segoe UI', Arial, sans-serif;
  color: #343a40;
}


/* Estilos para o formulário de escolha de entregador */
.entregador-form-row {
  display: flex;
  align-items: end;
  gap: 10px;
}
.entregador-form-col {
  display: flex;
  flex-direction: column;
}
.entregador-label {
  font-size: 20px;
}
.entregador-select {
  width: 400px;
}
.navbar {
  margin-bottom: 2rem;
  background: #007bff;
  color: #fff;
  border-radius: 0 0 10px 10px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}
.navbar a {
  color: #fff !important;
  font-weight: 500;
}
.card {
  background: #fff;
  border-radius: 10px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.07);
  margin-bottom: 2rem;
  padding: 1.5rem;
}
.btn {
  border-radius: 6px;
  padding: 0.5rem 1.2rem;
  font-weight: 500;
  transition: background 0.2s, box-shadow 0.2s;
}
.btn-primary {
  background: #007bff;
  border: none;
  color: #fff;
  box-shadow: 0 2px 6px rgba(0,123,255,0.12);
}
.btn-primary:hover {
  background: #0056b3;
  box-shadow: 0 4px 12px rgba(0,123,255,0.18);
}
.form-control {
  border-radius: 6px;
  border: 1px solid #ced4da;
  padding: 0.5rem;
  transition: border 0.2s;
}
.form-control:focus {
  border-color: #007bff;
  box-shadow: 0 0 0 2px rgba(0,123,255,0.15);
}

.dropdown-item,
.dropdown-menu .dropdown-item,
.dropdown-menu a.dropdown-item {
  color: #000 !important;
  background-color: #fff !important;
}
.dropdown-item:hover, .dropdown-item:focus,
.dropdown-menu .dropdown-item:hover, .dropdown-menu .dropdown-item:focus,
.dropdown-menu a.dropdown-item:hover, .dropdown-menu a.dropdown-item:focus {
  color: #000 !important;
  background-color: #e9ecef !important;
}
.table {
  background: #fff;
  border-radius: 8px;
  box-shadow: 0 1px 6px rgba(0,0,0,0.05);
}
.table th {
  background: rgba(255, 255, 255, 0.586);
  color: #000;
  font-weight: 600;
  letter-spacing: 0.03em;
  font-size: 1.08em;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.alert {
  border-radius: 6px;
  padding: 0.75rem 1.25rem;
  font-size: 1rem;
}
.fade-in {
  animation: fadeIn 0.7s ease;
}
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
.navbar { margin-bottom: 2rem; }
.table-danger { background-color: #f8d7da !important; }

/* Hover especial para botão Sair na navbar */
.navbar .btn-outline-light {
  color: #fff;
  border-color: #fff;
  background: transparent;
  transition: background 0.2s, color 0.2s;
}
.navbar .btn-outline-light:hover, .navbar .btn-outline-light:focus {
  background: #fff;
  color: #007bff;
  border-color: #fff;
}
/* Hover exclusivo para botão Sair */
.btn-sair:hover, .btn-sair:focus {
  background: #fff !important;
  color: #dc3545 !important;
  border-color: #fff !important;
}

@media (max-width: 600px) {
  body {
    font-size: 16px;
    padding: 0;
  }
  .container, .container-fluid {
    padding-left: 12px !important;
    padding-right: 12px !important;
  }
  .row {
    margin-left: 0;
    margin-right: 0;
    flex-direction: column;
  }
  .card {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
  }
  [class^="col-"], [class*=" col-"] {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .card, .container, .container-fluid {
    box-sizing: border-box;
  }
  .d-flex {
    flex-direction: column;
    align-items: stretch;
  }
  .d-grid {
    grid-template-columns: 1fr !important;
  }
  input, select, textarea, button, .btn {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }
  .btn {
    padding-left: 12px;
    padding-right: 12px;
    white-space: normal;
    word-break: break-word;
  }
  .table, .table-responsive {
    display: none !important;
  }
  nav, header, footer {
    flex-direction: column;
    align-items: stretch;
  }
  table {
    font-size: 12px;
    overflow-x: auto;
    display: block;
    overflow: hidden;
    margin-bottom: 1.5rem;
  }

  .table-striped tbody tr:nth-of-type(odd) {
    background-color: #f4f8fb;
  }

  .table-striped tbody tr:hover {
    background-color: #e3f0fc;
    transition: background 0.2s;
  }

  .badge.bg-success {
    background: linear-gradient(90deg, #43e97b 0%, #38f9d7 100%);
    color: #fff;
    font-weight: 600;
    font-size: 1em;
    box-shadow: 0 1px 4px rgba(67,233,123,0.10);
  }
  .badge.bg-warning {
    background: linear-gradient(90deg, #ffe259 0%, #ffa751 100%);
    color: #7a4f01;
    font-weight: 600;
    font-size: 1em;
    box-shadow: 0 1px 4px rgba(255,226,89,0.10);
  }

  .btn-success {
    background: linear-gradient(90deg, #43e97b 0%, #38f9d7 100%);
    border: none;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(67,233,123,0.10);
  }
  .btn-success:hover {
    background: linear-gradient(90deg, #38f9d7 0%, #43e97b 100%);
    color: #fff;
  }

  .btn-danger {
    background: linear-gradient(90deg, #ff5858 0%, #f09819 100%);
    border: none;
    color: #fff;
    font-weight: 600;
    box-shadow: 0 2px 8px rgba(255,88,88,0.10);
  }
  .btn-danger:hover {
    background: linear-gradient(90deg, #f09819 0%, #ff5858 100%);
    color: #fff;
  }

  .btn-outline-light {
    border: 2px solid #fff;
    color: #fff;
    background: transparent;
    font-weight: 600;
    transition: background 0.2s, color 0.2s;
  }
  .btn-outline-light:hover {
    background: #fff;
    color: #007bff;
  }

  .btn-info {
    background: linear-gradient(90deg, #2193b0 0%, #6dd5ed 100%);
    border: none;
    color: #fff;
    font-weight: 600;
  }
  .btn-info:hover {
    background: linear-gradient(90deg, #6dd5ed 0%, #2193b0 100%);
    color: #fff;
  }

  /* Melhorias para responsividade da tabela de entregas */
  @media (max-width: 900px) {
    .table-responsive {
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }
    .table {
      min-width: 800px;
    }
  }

  /* Ajuste para botões de ação em coluna */
  .d-flex.flex-column.gap-1 > * {
    margin-bottom: 0.3em;
  }
  .d-flex.flex-column.gap-1 > *:last-child {
    margin-bottom: 0;
  }
  .btn, input, select {
    width: 100%;
    margin-bottom: 10px;
  }
  .row {
    display: block;
  }
  .col-md-6 {
    width: 100%;
    margin-bottom: 20px;
  }
}

@media (max-width: 600px) {
  #sidebar {
    position: fixed;
    top: 0;
    left: 0;
    height: 100vh;
    width: 260px !important;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    box-shadow: 2px 0 12px rgba(0,0,0,0.2);
    z-index: 1050;
  }
  body.sidebar-open #sidebar {
    transform: translateX(0);
  }
  .main-content {
    margin-left: 0 !important;
  }
  .sidebar-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.35);
    z-index: 1045;
  }
  body.sidebar-open .sidebar-overlay {
    display: block;
  }
}