:root {
  /* Corporate Colors - Blanco principal, Negro y Dorado secundarios */
  --primary-white: #FFFFFF;
  --primary-black: #000000;
  /* Unified gold color for icons and accents */
  --gold: #FFD700;
  --primary-gold: var(--gold);
  --text-gold: var(--gold);
  --primary-purple: #8B5CF6;
  --dark-bg: #1A1A1A;
  --dark-hover: #2A2A2A;
  --dark-border: #333333;
  
  /* Layout */
  --navbar-height: 60px;
  --sidebar-width: 250px;
  
  /* Shadows */
  --card-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
  --hover-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
  
  /* Transitions */
  --transition-speed: 0.3s;
}

/* Icon utilities - force unified gold tone where appropriate */
.icon-gold,
.text-gold,
.dashboard-title-icon i,
.dashboard-datetime-icon i,
.kpi-icon-floating i,
.secondary-kpi-header-icon i,
.action-card-icon i,
.chart-header-icon i,
.breadcrumb-link i,
.badge i,
.card-header i,
.kpi-modern-card .kpi-icon-floating i,
.secondary-kpi-header-icon i {
  color: var(--primary-gold) !important;
}

/* SVGs used as icons: ensure fill follows the gold variable when inside icon containers */
.icon-gold svg,
.text-gold svg,
.dashboard-title-icon svg,
.dashboard-datetime-icon svg,
.kpi-icon-floating svg,
.secondary-kpi-header-icon svg,
.action-card-icon svg,
.chart-header-icon svg {
  fill: var(--primary-gold) !important;
  color: var(--primary-gold) !important;
}

/* Generic rule to make font-awesome and other icon fonts inherit color from parents by default */
.fas, .far, .fab, .fa {
  color: inherit !important;
}

/* Exceptions: when the icon sits ON a gold background, make the icon dark for contrast */
.action-card-gold .action-card-icon i,
.action-card-gold .action-card-icon svg,
.kpi-modern-card[style*="--primary-gold"] .kpi-icon-floating i,
.kpi-modern-card[style*="--primary-gold"] .kpi-icon-floating svg,
.card-header[style*="var(--primary-gold)"] i,
.card-header[style*="var(--primary-gold)"] svg,
.card[style*="background: linear-gradient(135deg, var(--primary-gold)"] .display-4 i,
.card[style*="background: linear-gradient(135deg, var(--primary-gold)"] .display-4 svg,
.secondary-kpi-header-icon {
  color: var(--primary-black) !important;
  fill: var(--primary-black) !important;
}

/* Specific dashboard header exceptions: ensure icons inside the dashboard header keep contrast */
.dashboard-title-icon i,
.dashboard-title-icon svg,
.dashboard-datetime-icon i,
.dashboard-datetime-icon svg {
  color: var(--primary-black) !important;
  fill: var(--primary-black) !important;
}

/* Breadcrumb Links */
.breadcrumb-link {
  color: var(--text-gold) !important;
  text-decoration: none !important;
  transition: all var(--transition-speed);
}

.breadcrumb-link:hover {
  color: var(--primary-gold) !important;
  text-decoration: none !important;
}

/* Base Layout */
body {
  background: var(--primary-white);
  color: var(--primary-black);
  min-height: 100vh;
  margin: 0;
  padding: 0;
}

/* Main Content Area */
.main-content {
  margin-left: var(--sidebar-width);
  padding-top: calc(var(--navbar-height) + 1rem);
  min-height: calc(100vh - var(--navbar-height));
  background: var(--primary-white);
  transition: margin-left var(--transition-speed);
  width: calc(100% - var(--sidebar-width));
}

@media (max-width: 992px) {
  .main-content {
    margin-left: 0 !important;
    width: 100% !important;
    padding-top: var(--navbar-height);
  }
}

/* Bootstrap Dark Theme Overrides */
.bg-dark {
  background-color: var(--dark-bg) !important;
}

.border-bottom {
  border-bottom-color: var(--dark-border) !important;
}