.api-management-dashboard{max-width:1400px;margin:0 auto;padding:20px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.dashboard-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #e2e8f0}.dashboard-header h1{color:#1a202c;font-size:2.5rem;font-weight:700;margin:0}.dashboard-controls{display:flex;gap:12px}.refresh-button,.clear-cache-button{padding:10px 20px;border:none;border-radius:8px;font-weight:600;cursor:pointer;transition:all .2s ease;font-size:14px}.refresh-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.refresh-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #667eea4d}.clear-cache-button{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.clear-cache-button:hover{transform:translateY(-2px);box-shadow:0 8px 25px #f093fb4d}.dashboard-tabs{display:flex;gap:8px;margin-bottom:30px;border-bottom:1px solid #e2e8f0;overflow-x:auto}.dashboard-tab{display:flex;align-items:center;gap:8px;padding:12px 20px;border:none;background:transparent;border-radius:8px 8px 0 0;cursor:pointer;transition:all .2s ease;font-weight:500;color:#64748b;white-space:nowrap}.dashboard-tab:hover{background:#f1f5f9;color:#334155}.dashboard-tab.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.tab-icon{font-size:18px}.tab-name{font-size:14px}.dashboard-content{background:#fff;border-radius:12px;padding:30px;box-shadow:0 4px 6px -1px #0000001a;min-height:600px}.api-dashboard-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#64748b}.loading-spinner{width:40px;height:40px;border:4px solid #e2e8f0;border-top:4px solid #667eea;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:20px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.overview-tab .metrics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:40px}.metric-card{background:linear-gradient(135deg,#f8fafc,#e2e8f0);padding:24px;border-radius:12px;text-align:center;border:1px solid #e2e8f0;transition:all .2s ease}.metric-card:hover{transform:translateY(-4px);box-shadow:0 8px 25px #0000001a}.metric-card h3{color:#475569;font-size:14px;font-weight:600;margin:0 0 12px;text-transform:uppercase;letter-spacing:.5px}.metric-value{font-size:2.5rem;font-weight:700;color:#1e293b;margin-bottom:8px}.metric-label{color:#64748b;font-size:14px;font-weight:500}.charts-section{margin-top:40px}.charts-section h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin-bottom:20px}.chart-placeholder{background:#f8fafc;border:2px dashed #cbd5e1;border-radius:12px;padding:40px;text-align:center;color:#64748b}.rate-limiting-tab .section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:1px solid #e2e8f0}.section-header h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin:0}.section-controls{display:flex;gap:12px}.action-button{padding:8px 16px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-weight:500;cursor:pointer;transition:all .2s ease;font-size:14px}.action-button:hover{background:#f9fafb;border-color:#9ca3af}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:30px}.stat-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#f8fafc;border-radius:8px;border:1px solid #e2e8f0}.stat-item label{font-weight:500;color:#475569}.stat-item span{font-weight:600;color:#1e293b;font-size:1.1rem}.rate-limits-config{background:#f8fafc;border:1px solid #e2e8f0;border-radius:8px;padding:20px}.rate-limits-config h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 16px}.rate-limits-config pre{background:#1e293b;color:#e2e8f0;padding:16px;border-radius:6px;overflow-x:auto;font-size:12px;line-height:1.5}.optimization-tab h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin:0 0 30px}.optimization-stats{display:flex;flex-direction:column;gap:30px}.stat-section{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.stat-section h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 20px}.stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.monitoring-tab h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin:0 0 30px}.monitoring-metrics{display:flex;flex-direction:column;gap:30px}.metric-section{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.metric-section h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 20px}.metric-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px}.metric-item{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:#fff;border-radius:6px;border:1px solid #e2e8f0}.metric-item label{font-weight:500;color:#475569}.metric-item span{font-weight:600;color:#1e293b}.endpoint-stats{display:flex;flex-direction:column;gap:12px}.endpoint-item{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:16px}.endpoint-name{font-weight:600;color:#1e293b;margin-bottom:8px}.endpoint-metrics{display:flex;gap:16px;flex-wrap:wrap}.endpoint-metrics span{font-size:14px;color:#64748b;background:#f1f5f9;padding:4px 8px;border-radius:4px}.alerts-tab h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin:0 0 30px}.alerts-section,.incidents-section{margin-bottom:40px}.alerts-section h4,.incidents-section h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 20px}.alerts-list,.incidents-list{display:flex;flex-direction:column;gap:16px}.alert-item,.incident-item{background:#fff;border:1px solid #e2e8f0;border-radius:8px;padding:20px;transition:all .2s ease}.alert-item:hover,.incident-item:hover{box-shadow:0 4px 12px #0000001a}.alert-item.warning{border-left:4px solid #f59e0b}.alert-item.critical{border-left:4px solid #ef4444}.alert-header,.incident-header{display:flex;gap:12px;align-items:center;margin-bottom:12px;flex-wrap:wrap}.alert-severity,.incident-severity{padding:4px 8px;border-radius:4px;font-size:12px;font-weight:600;text-transform:uppercase}.alert-severity.warning,.incident-severity.high{background:#fef3c7;color:#92400e}.alert-severity.critical{background:#fee2e2;color:#991b1b}.alert-type,.incident-type{font-weight:500;color:#374151}.alert-time,.incident-time{color:#6b7280;font-size:14px}.alert-message{color:#374151;margin-bottom:16px;line-height:1.5}.alert-actions,.incident-actions{display:flex;gap:8px}.acknowledge-button,.resolve-button{padding:6px 12px;border:1px solid #d1d5db;border-radius:4px;background:#fff;color:#374151;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.acknowledge-button:hover{background:#f3f4f6}.resolve-button{background:#10b981;color:#fff;border-color:#10b981}.resolve-button:hover{background:#059669}.incident-details{color:#6b7280;font-size:14px;margin-bottom:16px;line-height:1.5}.incident-details div{margin-bottom:4px}.configuration-tab h3{color:#1e293b;font-size:1.5rem;font-weight:600;margin:0 0 30px}.config-sections{display:flex;flex-direction:column;gap:30px;margin-bottom:40px}.config-section{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.config-section h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 16px}.config-button{padding:10px 20px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-weight:500;cursor:pointer;transition:all .2s ease}.config-button:hover{background:#f9fafb;border-color:#9ca3af}.export-import{background:#f8fafc;border:1px solid #e2e8f0;border-radius:12px;padding:24px}.export-import h4{color:#1e293b;font-size:1.2rem;font-weight:600;margin:0 0 16px}.export-import-buttons{display:flex;gap:12px}.export-button,.import-button{padding:10px 20px;border:1px solid #d1d5db;border-radius:6px;background:#fff;color:#374151;font-weight:500;cursor:pointer;transition:all .2s ease}.export-button:hover,.import-button:hover{background:#f9fafb;border-color:#9ca3af}@media (max-width: 768px){.api-management-dashboard{padding:10px}.dashboard-header{flex-direction:column;gap:20px;align-items:stretch}.dashboard-header h1{font-size:2rem;text-align:center}.dashboard-controls{justify-content:center}.dashboard-tabs{flex-wrap:wrap;gap:4px}.dashboard-tab{padding:8px 12px;font-size:12px}.dashboard-content{padding:20px}.metrics-grid,.stats-grid,.stat-grid,.metric-grid{grid-template-columns:1fr}.endpoint-metrics{flex-direction:column;gap:8px}.alert-header,.incident-header{flex-direction:column;align-items:flex-start;gap:8px}.export-import-buttons{flex-direction:column}}@media (max-width: 480px){.dashboard-header h1{font-size:1.5rem}.metric-value{font-size:2rem}.dashboard-tab{padding:6px 8px}.tab-name{display:none}}