/* Dashboard Apple Style - MODO CLARO FORZADO */

/* Override any parent styles that might interfere */
.apple-dashboard,
.apple-dashboard * {
  box-sizing: border-box;
}

#dashboardProSection,
#dashboardProContainer {
  background: #f5f5f7 !important;
}

/* IMPORTANTE: Quitar el header naranja global del dashboard */
.apple-dashboard .apple-header,
#dashboardProContainer .apple-header,
#dashboardProSection .apple-header {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  padding: 0 !important;
  position: relative !important;
}

.apple-dashboard .apple-header::before,
#dashboardProContainer .apple-header::before,
#dashboardProSection .apple-header::before {
  display: none !important;
  content: none !important;
}

/* Asegurar que el título sea oscuro, no blanco */
.apple-dashboard .apple-title {
  color: #1d1d1f !important;
  text-shadow: none !important;
}

.apple-dashboard .apple-subtitle {
  color: #86868b !important;
}

/* Fix para los botones de icono en el dashboard */
.apple-dashboard .apple-btn-icon {
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border-radius: 50% !important;
  background: #ffffff !important;
  color: #86868b !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 0.2s ease !important;
}

.apple-dashboard .apple-btn-icon:hover {
  background: #f5f5f7 !important;
  color: #f97316 !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1) !important;
  transform: translateY(-1px) !important;
}

.apple-dashboard .apple-btn-icon svg {
  width: 18px !important;
  height: 18px !important;
  stroke: currentColor !important;
  fill: none !important;
}

/* Botones toggle mejorados */
.apple-dashboard .apple-btn-toggle {
  background: #ffffff !important;
  color: #6b7280 !important;
  border: 1px solid rgba(0, 0, 0, 0.1) !important;
}

.apple-dashboard .apple-btn-toggle:hover {
  border-color: #f97316 !important;
  color: #f97316 !important;
}

.apple-dashboard .apple-btn-toggle.active {
  background: #f97316 !important;
  color: #ffffff !important;
  border-color: #f97316 !important;
}

.apple-dashboard .apple-btn-toggle svg {
  width: 16px !important;
  height: 16px !important;
  stroke: currentColor !important;
  fill: none !important;
}

:root {
  --apple-bg: #f5f5f7;
  --apple-card-bg: #ffffff;
  --apple-text: #1d1d1f;
  --apple-text-secondary: #86868b;
  --apple-border: rgba(0, 0, 0, 0.08);
  --apple-shadow: 0 2px 8px rgba(0, 0, 0, 0.04), 0 4px 24px rgba(0, 0, 0, 0.06);
  --apple-shadow-hover: 0 4px 12px rgba(0, 0, 0, 0.08), 0 8px 32px rgba(0, 0, 0, 0.1);
  --apple-radius: 16px;
  --apple-radius-sm: 10px;
  --apple-blue: #007aff;
  --apple-green: #34c759;
  --apple-red: #ff3b30;
  --apple-orange: #ff9500;
  --apple-purple: #af52de;
  --apple-teal: #5ac8fa;
  --apple-indigo: #5856d6;
  --apple-font: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Helvetica Neue', sans-serif;
}

.apple-dashboard { font-family: var(--apple-font); background: var(--apple-bg); min-height: 100vh; padding: 24px; color: var(--apple-text); -webkit-font-smoothing: antialiased; }

.apple-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 32px; padding: 0 8px; flex-wrap: wrap; gap: 16px; }
.apple-header-left { display: flex; align-items: baseline; gap: 12px; }
.apple-title { font-size: 34px; font-weight: 700; letter-spacing: -0.5px; margin: 0; color: var(--apple-text); }
.apple-subtitle { font-size: 17px; font-weight: 400; color: var(--apple-text-secondary); }
.apple-header-right { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; }
.apple-filters { display: flex; gap: 16px; }
.apple-toggle { display: flex; align-items: center; gap: 8px; cursor: pointer; font-size: 13px; color: var(--apple-text-secondary); }
.apple-toggle input[type="checkbox"] { width: 18px; height: 18px; accent-color: var(--apple-blue); cursor: pointer; }
.apple-toggle-label { user-select: none; }

.apple-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 8px 16px; font-size: 14px; font-weight: 500; color: var(--apple-blue); background: rgba(0, 122, 255, 0.1); border: none; border-radius: var(--apple-radius-sm); cursor: pointer; transition: all 0.2s ease; }
.apple-btn:hover { background: rgba(0, 122, 255, 0.15); }
.apple-btn-icon { width: 40px; height: 40px; padding: 0; border-radius: 50%; background: var(--apple-card-bg); color: var(--apple-text-secondary); box-shadow: var(--apple-shadow); }
.apple-btn-icon:hover { box-shadow: var(--apple-shadow-hover); color: var(--apple-blue); }
.apple-btn-sm { padding: 6px 12px; font-size: 12px; border-radius: 8px; }
.apple-btn-primary { background: var(--apple-blue); color: white; }
.apple-btn-primary:hover { background: #0066d6; }
.apple-btn-spinning svg { animation: apple-spin 1s linear infinite; }
@keyframes apple-spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }

.apple-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
@media (max-width: 1400px) { .apple-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { .apple-grid { grid-template-columns: 1fr; } .apple-dashboard { padding: 16px; } .apple-title { font-size: 28px; } }

.apple-card { background: var(--apple-card-bg); border-radius: var(--apple-radius); box-shadow: var(--apple-shadow); transition: all 0.3s ease; overflow: hidden; }
.apple-card:hover { box-shadow: var(--apple-shadow-hover); transform: translateY(-2px); }
.apple-card-single { grid-column: span 1; padding: 20px; }
.apple-card-double { grid-column: span 2; }
.apple-card-full { grid-column: span 4; }
@media (max-width: 1400px) { .apple-card-full { grid-column: span 2; } }
@media (max-width: 768px) { .apple-card-double, .apple-card-full { grid-column: span 1; } }

.apple-card-header { display: flex; justify-content: space-between; align-items: center; padding: 16px 20px; border-bottom: 1px solid var(--apple-border); }
.apple-card-title { font-size: 15px; font-weight: 600; color: var(--apple-text); margin: 0; }
.apple-card-body { padding: 20px; }
.apple-card-body-scroll { max-height: 320px; overflow-y: auto; }
.apple-card-body-scroll-lg { max-height: 500px; overflow-y: auto; }
.apple-card-content { display: flex; justify-content: space-between; align-items: flex-start; }
.apple-card-footer { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--apple-border); }

.apple-kpi { display: flex; flex-direction: column; }
.apple-kpi-value { font-size: 36px; font-weight: 600; letter-spacing: -1px; line-height: 1.1; color: var(--apple-text); }
.apple-kpi-label { font-size: 13px; font-weight: 500; color: var(--apple-text-secondary); margin-top: 4px; }
.apple-kpi-icon { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; }
.apple-kpi-icon-blue { background: rgba(0, 122, 255, 0.1); color: var(--apple-blue); }
.apple-kpi-icon-green { background: rgba(52, 199, 89, 0.1); color: var(--apple-green); }
.apple-kpi-icon-purple { background: rgba(175, 82, 222, 0.1); color: var(--apple-purple); }
.apple-kpi-icon-orange { background: rgba(255, 149, 0, 0.1); color: var(--apple-orange); }
.apple-kpi-icon-teal { background: rgba(90, 200, 250, 0.1); color: var(--apple-teal); }
.apple-kpi-icon-indigo { background: rgba(88, 86, 214, 0.1); color: var(--apple-indigo); }

.apple-trend { font-size: 12px; font-weight: 500; color: var(--apple-text-secondary); }
.apple-trend-up { color: var(--apple-green); }
.apple-trend-down { color: var(--apple-red); }

.apple-badge { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 24px; padding: 0 8px; font-size: 12px; font-weight: 600; border-radius: 12px; }
.apple-badge-red { background: rgba(255, 59, 48, 0.1); color: var(--apple-red); }
.apple-badge-blue { background: rgba(0, 122, 255, 0.1); color: var(--apple-blue); }
.apple-badge-green { background: rgba(52, 199, 89, 0.1); color: var(--apple-green); }
.apple-badge-purple { background: rgba(175, 82, 222, 0.1); color: var(--apple-purple); }

.apple-table { width: 100%; border-collapse: collapse; font-size: 13px; }
.apple-table th { text-align: left; font-weight: 500; color: var(--apple-text-secondary); padding: 10px 12px; border-bottom: 1px solid var(--apple-border); font-size: 11px; text-transform: uppercase; letter-spacing: 0.5px; }
.apple-table td { padding: 12px; border-bottom: 1px solid var(--apple-border); vertical-align: middle; }
.apple-table tr:last-child td { border-bottom: none; }
.apple-table-compact td { padding: 8px 12px; }
.apple-cell-main { font-weight: 500; color: var(--apple-text); }
.apple-cell-sub { font-size: 12px; color: var(--apple-text-secondary); }
.apple-cell-truncate { max-width: 200px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.apple-cell-days { font-weight: 600; text-align: center; }
.apple-urgent-critical { background: rgba(255, 59, 48, 0.05); }
.apple-urgent-critical .apple-cell-days { color: var(--apple-red); }
.apple-urgent-warning { background: rgba(255, 149, 0, 0.05); }
.apple-urgent-warning .apple-cell-days { color: var(--apple-orange); }
.apple-table-more { text-align: center; padding: 12px; font-size: 12px; color: var(--apple-text-secondary); }

.apple-phase-badge { display: inline-block; padding: 4px 10px; font-size: 11px; font-weight: 600; border-radius: 6px; background: rgba(0, 0, 0, 0.05); color: var(--apple-text-secondary); }
.apple-status-badge { display: inline-block; padding: 4px 10px; font-size: 11px; font-weight: 600; border-radius: 6px; }
.apple-status-ganada { background: rgba(52, 199, 89, 0.1); color: var(--apple-green); }
.apple-status-abierta { background: rgba(0, 122, 255, 0.1); color: var(--apple-blue); }
.apple-status-perdida { background: rgba(255, 59, 48, 0.1); color: var(--apple-red); }

.apple-bar-chart { display: flex; flex-direction: column; gap: 12px; }
.apple-bar-row { display: flex; align-items: center; gap: 12px; }
.apple-bar-label { width: 90px; font-size: 12px; font-weight: 500; color: var(--apple-text-secondary); flex-shrink: 0; }
.apple-bar-track { flex: 1; height: 8px; background: rgba(0, 0, 0, 0.05); border-radius: 4px; overflow: hidden; }
.apple-bar-fill { height: 100%; border-radius: 4px; transition: width 0.5s ease; }
.apple-bar-value { width: 32px; text-align: right; font-size: 13px; font-weight: 600; color: var(--apple-text); }

.apple-bar-chart-vertical { display: flex; flex-direction: row; align-items: flex-end; justify-content: space-around; height: 200px; padding-top: 20px; }
.apple-bar-col { display: flex; flex-direction: column; align-items: center; gap: 6px; flex: 1; }
.apple-bar-vertical-track { width: 32px; height: 120px; background: rgba(0, 0, 0, 0.05); border-radius: 6px; display: flex; align-items: flex-end; overflow: hidden; }
.apple-bar-vertical-fill { width: 100%; background: linear-gradient(180deg, var(--apple-blue), var(--apple-indigo)); border-radius: 6px; transition: height 0.5s ease; }
.apple-bar-col-label { font-size: 11px; color: var(--apple-text-secondary); font-weight: 500; }
.apple-bar-col-value { font-size: 14px; font-weight: 600; color: var(--apple-text); }
.apple-bar-col-importe { font-size: 10px; color: var(--apple-text-secondary); }

.apple-dynamics-summary { display: flex; justify-content: space-around; padding: 16px 0; margin-bottom: 16px; border-bottom: 1px solid var(--apple-border); }
.apple-dynamics-stat { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.apple-dynamics-stat-value { font-size: 28px; font-weight: 600; }
.apple-dynamics-stat-label { font-size: 11px; font-weight: 500; color: var(--apple-text-secondary); text-transform: uppercase; letter-spacing: 0.5px; }
.apple-text-green { color: var(--apple-green); }
.apple-text-blue { color: var(--apple-blue); }
.apple-text-red { color: var(--apple-red); }

.apple-timeline { display: flex; flex-direction: column; }
.apple-timeline-item { display: flex; gap: 16px; padding: 12px 0; position: relative; }
.apple-timeline-item:not(:last-child)::after { content: ''; position: absolute; left: 5px; top: 28px; bottom: -12px; width: 2px; background: var(--apple-border); }
.apple-timeline-dot { width: 12px; height: 12px; border-radius: 50%; background: var(--apple-blue); flex-shrink: 0; margin-top: 4px; }
.apple-timeline-content { flex: 1; }
.apple-timeline-text { font-size: 13px; font-weight: 500; color: var(--apple-text); line-height: 1.4; }
.apple-timeline-meta { display: flex; gap: 6px; font-size: 11px; color: var(--apple-text-secondary); margin-top: 4px; }

.apple-performance-chart { display: flex; justify-content: space-around; align-items: flex-end; height: 160px; padding: 20px 0; }
.apple-perf-col { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.apple-perf-bars { display: flex; gap: 4px; align-items: flex-end; height: 100px; }
.apple-perf-bar { width: 16px; border-radius: 4px; transition: height 0.5s ease; }
.apple-perf-bar-green { background: var(--apple-green); }
.apple-perf-bar-red { background: var(--apple-red); }
.apple-perf-label { font-size: 11px; color: var(--apple-text-secondary); font-weight: 500; }
.apple-perf-legend { display: flex; justify-content: center; gap: 24px; margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--apple-border); }
.apple-legend-item { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--apple-text-secondary); }
.apple-legend-dot { width: 10px; height: 10px; border-radius: 3px; }
.apple-legend-dot-green { background: var(--apple-green); }
.apple-legend-dot-red { background: var(--apple-red); }

.apple-empty { display: flex; align-items: center; justify-content: center; padding: 40px 20px; font-size: 14px; color: var(--apple-text-secondary); text-align: center; }
.apple-loading { grid-column: 1 / -1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 80px; color: var(--apple-text-secondary); }
.apple-spinner { width: 32px; height: 32px; border: 3px solid var(--apple-border); border-top-color: var(--apple-blue); border-radius: 50%; animation: apple-spin 0.8s linear infinite; }
.apple-error { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; padding: 80px; text-align: center; color: var(--apple-text-secondary); }
.apple-error h3 { font-size: 20px; font-weight: 600; color: var(--apple-text); margin: 0; }
.apple-error p { margin: 0; font-size: 14px; }

.apple-card-body-scroll::-webkit-scrollbar, .apple-card-body-scroll-lg::-webkit-scrollbar { width: 6px; }
.apple-card-body-scroll::-webkit-scrollbar-track, .apple-card-body-scroll-lg::-webkit-scrollbar-track { background: transparent; }
.apple-card-body-scroll::-webkit-scrollbar-thumb, .apple-card-body-scroll-lg::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.15); border-radius: 3px; }

/* Modal de configuración */
.apple-modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); display: flex; align-items: center; justify-content: center; z-index: 9999; backdrop-filter: blur(4px); }
.apple-modal { background: var(--apple-card-bg); border-radius: var(--apple-radius); box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3); max-width: 500px; width: 90%; max-height: 80vh; overflow: hidden; }
.apple-modal-header { display: flex; justify-content: space-between; align-items: center; padding: 20px 24px; border-bottom: 1px solid var(--apple-border); }
.apple-modal-header h2 { margin: 0; font-size: 18px; font-weight: 600; }
.apple-modal-close { background: none; border: none; font-size: 24px; cursor: pointer; color: var(--apple-text-secondary); padding: 0; line-height: 1; }
.apple-modal-close:hover { color: var(--apple-text); }
.apple-modal-body { padding: 24px; max-height: 400px; overflow-y: auto; }
.apple-modal-desc { margin: 0 0 16px; font-size: 14px; color: var(--apple-text-secondary); }
.apple-modal-footer { display: flex; justify-content: flex-end; gap: 12px; padding: 16px 24px; border-top: 1px solid var(--apple-border); background: var(--apple-bg); }

.apple-config-list { display: flex; flex-direction: column; gap: 12px; }
.apple-config-item { display: flex; align-items: center; gap: 12px; padding: 12px 16px; background: var(--apple-bg); border-radius: var(--apple-radius-sm); cursor: pointer; transition: background 0.2s; }
.apple-config-item:hover { background: rgba(0, 122, 255, 0.05); }
.apple-config-item input[type="checkbox"] { width: 20px; height: 20px; accent-color: var(--apple-blue); }
.apple-config-item span { font-size: 14px; color: var(--apple-text); }

/* Filtros y botones toggle */
.apple-filter-group { display: flex; flex-direction: column; gap: 4px; }
.apple-filter-label { font-size: 10px; font-weight: 600; color: var(--apple-text-secondary); text-transform: uppercase; letter-spacing: 0.5px; }
.apple-select { padding: 8px 12px; font-size: 14px; border: 1px solid var(--apple-border); border-radius: var(--apple-radius-sm); background: var(--apple-card-bg); color: var(--apple-text); cursor: pointer; min-width: 100px; }
.apple-select:focus { outline: none; border-color: var(--apple-blue); box-shadow: 0 0 0 3px rgba(0, 122, 255, 0.1); }

.apple-btn-group { display: flex; gap: 8px; }
.apple-btn-toggle { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; font-size: 13px; font-weight: 500; color: var(--apple-text-secondary); background: var(--apple-card-bg); border: 1px solid var(--apple-border); border-radius: var(--apple-radius-sm); cursor: pointer; transition: all 0.2s ease; }
.apple-btn-toggle:hover { border-color: var(--apple-blue); color: var(--apple-blue); }
.apple-btn-toggle.active { background: var(--apple-blue); color: white; border-color: var(--apple-blue); }
.apple-btn-toggle svg { flex-shrink: 0; }

/* Phase badges con colores */
.apple-phase-invitacion { background: rgba(148, 163, 184, 0.15); color: #64748b; }
.apple-phase-favorita { background: rgba(245, 158, 11, 0.15); color: #d97706; }
.apple-phase-analisis { background: rgba(59, 130, 246, 0.15); color: #2563eb; }
.apple-phase-gonogo { background: rgba(139, 92, 246, 0.15); color: #7c3aed; }
.apple-phase-preparacion { background: rgba(6, 182, 212, 0.15); color: #0891b2; }
.apple-phase-revision { background: rgba(236, 72, 153, 0.15); color: #db2777; }
.apple-phase-presentacion { background: rgba(20, 184, 166, 0.15); color: #0d9488; }
.apple-phase-presentada { background: rgba(16, 185, 129, 0.15); color: #059669; }
.apple-phase-adjudicada { background: rgba(34, 197, 94, 0.15); color: #16a34a; }
.apple-phase-perdida { background: rgba(239, 68, 68, 0.15); color: #dc2626; }
.apple-phase-nogo { background: rgba(107, 114, 128, 0.15); color: #4b5563; }
.apple-phase-eliminada { background: rgba(107, 114, 128, 0.1); color: #9ca3af; }

/* Responsive */
@media (max-width: 1200px) {
  .apple-header { flex-direction: column; align-items: flex-start; }
  .apple-header-right { width: 100%; justify-content: flex-start; flex-wrap: wrap; }
  .apple-btn-toggle span { display: none; }
}