:root{--bg-main:#f4f7fb;--bg-card:#ffffffd9;--border-color:#cbd5e199;--border-light:#fffc;--text-primary:#0f172a;--text-secondary:#475569;--text-muted:#94a3b8;--primary-navy:#0f172a;--primary-blue:#1e3a8a;--accent-blue:#2563eb;--emerald:#059669;--emerald-light:#ecfdf5;--amber:#d97706;--amber-light:#fffbeb;--coral:#dc2626;--coral-light:#fef2f2;--font-main:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-heading:"Outfit", var(--font-main);--shadow-sm:0 2px 4px #0f172a0a;--shadow-md:0 8px 16px -4px #0f172a0d, 0 4px 6px -2px #0f172a08;--shadow-lg:0 20px 25px -5px #0f172a14, 0 10px 10px -5px #0f172a08;--shadow-xl:0 25px 50px -12px #0f172a1f}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-main);color:var(--text-primary);font-family:var(--font-main);background-image:radial-gradient(at 0 0,#2563eb0d 0,#0000 40%),radial-gradient(at 100% 100%,#0f172a08 0,#0000 40%);background-attachment:fixed;min-height:100vh;line-height:1.6;overflow-x:hidden}.hidden{display:none!important}.glass-panel{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);border:1px solid var(--border-light);box-shadow:var(--shadow-md);border-radius:18px;transition:box-shadow .3s,transform .3s,border-color .3s}.login-container{justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{text-align:center;width:100%;max-width:460px;box-shadow:var(--shadow-xl);background:#fffffff2;padding:48px 42px;animation:.6s cubic-bezier(.16,1,.3,1) fadeIn}.brand-logo{justify-content:center;align-items:center;gap:14px;margin-bottom:24px;display:flex}.logo-icon{background:linear-gradient(135deg, var(--primary-blue), var(--accent-blue));color:#fff;border-radius:16px;justify-content:center;align-items:center;width:56px;height:56px;display:inline-flex;box-shadow:0 8px 20px #2563eb4d}.logo-icon svg{stroke-width:2.2px;width:28px;height:28px}.logo-text{font-family:var(--font-heading);letter-spacing:1.2px;color:var(--primary-navy);font-size:1.85rem;font-weight:700}.login-card h2{font-family:var(--font-heading);color:var(--primary-navy);font-size:1.5rem;font-weight:600}.subtitle{color:var(--text-secondary);margin-top:6px;margin-bottom:36px;font-size:.95rem;font-weight:400}.input-group{text-align:left;margin-bottom:22px}.input-group label{color:var(--text-secondary);letter-spacing:.3px;text-transform:uppercase;margin-bottom:8px;font-size:.85rem;font-weight:600;display:block}.input-group input{border:1.5px solid var(--border-color);width:100%;color:var(--text-primary);font-size:.95rem;font-family:var(--font-main);background:#fff;border-radius:12px;padding:14px 16px;transition:all .25s}.input-group input:focus{border-color:var(--accent-blue);background:#fff;outline:none;box-shadow:0 0 0 4px #2563eb26}.input-with-icon{align-items:center;display:flex;position:relative}.input-with-icon>svg:first-child{color:var(--text-muted);pointer-events:none;width:20px;height:20px;transition:color .25s;position:absolute;left:16px}.input-with-icon input{padding-left:46px}.input-with-icon input:focus+svg,.input-with-icon:focus-within>svg:first-child{color:var(--accent-blue)}.password-wrapper input{padding-right:48px}.toggle-password-btn{cursor:pointer;color:var(--text-muted);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex;position:absolute;right:14px}.toggle-password-btn:hover{color:var(--primary-navy);background:#f1f5f9}.toggle-password-btn svg{width:20px;height:20px}.help-text{color:var(--text-muted);margin-top:6px;font-size:.8rem;display:block}.btn{font-family:var(--font-main);cursor:pointer;border:none;border-radius:12px;justify-content:center;align-items:center;gap:10px;padding:14px 24px;font-size:.95rem;font-weight:600;transition:all .25s cubic-bezier(.16,1,.3,1);display:inline-flex}.btn svg{stroke-width:2.2px;width:18px;height:18px}.btn-full{width:100%}.btn-large{padding:16px 28px;font-size:1.05rem}.btn-primary{background:var(--accent-blue);color:#fff;box-shadow:0 4px 14px #2563eb4d}.btn-primary:hover{background:#1d4ed8;transform:translateY(-2px);box-shadow:0 8px 24px #2563eb66}.btn-primary:active{transform:translateY(0)}.btn-slate{color:#fff;background:#0f4c5c;box-shadow:0 4px 14px #0f4c5c4d}.btn-slate:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0f4c5c66}.btn-slate:active{transform:translateY(0)}.btn-secondary-slate{color:#fff;background:#475569;box-shadow:0 4px 14px #4755694d}.btn-secondary-slate:hover{background:#334155;transform:translateY(-2px);box-shadow:0 8px 24px #33415566}.btn-secondary-slate:active{transform:translateY(0)}.btn-emerald{background:var(--primary-navy);color:#fff;width:100%;box-shadow:0 4px 14px #0f172a40}.btn-emerald:hover{background:#000;transform:translateY(-2px);box-shadow:0 8px 24px #0f172a59}.top-nav{-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border-color);z-index:100;box-shadow:var(--shadow-sm);background:#ffffffd9;justify-content:space-between;align-items:center;padding:16px 48px;display:flex;position:sticky;top:0}.top-nav .brand-logo{margin-bottom:0}.top-nav .logo-icon{border-radius:12px;width:44px;height:44px}.top-nav .logo-icon svg{width:22px;height:22px}.top-nav .logo-text{font-size:1.4rem}.nav-links{border:1px solid var(--border-color);background:#f1f5f999;border-radius:14px;gap:8px;padding:6px;display:flex}.nav-item{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;border-radius:10px;align-items:center;gap:8px;padding:10px 22px;font-size:.92rem;font-weight:600;transition:all .25s;display:inline-flex}.nav-item svg{width:18px;height:18px}.nav-item:hover{color:var(--accent-blue);background:#ffffff80}.nav-item.active{color:var(--accent-blue);background:#fff;box-shadow:0 2px 8px #0000000d}.user-profile{align-items:center;gap:20px;display:flex}.badge-admin{color:var(--primary-navy);align-items:center;gap:8px;font-size:.9rem;font-weight:600;display:flex}.badge-admin svg{color:var(--accent-blue)}.btn-logout{border:1px solid var(--border-color);color:var(--text-secondary);cursor:pointer;font-weight:500;font-family:var(--font-main);background:0 0;border-radius:10px;align-items:center;gap:8px;padding:10px 16px;transition:all .2s;display:inline-flex}.btn-logout svg{width:16px;height:16px}.btn-logout:hover{background:var(--coral-light);color:var(--coral);border-color:#fecaca}.user-menu-btn:hover{background:#0f4c5c0d!important}.dropdown-item{width:100%;color:var(--text-secondary);cursor:pointer;text-align:left;background:0 0;border:none;border-radius:10px;align-items:center;gap:12px;padding:10px 14px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.dropdown-item:hover{color:var(--primary-navy);background:#f1f5f9}.dropdown-item.text-danger{color:var(--coral)}.dropdown-item.text-danger:hover{background:var(--coral-light)}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{transform:translate(-100%)}to{transform:translate(0)}}.main-content{max-width:1360px;margin:0 auto;padding:48px 32px}.section-header{margin-bottom:40px}.section-header h2{font-family:var(--font-heading);color:var(--primary-navy);letter-spacing:-.5px;margin-bottom:8px;font-size:2rem;font-weight:700}.section-header p{color:var(--text-secondary);font-size:1.05rem}.grid-2col{grid-template-columns:1.4fr 1fr;gap:40px;display:grid}.form-card{padding:40px}.form-card h3{font-family:var(--font-heading);color:var(--primary-navy);align-items:center;gap:10px;margin-bottom:28px;font-size:1.25rem;display:flex}.form-card h3:before{content:"";background:var(--accent-blue);border-radius:4px;width:6px;height:20px;display:block}.form-row{grid-template-columns:1fr 1fr;gap:24px;display:grid}.divider{border:none;border-top:1px solid var(--border-color);margin:32px 0}.preview-card{padding:40px}.preview-card h3{font-family:var(--font-heading);color:var(--primary-navy);margin-bottom:24px;font-size:1.25rem}.calc-card{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background:#fff;border-radius:16px;margin:16px 0 28px;padding:28px}.calc-row{border-bottom:1px dashed var(--border-color);color:var(--text-secondary);justify-content:space-between;padding:14px 0;font-size:.95rem;display:flex}.calc-row:last-of-type{border-bottom:none}.calc-row strong{color:var(--text-primary);font-weight:600}.calc-row.highlight{font-size:1.15rem}.calc-row.total{border-top:2px solid var(--text-primary);color:var(--primary-navy);margin-top:8px;padding-top:20px;font-size:1.3rem;font-weight:700}.text-emerald{color:var(--accent-blue)!important}.text-amber{color:var(--amber)!important}.info-box{border:1px solid var(--border-color);background:#f8fafc;border-radius:14px;padding:24px}.info-box h4{color:var(--primary-navy);font-family:var(--font-heading);align-items:center;margin-bottom:12px;font-size:1.05rem;display:flex}.info-box p{color:var(--text-secondary);font-size:.92rem}.info-box ul{color:var(--text-secondary);margin:14px 0 0 24px;font-size:.9rem}.info-box li{margin-bottom:8px}.info-box li strong{color:var(--text-primary)}.kpi-grid{grid-template-columns:repeat(5,1fr);gap:20px;margin-bottom:40px;display:grid}.kpi-card{text-align:center;flex-direction:column;align-items:center;padding:32px;display:flex;position:relative;overflow:hidden}.kpi-card:after{content:"";background:radial-gradient(circle,#2563eb0f 0%,#0000 70%);border-radius:50%;width:140px;height:140px;position:absolute;top:-20px;right:-20px}.kpi-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.8px;font-size:.85rem;font-weight:700;display:block}.kpi-val{font-size:2.4rem;font-weight:700;font-family:var(--font-heading);color:var(--primary-navy);letter-spacing:-1px;margin-top:12px;display:block}.client-cards-grid{grid-template-columns:repeat(auto-fill,minmax(380px,1fr));gap:28px;display:grid}.client-card{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background:#fff;border-radius:18px;padding:28px;transition:all .3s cubic-bezier(.16,1,.3,1);position:relative}.client-card:hover{box-shadow:var(--shadow-lg);border-color:var(--border-light);transform:translateY(-6px)}.client-card.status-verde{border-top:6px solid var(--emerald)}.client-card.status-amarillo{border-top:6px solid var(--amber)}.client-card.status-rojo{border-top:6px solid var(--coral)}.card-top{justify-content:space-between;align-items:flex-start;margin-bottom:20px;padding-top:0;display:flex}.card-top h3{color:var(--primary-navy);font-size:1.35rem;font-weight:700;font-family:var(--font-heading)}.badge-status{letter-spacing:.3px;border-radius:20px;padding:6px 14px;font-size:.8rem;font-weight:700}.bg-verde{background:var(--emerald-light);color:var(--emerald)}.bg-amarillo{background:var(--amber-light);color:var(--amber)}.bg-rojo{background:var(--coral-light);color:var(--coral)}.client-stats{border:1px solid var(--border-color);color:var(--text-secondary);background:#f8fafc;border-radius:12px;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;padding:18px;font-size:.9rem;display:grid}.client-stats strong{color:var(--text-primary);font-weight:600}.card-actions{gap:12px;display:flex}.btn-small{padding:12px 20px;font-size:.9rem}.search-box{border:1px solid var(--border-color);background:#fff;border-radius:12px;align-items:center;gap:12px;margin-bottom:32px;padding:14px 20px;transition:all .2s;display:flex}.search-box:focus-within{border-color:var(--primary-navy);box-shadow:0 0 0 3px #0f4c5c26}.search-box svg{color:var(--text-muted);width:24px;height:24px}.search-box input{width:100%;color:var(--text-primary);font-size:1.1rem;font-family:var(--font-main);background:0 0;border:none}.search-box input::placeholder{color:var(--text-muted)}.search-box input:focus{outline:none}.weeks-grid{grid-template-columns:repeat(4,1fr);gap:12px;margin-top:16px;display:grid}.week-tile{border:2px solid var(--border-color);cursor:pointer;box-shadow:var(--shadow-sm);text-align:center;background:#fff;border-radius:12px;flex-direction:column;justify-content:center;align-items:center;padding:12px 8px;transition:all .2s;display:flex}.week-tile:hover{border-color:var(--accent-blue);box-shadow:var(--shadow-md);transform:translateY(-2px)}.week-tile.is-paid{border-color:var(--emerald);color:var(--emerald);background:#ecfdf5}.week-tile.is-paid:hover{background:#d1fae5}.week-tile-num{color:var(--primary-navy);margin-bottom:4px;font-size:1.2rem;font-weight:700}.week-tile.is-paid .week-tile-num{color:var(--emerald)}.week-tile-date{color:var(--text-secondary);margin-bottom:6px;font-size:.75rem}.week-tile-amount{color:#0a2540;font-size:.95rem;font-weight:700}.week-tile.is-paid .week-tile-amount{color:var(--emerald)}.week-card{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background:#fff;border-radius:14px;justify-content:space-between;align-items:center;padding:20px;transition:all .25s;display:flex}.week-card:hover{border-color:var(--accent-blue);box-shadow:var(--shadow-md)}.week-card.is-paid{border-color:var(--border-color);background:#f8fafc}.week-card.is-paid:hover{border-color:var(--emerald)}.btn-check{border:2px solid var(--border-color);color:#0000;cursor:pointer;background:#fff;border-radius:12px;justify-content:center;align-items:center;width:48px;height:48px;transition:all .2s cubic-bezier(.16,1,.3,1);display:flex}.btn-check:hover{border-color:var(--accent-blue);color:var(--accent-blue)}.week-card.is-paid .btn-check{background:var(--emerald);border-color:var(--emerald);color:#fff;box-shadow:0 4px 12px #05966940}.week-card.is-paid .btn-check:hover{color:#fff;background:#047857;border-color:#047857}.empty-state{text-align:center;color:var(--text-secondary);flex-direction:column;align-items:center;padding:64px;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}.spin{animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.swal2-container{z-index:10000!important}.swal2-popup{font-family:var(--font-main)!important;box-shadow:var(--shadow-xl)!important;border-radius:20px!important;padding:24px!important}.swal2-title{color:var(--primary-navy)!important;font-family:var(--font-heading)!important;font-weight:700!important}.swal2-confirm,.swal2-cancel{border-radius:12px!important;padding:12px 24px!important;font-weight:600!important}.choices__inner{background-color:var(--input-bg)!important;border:1.5px solid var(--border-color)!important;min-height:50px!important;font-family:var(--font-main)!important;color:var(--primary-navy)!important;transition:var(--transition)!important;border-radius:12px!important;padding:10px 16px!important;font-size:.95rem!important}.choices[data-type*=select-one].is-open:after{border-color:transparent transparent var(--primary-navy) transparent!important;margin-top:-7.5px!important}.choices[data-type*=select-one]:after{border:5px solid #0000!important;border-color:var(--primary-navy) transparent transparent transparent!important;right:16px!important}.choices__list--dropdown{border:1.5px solid var(--accent-blue)!important;box-shadow:var(--shadow-lg)!important;font-family:var(--font-main)!important;border-radius:12px!important}.choices__item--choice{font-size:.95rem!important}.choices__list--dropdown .choices__item--selectable.is-highlighted{background-color:var(--accent-blue)!important;color:#fff!important}.file-upload-box{border:2px dashed var(--border-color);text-align:center;cursor:pointer;background:#f8fafc;border-radius:12px;margin-bottom:16px;padding:24px;transition:all .2s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.file-upload-box:hover{border-color:var(--accent-blue);background:#eff6ff;transform:translateY(-2px)}.file-upload-box input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;top:0;left:0}.file-upload-box .upload-icon{color:var(--accent-blue);width:32px;height:32px;margin-bottom:8px}.file-upload-box .upload-text{color:var(--primary-navy);font-size:.95rem;font-weight:600}.file-upload-box .upload-hint{color:var(--text-muted);font-size:.8rem}.modal-overlay{-webkit-backdrop-filter:blur(8px);z-index:9999;background:#0f172ab3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal-content{background:#fff;border-radius:20px;flex-direction:column;width:90%;max-width:600px;max-height:90vh;animation:.3s cubic-bezier(.16,1,.3,1) modalPop;display:flex;overflow:hidden;box-shadow:0 25px 50px -12px #00000040}@keyframes modalPop{0%{opacity:0;transform:scale(.95)translateY(20px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-header{border-bottom:1px solid var(--border-color);background:#f8fafc;justify-content:space-between;align-items:center;padding:24px 32px;display:flex}.modal-header h3{color:var(--primary-navy);font-family:var(--font-heading);margin:0;font-size:1.4rem}.modal-body{padding:32px;overflow-y:auto}.btn-icon{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:all .2s;display:flex}.btn-icon:hover{color:var(--coral);background:#f1f5f9}@media (width<=768px){.app-container{padding:0}.top-nav{flex-direction:row;padding:12px 16px}.main-content{padding:16px 12px}.user-menu-btn{gap:2px!important;padding:4px 6px!important}.user-menu-btn>div:first-child{width:32px!important;height:32px!important}.user-menu-btn svg{margin-left:0!important}.section-header h2{font-size:1.5rem}.section-header p{margin-bottom:12px;font-size:.9rem}.section-header[style]{gap:16px;flex-direction:column!important;align-items:stretch!important}.search-box{width:100%;margin-bottom:0!important}.grid-2col,.kpi-grid,.client-cards-grid,.weeks-grid,.form-row{gap:16px;grid-template-columns:1fr!important}.form-card,.preview-card,.client-card,.kpi-card{padding:20px}.modal-content{width:95%;max-height:95vh;margin:10px}.modal-header,.modal-body{padding:16px 20px}.responsive-table{display:block;border:0!important;width:100%!important}.responsive-table thead{display:none}.responsive-table tbody{width:100%;display:block}.responsive-table tr{border:1px solid var(--border-color);box-shadow:var(--shadow-sm);background:#fff;border-radius:12px;margin-bottom:16px;padding:8px 0;display:block}.responsive-table td{text-align:right!important;border-bottom:1px dashed var(--border-color)!important;justify-content:space-between!important;align-items:center!important;padding:12px 16px!important;display:flex!important}.responsive-table td:last-child{border-bottom:none!important}.responsive-table td:before{content:attr(data-label);color:var(--text-secondary);text-align:left;flex:1;margin-right:12px;font-weight:600}.responsive-table td>div,.responsive-table td>button{flex:2;justify-content:flex-end;display:flex}.responsive-table td>span{flex:2;display:flex;justify-content:center!important}.responsive-table td.td-cliente{flex-direction:column!important;align-items:flex-start!important}.responsive-table td.td-cliente:before{margin-bottom:8px}.responsive-table td.td-cliente>div{width:100%;justify-content:flex-start!important}}
