html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}



/* ==================================
   CUSTOM STYLES - SOBREPÕE BOOTSTRAP
   ================================== */

/* Reduzir fonte globalmente - AJUSTADO */
html, body {
    font-size: 13px !important; /* Era 12px, agora 13px */
}

/* Tabelas */
.table {
    font-size: 12px !important; /* Era 11px, agora 12px */
}

.table thead th {
    font-size: 11px !important; /* Era 10px, agora 11px */
    padding: 8px 6px !important;
    font-weight: 600 !important;
    background: #f8f9fa !important;
}

.table tbody td {
    padding: 7px !important; /* Era 6px, agora 7px */
    font-size: 12px !important; /* Era 11px, agora 12px */
}

.table tbody tr:hover {
    background-color: #f8f9fa !important;
}

/* Botões */
.btn {
    font-size: 12px !important; /* Era 11px, agora 12px */
    padding: 6px 12px !important; /* Era 5px 10px */
}

.btn-sm {
    font-size: 11px !important; /* Era 10px, agora 11px */
    padding: 4px 10px !important; /* Era 3px 8px */
}

/* Forms */
.form-control, .form-select {
    font-size: 13px !important; /* Era 12px, agora 13px */
    padding: 7px 12px !important; /* Era 6px 10px */
    height: auto !important;
}

.form-label {
    font-size: 13px !important; /* Era 12px, agora 13px */
    margin-bottom: 5px !important; /* Era 4px */
}

/* Títulos */
h1 { font-size: 26px !important; } /* Era 24px */
h2 { font-size: 22px !important; } /* Era 20px */
h3 { font-size: 19px !important; } /* Era 18px */
h4 { font-size: 17px !important; } /* Era 16px */
h5 { font-size: 15px !important; } /* Era 14px */

/* Cards */
.card {
    font-size: 13px !important; /* Era 12px */
}

.card-header {
    font-size: 13px !important; /* Era 12px */
    padding: 12px 16px !important; /* Era 10px 15px */
}

/* Modais */
.modal-title {
    font-size: 17px !important; /* Era 16px */
}

.modal-body {
    font-size: 13px !important; /* Era 12px */
}

/* Paginação */
.pagination {
    font-size: 13px !important; /* Era 12px */
}

.page-link {
    padding: 7px 12px !important; /* Era 6px 10px */
    font-size: 13px !important; /* Era 12px */
}

/* Alertas */
.alert {
    font-size: 13px !important; /* Era 12px */
    padding: 12px 16px !important; /* Era 10px 15px */
}

/* Badges */
.badge {
    font-size: 11px !important; /* Era 10px */
}

/* Dropdowns */
.dropdown-menu {
    font-size: 13px !important; /* Era 12px */
}

.dropdown-item {
    font-size: 13px !important; /* Era 12px */
    padding: 7px 16px !important; /* Era 6px 15px */
}

/* Navbar */
.navbar {
    font-size: 13px !important; /* Era 12px */
}

.nav-link {
    font-size: 13px !important; /* Era 12px */
}

/* Text muted e small */
.text-muted, small, .small {
    font-size: 12px !important;
}

/* ==================================
   ESTILOS ESPECÍFICOS INDEX
   ================================== */

/* Fundo gradiente */
body {
    background: #f3f4f5 !important;
    min-height: 100vh;
}

/* Container branco */
.main-content {
    background: white !important;
    border-radius: 12px !important;
    padding: 20px !important;
    box-shadow: 0 10px 40px rgba(0,0,0,0.1) !important;
    margin: 20px auto !important;
}

/* Cards totalizadores */
.stat-card {
    background: white !important;
    border-radius: 10px !important;
    padding: 20px !important;
    box-shadow: 0 4px 15px rgba(0,0,0,0.08) !important;
    transition: all 0.3s ease !important;
    border-left: 4px solid #007bff !important;
}

.stat-card:hover {
    transform: translateY(-5px) !important;
    box-shadow: 0 8px 25px rgba(0,0,0,0.15) !important;
}

.stat-card.shipped {
    border-left-color: #ff8800 !important;
}

.stat-card.completed {
    border-left-color: #28a745 !important;
}

.stat-number {
    font-size: 32px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

.stat-label {
    font-size: 11px !important;
    color: #6c757d !important;
    margin-top: 8px !important;
}

/* Filtros */
.filters-section {
    background: #f8f9fa !important;
    border-radius: 8px !important;
    padding: 12px !important;
    margin-bottom: 15px !important;
}

/* Título */
.page-title {
    color: #2d3748 !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    margin-bottom: 15px !important;
}

/* ==================================
   BOTÕES OUTLINE (SÓ BORDA)
   ================================== */

/* Botões primários - azul */
.btn-primary {
    background-color: transparent !important;
    border: 1.5px solid #007bff !important;
    color: #007bff !important;
}

.btn-primary:hover {
    background-color: #007bff !important;
    color: white !important;
}

/* Botões success - verde */
.btn-success {
    background-color: transparent !important;
    border: 1.5px solid #28a745 !important;
    color: #28a745 !important;
}

.btn-success:hover {
    background-color: #28a745 !important;
    color: white !important;
}

/* Botões danger - vermelho */
.btn-danger {
    background-color: transparent !important;
    border: 1.5px solid #dc3545 !important;
    color: #dc3545 !important;
}

.btn-danger:hover {
    background-color: #dc3545 !important;
    color: white !important;
}

/* Botões warning - laranja/amarelo */
.btn-warning {
    background-color: transparent !important;
    border: 1.5px solid #ffc107 !important;
    color: #856404 !important;
}

.btn-warning:hover {
    background-color: #ffc107 !important;
    color: #856404 !important;
}

/* Botões info - ciano */
.btn-info {
    background-color: transparent !important;
    border: 1.5px solid #17a2b8 !important;
    color: #17a2b8 !important;
}

.btn-info:hover {
    background-color: #17a2b8 !important;
    color: white !important;
}

/* Botões secondary - cinzento */
.btn-secondary {
    background-color: transparent !important;
    border: 1.5px solid #6c757d !important;
    color: #6c757d !important;
}

.btn-secondary:hover {
    background-color: #6c757d !important;
    color: white !important;
}

/* Remover sombras nos botões */
.btn:focus, .btn:active {
    box-shadow: none !important;
}

/* Transição suave */
.btn {
    transition: all 0.2s ease !important;
}