.signin-container {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: 1200px;
    margin: 0 auto;
    height: 100vh;
    padding: 20px;
}

.signin-image {
    flex: 1;
    padding: 20px;
}

.signin-image img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

.form-signin {
    flex: 1;
    padding: 20px;
    max-width: 450px;
}

/* Estilos personalizados para el formulario de login */
.form-signin .card {
    background-color: #ffffff;
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(195, 206, 209, 0.2);
}

.form-signin .form-control {
    border: 1px solid #ad795d;
    background-color: #ffffff;
    padding: 10px;
    margin-bottom: 15px;
}

.form-signin .form-control:focus {
    border-color: #c3ced1;
    box-shadow: 0 0 0 0.2rem rgba(195, 206, 209, 0.25);
}

.form-signin .btn-primary {
    background-color: #f3bb74 !important;
    border-color: #f3bb74 !important;
    color: #000000 !important;
    padding: 12px;
    font-weight: 500;
}

.form-signin .btn-primary:hover {
    background-color: #e5a963 !important;
    border-color: #e5a963 !important;
}

.form-signin a {
    color: #c3ced1;
    text-decoration: none;
}

.form-signin a:hover {
    color: #f3bb74;
    text-decoration: underline;
}

.signin-page {
    background-color: rgba(195, 206, 209, 0.1);
    min-height: 100vh;
}

/* Estilos del Dashboard */
.sidebar-menu li.active > a {
    color: #ffffff !important;
    background-color: #ad795d !important;
}

.sidebar-menu li a:hover {
    color: #ffffff !important;
    background-color: rgba(173, 121, 93, 0.9) !important;
}

/* Botones del Dashboard */
.btn-primary {
    background-color: #ad795d !important;
    border-color: #ad795d !important;
}

.btn-warning, .alert-warning {
    background-color: #f3bb74 !important;
    border-color: #f3bb74 !important;
}

.btn-info, 
.btn-info.text-white {
    background-color: #ad795d !important;
    border-color: #ad795d !important;
    color: #ffffff !important;
}

.btn-info:hover, 
.btn-info:focus,
.btn-info:active {
    background-color: rgba(173, 121, 93, 0.9) !important;
    border-color: rgba(173, 121, 93, 0.9) !important;
    color: #ffffff !important;
}

/* Barras de progreso */
.progress-bar {
    background-color: #c3ced1;
}

.progress-bar.complete {
    background-color: #f3bb74;
}

/* Texto destacado */
.text-primary {
    color: #ad795d !important;
}

/* Gráficas */
.chart-color-1 { background-color: #ad795d; }
.chart-color-2 { background-color: #c3ced1; }
.chart-color-3 { background-color: #f3bb74; }

/* Alertas y notificaciones */
.alert-info {
    background-color: #f3bb74;
    border-color: #f3bb74;
    color: #000000;
}

/* Estilos de Facturas */
.invoice-header {
    background-color: #ad795d;
    color: #ffffff;
    padding: 15px 20px;
    border-radius: 4px;
    margin-bottom: 20px;
}

.invoice-header.light {
    background-color: #f3bb74;
    color: #000000;
}

.invoice-meta-data strong {
    color: #ad795d;
}

/* Tabla de productos */
.invoice-items-table thead th {
    background-color: #c3ced1 !important;
    color: #000000 !important;
    border-bottom: none !important;
}

.invoice-items-table tbody tr:nth-child(even) {
    background-color: #f8f9fa;
}

.invoice-items-table tbody tr:nth-child(odd) {
    background-color: #ffffff;
}

/* Totales y subtotales */
.invoice-total-section {
    color: #ad795d;
}

.invoice-total {
    color: #ad795d;
    font-weight: bold;
    font-size: 1.2em;
}

.invoice-subtotal {
    color: #ad795d;
}

/* Notas y condiciones */
.invoice-notes {
    color: #000000;
}

.invoice-notes strong,
.invoice-notes .highlight {
    color: #ad795d;
}

.invoice-terms {
    color: #000000;
}

.invoice-terms strong,
.invoice-terms .highlight {
    color: #ad795d;
}

/* Estados de factura */
.invoice-status {
    padding: 6px 12px;
    border-radius: 4px;
    font-weight: 500;
}

.invoice-status-paid {
    background-color: #f3bb74;
    color: #000000;
}

.invoice-status-draft {
    background-color: #c3ced1;
    color: #000000;
}

.invoice-status-overdue {
    background-color: rgba(173, 121, 93, 0.9);
    color: #ffffff;
}

/* Botones de acción en facturas */
.invoice-action-button {
    background-color: #ad795d;
    color: #ffffff;
    border: none;
    padding: 8px 16px;
    border-radius: 4px;
    transition: background-color 0.3s ease;
}

.invoice-action-button:hover {
    background-color: rgba(173, 121, 93, 0.9);
    color: #ffffff;
}

.invoice-action-button.secondary {
    background-color: #c3ced1;
    color: #000000;
}

.invoice-action-button.secondary:hover {
    background-color: rgba(195, 206, 209, 0.9);
}

/* Personalización de badges de Bootstrap para estados */
.badge.bg-primary,
span.badge.bg-primary,
.bg-primary.badge {
    background-color: #f3bb74 !important; /* Enviado: fondo naranja claro */
    color: #000000 !important;
    border-color: #f3bb74 !important;
}

.badge.bg-success,
span.badge.bg-success,
.bg-success.badge {
    background-color: #ad795d !important; /* Aprobado: fondo marrón */
    color: #ffffff !important;
    border-color: #ad795d !important;
}

.badge.bg-secondary,
span.badge.bg-secondary,
.bg-secondary.badge {
    background-color: #c3ced1 !important; /* Pendiente: fondo gris claro */
    color: #000000 !important;
    border-color: #c3ced1 !important;
}

/* Personalización de botones de filtro */
.btn.save-filter-button.btn-success {
    background-color: #f3bb74 !important;
    border-color: #f3bb74 !important;
    color: #000000 !important;
}

.btn.save-filter-button.btn-success:hover,
.btn.save-filter-button.btn-success:focus,
.btn.save-filter-button.btn-success:active {
    background-color: #e5a963 !important;
    border-color: #e5a963 !important;
    color: #000000 !important;
}

.btn.save-filter-button:not(.btn-success) {
    background-color: transparent !important;
    border-color: #ad795d !important;
    color: #ad795d !important;
}

.btn.save-filter-button:not(.btn-success):hover,
.btn.save-filter-button:not(.btn-success):focus,
.btn.save-filter-button:not(.btn-success):active {
    background-color: rgba(173, 121, 93, 0.1) !important;
    border-color: #ad795d !important;
    color: #ad795d !important;
}

/* Estilo general para encabezados de tabla */
table thead th,
.table thead th,
th[scope="col"] {
    background-color: #c3ced1 !important;
    color: #000000 !important;
    border-bottom: none !important;
}



@media screen and (max-width: 768px) {
    .signin-image {
        display: none;
    }

    .form-signin {
        flex: 1;
        width: 100%;
        padding: 15px;
        max-width: 100%;
    }
}