/* Custom styles for cotizaciones app */



/* Fondo general de la página */
body {
  background: #423c46;
  padding: 5px;
  margin: 0;
}

.app-container {
  background-color: #ffffff; /* Fondo blanco */
  border-radius: 10px; /* Bordes redondeados */
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); /* Sombra */
  max-width: 100%; /* Ocupa todo el ancho de la página */
  margin: 0; /* Centrar horizontalmente con margen superior e inferior */
  padding: 1px; /* Espaciado interno */
  overflow: hidden; /* Evitar desbordamiento */
}

.nav-link.dropdown-toggle {
  border-radius:20px; /* Bordes redondeados */
  padding: 10px; /* Espaciado interno */
  transition: background-color 0.3s ease; /* Transición suave */
}

.nav-link.dropdown-toggle:hover {
  background-color: rgba(0, 0, 0, 0.05); /* Fondo al pasar el cursor */
}


/* Modern dark theme colors */
:root {
  --modern-dark: #4B0082;
  --modern-dark-gradient-start: #4B0082;
  --modern-dark-gradient-end: #4B0082;
  --accent-color: #0091ff;
  --text-on-dark: #ffffff;
}

/* Override the primary color gradient in the sidebar */
.bg-gradient-primary {
  background-color: var(--modern-dark);
  background-image: linear-gradient(180deg, var(--modern-dark-gradient-start) 10%, var(--modern-dark-gradient-end) 100%);
  background-size: cover;
}

/* Update button styles */
.btn-primary {
  background-color: var(--modern-dark);
  border-color: var(--modern-dark);
}

.btn-primary:hover {
  background-color: var(--accent-color);
  border-color: var(--accent-color);
}

/* Update topbar button */
.topbar .dropdown-list .dropdown-header,
.topbar .nav-item .nav-link .badge-counter,
.topbar button.btn-primary {
  background-color: var(--modern-dark);
  border-color: var(--modern-dark);
}

/* Active navbar items */
.sidebar .nav-item .nav-link.active {
  background-color: rgba(255, 255, 255, 0.1);
}

/* Sidebar heading color */
.sidebar .sidebar-heading {
  color: rgba(255, 255, 255, 0.6);
}

/* Status badges */
.status-badge {
    padding: 0.25rem 0.5rem;
    border-radius: 1rem;
    font-weight: 600;
    font-size: 0.7rem;
    text-transform: uppercase;
}

.status-cotizado {
    background-color: #fff3cd;
    color: #856404;
}

.status-confirmado {
    background-color: #d4edda;
    color: #155724;
}

.status-pagado {
    background-color: #cce5ff;
    color: #004085;
}

.status-cancelado {
    background-color: #f8d7da;
    color: #721c24;
}

/* Card hover effects */
.card-hover {
    transition: transform 0.2s, box-shadow 0.2s;
}

.card-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15);
}

/* Dashboard cards */
.dashboard-card {
    border-radius: 0.5rem;
    border: none;
    transition: all 0.2s;
}

.dashboard-card .card-header {
    background-color: transparent;
    border-bottom: none;
    padding-bottom: 0;
}

/* Pagination custom styles */
.pagination-custom .page-item.active .page-link {
    background-color: var(--modern-dark);
    border-color: var(--modern-dark);
}

.pagination-custom .page-link {
    color: var(--modern-dark);
}

/* Border colors for cards */
.border-left-cotizado {
  border-left: 0.25rem solid #ffc107 !important;
}

.border-left-confirmado {
  border-left: 0.25rem solid #17a2b8 !important;
}

.border-left-pagado {
  border-left: 0.25rem solid #28a745 !important;
}

.border-left-cancelado {
  border-left: 0.25rem solid #dc3545 !important;
}

/* Sobrescribe el hover de collapse-item */
.collapse-item:hover, .collapse-item:focus {
  background-color: #ffffff !important; /* O el color que prefieras */
  color: #4B0082 !important;
}

.collapse-inner{
  background-color: #4b0082 !important; /* O el color que prefieras */
}