@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

* { font-family: 'Poppins', sans-serif; }

.gradient-bg { background: linear-gradient(135deg, #0f172a 0%, #1e293b 50%, #0f172a 100%); }
.card-gradient { background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%); }

/* Buttons */
.btn-primary { background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: white; transition: all 0.3s ease; }
.btn-primary:hover { background: linear-gradient(135deg, #059669 0%, #047857 100%); transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(16, 185, 129, 0.2); }

.btn-danger { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); color: white; transition: all 0.3s ease; }
.btn-danger:hover { background: linear-gradient(135deg, #dc2626 0%, #b91c1c 100%); transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(239, 68, 68, 0.2); }

.btn-info { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); color: white; transition: all 0.3s ease; }
.btn-info:hover { background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%); transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(59, 130, 246, 0.2); }

.btn-secondary { background: linear-gradient(135deg, #64748b 0%, #475569 100%); color: white; transition: all 0.3s ease; }
.btn-secondary:hover { background: linear-gradient(135deg, #475569 0%, #334155 100%); }

/* Nav Links */
.nav-link { transition: all 0.3s ease; color: #94a3b8; border-left: 3px solid transparent; }
.nav-link:hover { background: linear-gradient(90deg, rgba(31, 41, 55, 0.5) 0%, rgba(17, 24, 39, 0) 100%); color: #10b981; border-left-color: #10b981; }
.nav-link.active { background: linear-gradient(90deg, rgba(16, 185, 129, 0.1) 0%, rgba(5, 150, 105, 0) 100%); color: #10b981 !important; border-left-color: #10b981; }

/* Cards */
.stat-card-1 { background: linear-gradient(145deg, #10b981 0%, #059669 100%); }
.stat-card-2 { background: linear-gradient(145deg, #3b82f6 0%, #2563eb 100%); }
.stat-card-3 { background: linear-gradient(145deg, #f59e0b 0%, #d97706 100%); }
.stat-card-4 { background: linear-gradient(145deg, #8b5cf6 0%, #7c3aed 100%); }

.sidebar-shadow { box-shadow: 4px 0 20px rgba(0,0,0,0.1); }
.progress-bar { background: linear-gradient(90deg, #10b981 0%, #059669 100%); }
.table-row-hover:hover { background-color: #f8fafc; transition: background-color 0.2s; }

/* Badges */
.badge { padding: 0.25rem 0.75rem; border-radius: 9999px; font-size: 0.75rem; font-weight: 600; color: white; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
.badge-success { background: linear-gradient(135deg, #10b981 0%, #059669 100%); }
.badge-warning { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); }
.badge-danger { background: linear-gradient(135deg, #ef4444 0%, #dc2626 100%); }
.badge-info { background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%); }
.badge-neutral { background: linear-gradient(135deg, #94a3b8 0%, #64748b 100%); }

.input-gradient:focus { border-color: #10b981; box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.1); outline: none; }
.pulse-animation { animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite; }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: 0.8; } }

.hover-lift { transition: all 0.3s ease; }
.hover-lift:hover { transform: translateY(-4px); box-shadow: 0 10px 25px rgba(0,0,0,0.1); }

.custom-scrollbar::-webkit-scrollbar { width: 6px; }
.custom-scrollbar::-webkit-scrollbar-track { background: #f1f5f9; }
.custom-scrollbar::-webkit-scrollbar-thumb { background: linear-gradient(135deg, #10b981, #059669); border-radius: 3px; }

.step-completed { background: linear-gradient(135deg, #10b981 0%, #059669 100%); color: white; }
.step-pending { background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%); }
.supply-electric { background: linear-gradient(135deg, #10b981 0%, #059669 100%); }
.supply-gas { background: linear-gradient(135deg, #f59e0b 0%, #d97706 100%); }

/* Modal Backdrop */
.modal-backdrop { backdrop-filter: blur(4px); }

/* Global Centering */
:root { --app-text-align: center; }

body { text-align: var(--app-text-align); }

h1, h2, h3, h4, h5, h6,
p, span, small, strong,
label, legend,
a, button,
input, textarea, select, option,
::placeholder {
  text-align: inherit;
}

input, textarea, select { text-align: var(--app-text-align); }
input::placeholder, textarea::placeholder { text-align: var(--app-text-align); }

table { width: 100%; }
table th, table td { text-align: var(--app-text-align) !important; vertical-align: middle; }

button, .badge { justify-content: center; }

aside, nav, .nav-link {
  text-align: left !important;
}

.icon-neon-white { color: #ffffff; filter: drop-shadow(0 0 6px rgba(255,255,255,0.85)); }