:root{--bg-primary: #0a0e1a;--bg-secondary: #111827;--bg-card: #1e293b;--bg-input: #0f172a;--text-primary: #f1f5f9;--text-secondary: #94a3b8;--accent-green: #34d399;--accent-yellow: #fbbf24;--accent-orange: #fb923c;--accent-red: #f87171;--accent-blue: #60a5fa;--accent-purple: #a78bfa;--border-color: rgba(148, 163, 184, .15);--shadow: 0 2px 8px rgba(0, 0, 0, .4);--radius: 12px;--radius-sm: 8px;--neon-green: 0 0 10px rgba(52, 211, 153, .5), 0 0 20px rgba(52, 211, 153, .3), 0 0 40px rgba(52, 211, 153, .2);--neon-blue: 0 0 10px rgba(96, 165, 250, .5), 0 0 20px rgba(96, 165, 250, .3), 0 0 40px rgba(96, 165, 250, .2);--neon-red: 0 0 10px rgba(248, 113, 113, .5), 0 0 20px rgba(248, 113, 113, .3)}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background-color:var(--bg-primary);color:var(--text-primary);min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{min-height:100vh}.loading-screen{display:flex;justify-content:center;align-items:center;min-height:100vh}.spinner{width:40px;height:40px;border:3px solid rgba(148,163,184,.2);border-top-color:var(--accent-green);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.auth-layout{display:flex;justify-content:center;align-items:center;min-height:100vh;padding:20px;background:linear-gradient(135deg,var(--bg-primary) 0%,var(--bg-secondary) 100%)}.auth-card{background:var(--bg-card);border-radius:var(--radius);padding:40px 30px;width:100%;max-width:400px;box-shadow:var(--shadow)}.auth-logo{text-align:center;margin-bottom:30px}.auth-logo img{max-width:80px;height:auto;margin-bottom:10px}.auth-logo h1{font-size:1.5rem;color:var(--text-primary)}.auth-logo p{color:var(--text-secondary);font-size:.9rem;margin-top:5px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:6px;font-size:.9rem;color:var(--text-secondary)}.form-group input,.form-group select,.form-group textarea{width:100%;padding:12px 16px;background:#0f172a99;border:1px solid rgba(148,163,184,.15);border-radius:var(--radius-sm);color:var(--text-primary);font-size:1rem;transition:all .3s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#34d399b3;box-shadow:0 0 15px #34d3994d}.form-group textarea{min-height:80px;resize:vertical}.form-error{color:var(--accent-red);font-size:.85rem;margin-top:5px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 24px;border:none;border-radius:var(--radius-sm);font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;text-decoration:none;min-height:48px;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:#60a5fa80;color:#fff;width:100%;box-shadow:0 0 15px #60a5fa4d}.btn-primary:hover:not(:disabled){background:#60a5fab3;box-shadow:var(--neon-blue);transform:translateY(-1px)}.btn-success{background:#34d39980;color:#fff;box-shadow:0 0 15px #34d3994d}.btn-success:hover:not(:disabled){background:#34d399b3;box-shadow:var(--neon-green);transform:translateY(-1px)}.btn-danger{background:#f8717180;color:#fff;box-shadow:0 0 15px #f871714d}.btn-danger:hover:not(:disabled){background:#f87171b3;box-shadow:var(--neon-red);transform:translateY(-1px)}.btn-outline{background:#1e293b80;border:1px solid rgba(148,163,184,.2);color:var(--text-primary);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.btn-outline:hover:not(:disabled){background:#60a5fa33;border-color:#60a5fa80;box-shadow:0 0 10px #60a5fa33;transform:translateY(-1px)}.btn-sm{padding:8px 16px;font-size:.85rem;min-height:36px}.btn-icon{width:40px;height:40px;padding:0;border-radius:50%}.panel-page{min-height:100vh;background:var(--bg-primary);padding:0}.panel-topbar{background:#1e293b80;border-bottom:1px solid rgba(148,163,184,.1);padding:16px 20px;display:flex;align-items:center;justify-content:space-between;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.panel-topbar-logo{display:flex;align-items:center;gap:10px}.panel-topbar-logo img{width:36px;height:36px;border-radius:8px}.panel-topbar-logo h1{font-size:1.2rem;font-weight:700}.logo-placeholder{width:36px;height:36px;background:var(--accent-green);border-radius:8px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.9rem;color:#fff}.panel-greeting{padding:30px 20px 10px}.panel-greeting h2{font-size:1.4rem;margin-bottom:4px}.panel-greeting p{color:var(--text-secondary);font-size:.95rem}.panel-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;padding:20px}.panel-card{background:#1e293b80;border:1px solid rgba(52,211,153,.2);border-radius:var(--radius);padding:24px 16px;display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;transition:all .3s ease;text-decoration:none;color:var(--text-primary);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 4px 20px #0000004d,inset 0 1px #ffffff0d}.panel-card:active{transform:scale(.97)}.panel-card:hover{transform:translateY(-4px);box-shadow:var(--neon-green);border-color:#34d39980}.panel-card-icon{width:60px;height:60px;border-radius:16px;display:flex;align-items:center;justify-content:center;font-size:1.8rem}.panel-card-label{font-size:1rem;font-weight:600}.panel-card-desc{font-size:.75rem;color:var(--text-secondary)}.panel-card-wide{grid-column:span 2;flex-direction:row;gap:16px;padding:20px}.panel-card-wide-text{display:flex;flex-direction:column;align-items:flex-start;gap:2px}.app-layout{display:flex;flex-direction:column;height:100vh;overflow:hidden}.sticky-top{flex-shrink:0;background:var(--bg-primary);border-bottom:1px solid var(--border-color);z-index:10}.sticky-top .app-content{padding-bottom:0}.scroll-area{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.scroll-area .app-content{padding-top:16px}.app-header{background:var(--bg-secondary);border-bottom:1px solid var(--border-color);padding:12px 20px;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:100}.app-header-left{display:flex;align-items:center;gap:12px}.app-header-left h1{font-size:1.1rem;font-weight:700}.back-btn{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--bg-card);border:none;border-radius:8px;color:var(--text-primary);font-size:1.2rem;text-decoration:none;cursor:pointer}.back-btn:hover{background:var(--border-color)}.app-header-logo{display:flex;align-items:center;gap:10px}.app-header-logo img{width:32px;height:32px;border-radius:6px}.app-header-logo h1{font-size:1.1rem;font-weight:700}.app-header-nav{display:flex;align-items:center;gap:8px}.app-content{flex:1;padding:20px;max-width:1200px;margin:0 auto;width:100%}.content-width{max-width:600px;margin:0 auto}.content-width .search-bar{margin-bottom:16px}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:20px}.stat-card{background:#1e293b80;border:1px solid rgba(148,163,184,.15);border-radius:var(--radius);padding:16px;text-align:center;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 4px 15px #0003,inset 0 1px #ffffff0d}.stat-card .stat-value{font-size:2rem;font-weight:700;margin-bottom:4px}.stat-card .stat-label{font-size:.8rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.stat-card.green .stat-value{color:var(--accent-green)}.stat-card.yellow .stat-value{color:var(--accent-yellow)}.stat-card.orange .stat-value{color:var(--accent-orange)}.stat-card.red .stat-value{color:var(--accent-red)}.stat-card.blue .stat-value{color:var(--accent-blue)}.filter-tabs{display:flex;gap:8px;margin-bottom:20px;overflow-x:auto;padding-bottom:4px;-webkit-overflow-scrolling:touch}.filter-tab{padding:8px 16px;border-radius:20px;border:1px solid rgba(148,163,184,.15);background:#1e293b80;color:var(--text-secondary);font-size:.85rem;cursor:pointer;white-space:nowrap;transition:all .3s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.filter-tab:hover{border-color:#34d39999;color:var(--text-primary);box-shadow:0 0 12px #34d3994d;transform:translateY(-1px)}.filter-tab.active{background:#34d39980;border-color:#34d399b3;color:#fff;box-shadow:0 0 15px #34d39966}.filter-tab.active:hover{box-shadow:0 0 20px #34d39980}.search-bar{margin-bottom:20px}.search-bar input{width:100%;padding:12px 16px 12px 44px;background:#0f172a99;border:1px solid rgba(148,163,184,.15);border-radius:var(--radius);color:var(--text-primary);font-size:1rem;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:all .3s ease}.search-bar input:focus{outline:none;border-color:#34d399b3;box-shadow:0 0 15px #34d3994d}.search-wrapper{position:relative}.search-icon{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--text-secondary);font-size:1.1rem}.clients-list{display:flex;flex-direction:column;gap:12px}.client-card{background:#1e293b80;border-radius:var(--radius);padding:16px;border-left:4px solid var(--border-color);transition:all .3s ease;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-right:1px solid rgba(148,163,184,.1);border-top:1px solid rgba(148,163,184,.1);border-bottom:1px solid rgba(148,163,184,.1);box-shadow:0 4px 15px #00000026,inset 0 1px #ffffff0d}.client-card:active{transform:scale(.98)}.client-card.status-pagado{border-left-color:var(--accent-green)}.client-card.status-pendiente{border-left-color:var(--accent-blue)}.client-card.status-por_vencer{border-left-color:var(--accent-yellow)}.client-card.status-en_gracia{border-left-color:var(--accent-orange)}.client-card.status-en_mora{border-left-color:var(--accent-red)}.client-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.client-card-name{font-size:1.1rem;font-weight:600}.client-card-status{padding:4px 10px;border-radius:12px;font-size:.75rem;font-weight:600;text-transform:uppercase}.status-pagado .client-card-status{background:#34d39926;color:var(--accent-green)}.status-pendiente .client-card-status{background:#60a5fa26;color:var(--accent-blue)}.status-por_vencer .client-card-status{background:#fbbf2426;color:var(--accent-yellow)}.status-en_gracia .client-card-status{background:#fb923c26;color:var(--accent-orange)}.status-en_mora .client-card-status{background:#f8717126;color:var(--accent-red)}.client-card-info{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.client-info-item{font-size:.85rem;color:var(--text-secondary)}.client-info-item strong{color:var(--text-primary);font-weight:600}.client-card-actions{display:flex;gap:8px}.client-card-actions .btn{flex:1}.clients-table-wrapper{display:none}.page-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;flex-wrap:wrap;gap:12px}.page-header h2{font-size:1.3rem}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000000b3;display:flex;justify-content:center;align-items:center;z-index:1000;padding:20px}.modal{background:#1e293bb3;border:1px solid rgba(52,211,153,.2);border-radius:var(--radius);padding:24px;width:100%;max-width:450px;max-height:90vh;backdrop-filter:blur(25px);-webkit-backdrop-filter:blur(25px);box-shadow:0 20px 60px #00000080,0 0 30px #34d3991a}.modal h3{margin-bottom:16px;font-size:1.2rem}.modal-actions{display:flex;gap:12px;margin-top:20px}.modal-actions .btn{flex:1}.empty-state{text-align:center;padding:60px 20px;color:var(--text-secondary)}.empty-state .empty-icon{font-size:3rem;margin-bottom:16px}.empty-state h3{color:var(--text-primary);margin-bottom:8px}.config-tabs{display:flex;gap:8px;margin-bottom:20px}.config-tab{flex:1;padding:10px;border:1px solid rgba(148,163,184,.15);border-radius:var(--radius);background:#1e293b80;color:var(--text-secondary);font-size:.95rem;font-weight:500;cursor:pointer;transition:all .3s ease;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.config-tab:hover{border-color:#34d39999;color:var(--text-primary);box-shadow:0 0 12px #34d3994d;transform:translateY(-1px)}.config-tab.active{background:#34d39980;color:#fff;border-color:#34d399b3;box-shadow:0 0 15px #34d39966}.config-tab.active:hover{box-shadow:0 0 20px #34d39980}.config-hint{color:var(--text-secondary);font-size:.85rem;margin-bottom:12px}.config-section{background:#1e293b80;border:1px solid rgba(148,163,184,.1);border-radius:var(--radius);padding:20px;margin-bottom:20px;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);box-shadow:0 4px 15px #00000026,inset 0 1px #ffffff0d}.config-section h3{margin-bottom:16px;padding-bottom:12px;border-bottom:1px solid var(--border-color)}.upload-area{border:2px dashed var(--border-color);border-radius:var(--radius-sm);padding:24px;text-align:center;cursor:pointer;transition:border-color .2s}.upload-area:hover{border-color:var(--accent-blue)}.upload-area input[type=file]{display:none}.upload-preview{max-width:120px;max-height:120px;margin:0 auto 12px;border-radius:var(--radius-sm)}.toggle-switch{position:relative;display:inline-block;width:48px;height:26px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background:var(--accent-red);border-radius:26px;transition:.3s}.toggle-slider:before{content:"";position:absolute;height:20px;width:20px;left:3px;bottom:3px;background:#fff;border-radius:50%;transition:.3s}.toggle-switch input:checked+.toggle-slider{background:var(--accent-green)}.toggle-switch input:checked+.toggle-slider:before{transform:translate(22px)}.toggle-switch input:disabled+.toggle-slider{opacity:.7;cursor:default}.toggle-label{font-size:.85rem;font-weight:600;min-width:60px}.control-list{display:flex;flex-direction:column;gap:8px}.control-card{background:#1e293b80;border-radius:var(--radius-sm);padding:12px 14px;border-left:4px solid var(--border-color);transition:all .3s ease;backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-right:1px solid rgba(148,163,184,.1);border-top:1px solid rgba(148,163,184,.1);border-bottom:1px solid rgba(148,163,184,.1);box-shadow:0 4px 15px #00000026,inset 0 1px #ffffff0d}border-left: 4px solid var(--border-color); } .control-card.status-pagado{border-left-color:var(--accent-green)}.control-card-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.control-card-row+.control-card-row{margin-top:8px;padding-top:8px;border-top:1px solid var(--border-color)}.control-card-info{display:flex;flex-direction:column;min-width:0;flex:1}.control-card-name{font-size:.95rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.control-card-app{font-size:.75rem;color:var(--text-secondary)}.control-card-badge{padding:3px 8px;border-radius:10px;font-size:.65rem;font-weight:600;text-transform:uppercase;white-space:nowrap;flex-shrink:0}.control-detail-inline{display:flex;align-items:center;gap:4px}.control-detail-inline .control-detail-label{font-size:.7rem;color:var(--text-secondary)}.control-detail-inline .control-detail-value{font-size:.85rem;font-weight:600}.control-card-toggle{display:flex;align-items:center;gap:6px}.control-history-btn{color:var(--accent-blue);text-decoration:none;font-size:.8rem;white-space:nowrap}.control-history-btn:hover{text-decoration:underline}.control-table-wrapper{display:none}.control-card{background:#1e293b80;border-radius:var(--radius);padding:16px;border-left:4px solid var(--border-color);backdrop-filter:blur(15px);-webkit-backdrop-filter:blur(15px);border-right:1px solid rgba(148,163,184,.1);border-top:1px solid rgba(148,163,184,.1);border-bottom:1px solid rgba(148,163,184,.1);box-shadow:0 4px 15px #00000026,inset 0 1px #ffffff0d}.control-card.status-pagado{border-left-color:var(--accent-green)}.control-card.status-pendiente{border-left-color:var(--accent-blue)}.control-card.status-por_vencer{border-left-color:var(--accent-yellow)}.control-card.status-en_gracia{border-left-color:var(--accent-orange)}.control-card.status-en_mora{border-left-color:var(--accent-red)}.control-card-top{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:12px}.control-card-info{display:flex;flex-direction:column;gap:2px}.control-card-name{font-size:1.05rem;font-weight:600}.control-card-app{font-size:.8rem;color:var(--text-secondary)}.control-card-badge{padding:4px 10px;border-radius:12px;font-size:.7rem;font-weight:600;text-transform:uppercase}.control-card-badge.status-pagado{background:#34d39926;color:var(--accent-green)}.control-card-badge.status-pendiente{background:#60a5fa26;color:var(--accent-blue)}.control-card-badge.status-por_vencer{background:#fbbf2426;color:var(--accent-yellow)}.control-card-badge.status-en_gracia{background:#fb923c26;color:var(--accent-orange)}.control-card-badge.status-en_mora{background:#f8717126;color:var(--accent-red)}.control-card-details{display:flex;gap:16px;margin-bottom:14px;flex-wrap:wrap}.control-detail{display:flex;flex-direction:column;gap:2px}.control-detail-label{font-size:.7rem;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.control-detail-value{font-size:.95rem;font-weight:600}.control-card-actions{display:flex;align-items:center;gap:12px;padding-top:12px;border-top:1px solid var(--border-color)}.control-history-btn{margin-left:auto;padding:6px 12px;border-radius:var(--radius-sm);text-decoration:none;color:var(--text-secondary);font-size:.8rem;border:1px solid var(--border-color);transition:all .2s}.control-history-btn:hover{color:var(--text-primary);border-color:var(--accent-blue)}@media (min-width: 768px){.panel-grid{grid-template-columns:repeat(4,1fr);max-width:700px;margin:0 auto}.panel-card-wide{grid-column:span 4}.app-header{padding:12px 30px}.app-content{padding:30px}}@media (min-width: 1024px){.app-content{padding:40px}.panel-grid{max-width:900px}.control-list{max-width:800px}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}.text-green{color:var(--accent-green)}.text-yellow{color:var(--accent-yellow)}.text-orange{color:var(--accent-orange)}.text-red{color:var(--accent-red)}.text-blue{color:var(--accent-blue)}.mt-1{margin-top:8px}.mt-2{margin-top:16px}.mb-1{margin-bottom:8px}.mb-2{margin-bottom:16px}.toast-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:10000;display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}.toast{padding:14px 24px;border-radius:var(--radius);color:#fff;font-size:.9rem;font-weight:500;box-shadow:0 8px 30px #0006;animation:toast-in .3s ease,toast-out .3s ease 2.7s forwards;pointer-events:auto;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15)}.toast-success{background:#34d39999;box-shadow:0 0 20px #34d39966}.toast-error{background:#f8717199;box-shadow:0 0 20px #f8717166}.toast-info{background:#60a5fa99;box-shadow:0 0 20px #60a5fa66}@keyframes toast-in{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes toast-out{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}