:root{--primary:#1a1a2e;--primary-light:#2d2d5e;--accent:#e94560;--accent-light:#ff6b81;--bg:#f8f9fe;--bg-card:#fff;--fg:#1f2937;--muted:#6b7280;--border:#e5e7eb;--success:#10b981;--danger:#ef4444;--warning:#f59e0b;--shadow-sm:0 1px 3px #00000014;--shadow-md:0 4px 12px #0000001a;--shadow-lg:0 8px 30px #0000001f;--radius:12px;--radius-sm:8px;--radius-lg:16px;--font:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;--transition:.2s ease}*,:before,:after{box-sizing:border-box}html,body{font-family:var(--font);color:var(--fg);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;padding:0;line-height:1.5}#root{flex-direction:column;min-height:100vh;display:flex}a{color:var(--accent);transition:var(--transition);text-decoration:none}a:hover{text-decoration:underline}button{font:inherit;cursor:pointer;transition:var(--transition);background:0 0;border:none}button:disabled{cursor:not-allowed;opacity:.5}input,select,textarea{font:inherit;border:1.5px solid var(--border);border-radius:var(--radius-sm);width:100%;transition:var(--transition);background:#fff;outline:none;padding:.65rem .85rem}input:focus,select:focus,textarea:focus{border-color:var(--accent);box-shadow:0 0 0 3px #e9456026}h1{letter-spacing:-.02em;font-size:1.6rem;font-weight:800}h2{font-size:1.2rem;font-weight:700}h3{font-size:1rem;font-weight:600}.container{width:100%;max-width:720px;margin:0 auto;padding:1.5rem 1rem}.container-wide{width:100%;max-width:960px;margin:0 auto;padding:1.5rem 1rem}.page-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:1.5rem;display:flex}.page-header h1{margin:0}.page-actions{gap:.5rem;display:flex}.card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:var(--transition);padding:1.25rem}.card:hover{box-shadow:var(--shadow-md)}.card-header{justify-content:space-between;align-items:center;margin-bottom:1rem;display:flex}.card-header h2{margin:0}.btn-primary{background:linear-gradient(135deg, var(--primary), var(--primary-light));color:#fff;border-radius:var(--radius-sm);transition:var(--transition);align-items:center;gap:.4rem;padding:.7rem 1.5rem;font-size:.9rem;font-weight:600;display:inline-flex;box-shadow:0 2px 8px #1a1a2e40}.btn-primary:hover{text-decoration:none;transform:translateY(-1px);box-shadow:0 4px 12px #1a1a2e59}.btn-secondary{background:var(--bg);color:var(--fg);border-radius:var(--radius-sm);border:1.5px solid var(--border);transition:var(--transition);align-items:center;gap:.4rem;padding:.7rem 1.5rem;font-size:.9rem;font-weight:500;display:inline-flex}.btn-secondary:hover{border-color:var(--accent);color:var(--accent);text-decoration:none}.btn-ghost{border-radius:var(--radius-sm);color:var(--muted);transition:var(--transition);align-items:center;gap:.3rem;padding:.45rem .85rem;font-size:.85rem;font-weight:500;display:inline-flex}.btn-ghost:hover{background:var(--bg);color:var(--fg);text-decoration:none}.btn-sm{padding:.35rem .65rem;font-size:.8rem}.btn-xs{padding:.25rem .45rem;font-size:.75rem}.form-group{margin-bottom:1rem}.form-group label{color:var(--fg);margin-bottom:.35rem;font-size:.85rem;font-weight:600;display:block}.form-grid{grid-template-columns:1fr 1fr;gap:.85rem;display:grid}@media (max-width:600px){.form-grid{grid-template-columns:1fr}}.form-field{flex-direction:column;gap:.25rem;display:flex}.form-field span{color:var(--muted);text-transform:uppercase;letter-spacing:.03em;font-size:.8rem;font-weight:600}.form-error{color:var(--danger);border-radius:var(--radius-sm);background:#fef2f2;margin-top:.5rem;padding:.5rem .75rem;font-size:.85rem}.form-actions{justify-content:flex-end;margin-top:1.5rem;display:flex}.form-actions .btn-primary{width:auto;padding:.7rem 2rem}.banner-error{color:var(--danger);border-radius:var(--radius-sm);border-left:4px solid var(--danger);background:#fef2f2;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.banner-success{color:#065f46;border-radius:var(--radius-sm);border-left:4px solid var(--success);background:#ecfdf5;margin-bottom:1rem;padding:.75rem 1rem;font-size:.9rem}.table-responsive{overflow-x:auto}.table{border-collapse:collapse;width:100%;font-size:.85rem}.table th{text-align:left;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);border-bottom:2px solid var(--border);padding:.6rem .75rem;font-size:.75rem;font-weight:600}.table td{border-bottom:1px solid var(--border);padding:.6rem .75rem}.table tbody tr:hover{background:var(--bg)}.badge{text-transform:uppercase;letter-spacing:.02em;border-radius:20px;padding:.2rem .55rem;font-size:.75rem;font-weight:600;display:inline-block}.badge-basico{color:#4f46e5;background:#eef2ff}.badge-premium{color:#d97706;background:#fef3c7}.badge-activo{color:#059669;background:#ecfdf5}.badge-suspendido{color:#dc2626;background:#fef2f2}.badge-RESERVADA{color:#b45309;background:#fef3c7}.badge-CONFIRMADA{color:#1d4ed8;background:#dbeafe}.badge-COMPLETADA{color:#059669;background:#ecfdf5}.badge-CANCELADA{color:#dc2626;background:#fef2f2}.text-muted{color:var(--muted)}.text-center{text-align:center}.mt-1{margin-top:.5rem}.mt-2{margin-top:1rem}.mb-1{margin-bottom:.5rem}.mb-2{margin-bottom:1rem}.loading{min-height:200px;color:var(--muted);justify-content:center;align-items:center;font-size:.9rem;display:flex}.loading:after{content:"";border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:20px;height:20px;margin-left:.5rem;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.search-bar{margin-bottom:1rem}.input-search{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24' stroke='%236b7280'%3E%3Cpath stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M21 21l-6-6m2-5a7 7 0 11-14 0 7 7 0 0114 0z'/%3E%3C/svg%3E");background-position:12px;background-repeat:no-repeat;background-size:16px;width:100%;max-width:360px;padding:.6rem 1rem .6rem 2.2rem}.dashboard-nav{flex-wrap:wrap;gap:.5rem;margin-top:1.5rem;display:flex}.dashboard-nav .btn-ghost{border:1.5px solid var(--border)}.dashboard-nav .btn-ghost:hover{border-color:var(--accent);color:var(--accent)}.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;display:grid}.stat-card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);transition:var(--transition);text-align:center;padding:1.25rem}.stat-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.stat-card:first-child{color:#fff;background:linear-gradient(135deg,#1a1a2e,#2d2d5e)}.stat-card:nth-child(2){color:#fff;background:linear-gradient(135deg,#e94560,#ff6b81)}.stat-card:nth-child(3){color:#fff;background:linear-gradient(135deg,#10b981,#34d399)}.stat-card:nth-child(4){color:#fff;background:linear-gradient(135deg,#f59e0b,#fbbf24)}.stat-card:nth-child(5){background:var(--bg-card)}.stat-card:nth-child(5) .stat-number{color:var(--danger)}.stat-icon{margin-bottom:.25rem;font-size:1.5rem}.stat-number{font-size:1.8rem;font-weight:800;line-height:1}.stat-label{opacity:.85;margin-top:.25rem;font-size:.8rem}.stat-card-clickable{cursor:pointer}.stat-card-clickable:hover{box-shadow:var(--shadow-md)}.cancellation-list{text-align:left;margin-top:.75rem}.cancellation-item{border-bottom:1px solid var(--border);justify-content:space-between;padding:.35rem 0;font-size:.8rem;display:flex}.cancellation-item:last-child{border:none}.cancellation-client{font-weight:600}.progress-bar{background:#ffffff4d;border-radius:3px;height:6px;margin-top:.5rem}.progress-fill{background:#fffc;border-radius:3px;height:100%;transition:width .5s}.booking-hero{text-align:center;background:linear-gradient(135deg, var(--primary), var(--primary-light));border-radius:0 0 var(--radius-lg) var(--radius-lg);color:#fff;margin:-1.5rem -1rem 1.5rem;padding:2rem 0 1.5rem}.booking-hero h1{color:#fff;margin:0 0 .25rem;font-size:1.4rem}.booking-hero .salon-logo{object-fit:cover;border:3px solid #ffffff4d;border-radius:50%;width:64px;height:64px;margin-bottom:.5rem}.booking-hero .salon-meta{opacity:.8;font-size:.85rem}.step-indicator{justify-content:center;gap:.25rem;margin-bottom:.5rem;padding:.5rem 0;display:flex}.step-dot{background:var(--border);width:8px;height:8px;transition:var(--transition);border-radius:50%}.step-dot.active{background:var(--accent);border-radius:4px;width:24px}.step-dot.done{background:var(--success)}.service-grid{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}@media (max-width:480px){.service-grid{grid-template-columns:1fr}}.service-card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);cursor:pointer;transition:var(--transition);border:2px solid #0000;padding:1rem;position:relative}.service-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.service-card.selected,.service-card--selected{border-color:var(--accent);box-shadow:0 0 0 3px #e9456026}.service-card .svc-name{font-size:.95rem;font-weight:700}.service-card .svc-price{color:var(--accent);margin-top:.25rem;font-size:1.1rem;font-weight:800}.service-card .svc-duration{color:var(--muted);font-size:.8rem}.employee-grid{grid-template-columns:1fr 1fr;gap:.75rem;display:grid}@media (max-width:480px){.employee-grid{grid-template-columns:1fr}}.employee-card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-sm);cursor:pointer;transition:var(--transition);text-align:center;border:2px solid #0000;padding:1rem}.employee-card:hover{box-shadow:var(--shadow-md)}.employee-card.selected{border-color:var(--accent);background:#fef2f3}.employee-card .emp-avatar{margin-bottom:.25rem;font-size:2rem}.employee-card .emp-name{font-size:.9rem;font-weight:600}.employee-card .emp-role{color:var(--muted);font-size:.75rem}.slot-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:.5rem;display:grid}.slot-btn{text-align:center;border-radius:var(--radius-sm);border:1.5px solid var(--border);background:var(--bg-card);cursor:pointer;transition:var(--transition);padding:.5rem;font-size:.85rem;font-weight:500}.slot-btn:hover{border-color:var(--accent);color:var(--accent)}.slot-btn.selected,.slot-btn--selected{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 2px 8px #e945604d}.confirmation-card{text-align:center;padding:2rem 1rem}.confirmation-card .check-icon{background:linear-gradient(135deg, var(--success), #34d399);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:56px;height:56px;margin:0 auto 1rem;font-size:1.8rem;animation:.3s pop;display:flex}@keyframes pop{0%{transform:scale(0)}50%{transform:scale(1.15)}to{transform:scale(1)}}.confirmation-card .booking-summary{text-align:left;background:var(--bg);border-radius:var(--radius-sm);margin:1rem 0;padding:1rem}.confirmation-card .booking-summary div{justify-content:space-between;padding:.35rem 0;display:flex}.confirmation-card .booking-summary .label{color:var(--muted);font-size:.8rem}.date-input{border-radius:var(--radius-sm);border:1.5px solid var(--border);text-align:center;width:100%;transition:var(--transition);padding:.65rem;font-size:1rem}.date-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px #e9456026}.day-tabs{-webkit-overflow-scrolling:touch;gap:.35rem;margin-bottom:1rem;padding-bottom:.35rem;display:flex;overflow-x:auto}.day-tabs button{border:1.5px solid var(--border);background:var(--bg-card);transition:var(--transition);border-radius:20px;flex-shrink:0;padding:.5rem .85rem;font-size:.8rem;font-weight:600}.day-tabs button:hover{border-color:var(--accent)}.day-tabs .btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.day-tabs .btn-primary:hover{background:var(--accent-light);border-color:var(--accent-light)}.day-section{margin-bottom:1.5rem}.day-section h2{color:var(--fg);margin-bottom:.75rem;font-size:1.1rem}.reservation-list{flex-direction:column;gap:.5rem;margin:0;padding:0;list-style:none;display:flex}.reservation-item{background:var(--bg-card);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);transition:var(--transition);justify-content:space-between;align-items:center;gap:.5rem;padding:.75rem 1rem;display:flex}.reservation-item:hover{box-shadow:var(--shadow-md)}.reservation-info{flex:1;min-width:0}.reservation-datetime{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.reservation-datetime strong{font-size:1rem}.settings-section{margin-bottom:1rem}.settings-section h2{margin-bottom:.75rem;font-size:1rem}.color-picker-row{align-items:center;gap:.75rem;display:flex}.color-picker-row input[type=color]{border:1px solid var(--border);cursor:pointer;border-radius:.25rem;width:40px;height:32px;padding:2px}.color-value{color:var(--muted);font-family:SF Mono,Menlo,monospace;font-size:.85rem}.logo-preview{border-radius:.25rem;max-height:48px;margin-top:.35rem}.qr-section{flex-wrap:wrap;align-items:center;gap:2rem;display:flex}.qr-display{flex-shrink:0}.qr-image{border:2px solid var(--border);border-radius:var(--radius);background:#fff;width:200px;height:200px;padding:.5rem}.qr-placeholder{background:var(--bg);border-radius:var(--radius);width:200px;height:200px;color:var(--muted);justify-content:center;align-items:center;font-size:.85rem;display:flex}.qr-info{flex:1;min-width:200px}.qr-label{margin-bottom:.25rem;font-weight:600}.qr-url{color:var(--accent);word-break:break-all;margin-bottom:.5rem;font-family:SF Mono,Menlo,monospace;font-size:1.1rem;display:block}.qr-hint{color:var(--muted);margin-bottom:.75rem;font-size:.85rem}.qr-actions{gap:.5rem;display:flex}.slug-row{align-items:center;gap:.5rem;display:flex}.slug-row input{flex:1}.field-hint{color:var(--muted);margin-top:.25rem;font-size:.8rem;display:block}.field-error{color:var(--danger);margin-top:.25rem;font-size:.8rem;font-weight:500;display:block}.salon-header{text-align:center;background:var(--primary);color:#fff;border-radius:var(--radius);margin-bottom:1rem;padding:1.5rem 1rem}.salon-header__inner{max-width:400px;margin:0 auto}.salon-header__logo{object-fit:cover;border:3px solid #ffffff4d;border-radius:50%;width:64px;height:64px;margin-bottom:.5rem}.salon-header__name{color:#fff;margin:0 0 .25rem;font-size:1.2rem}.salon-header__address{opacity:.7;margin:0;font-size:.85rem}.salon-header__code{opacity:.5;margin:.25rem 0 0;font-size:.75rem}.chip-row{flex-wrap:wrap;gap:.5rem;margin-bottom:1rem;display:flex}.chip{border:1.5px solid var(--border);background:var(--bg-card);cursor:pointer;transition:var(--transition);border-radius:20px;align-items:center;gap:.35rem;padding:.5rem 1rem;font-size:.85rem;font-weight:500;display:inline-flex}.chip:hover{border-color:var(--accent)}.chip--selected{background:var(--accent);color:#fff;border-color:var(--accent)}.form-checkbox{cursor:pointer;align-items:center;gap:.5rem;font-size:.85rem;display:flex}.form-checkbox input[type=checkbox]{width:auto}.schedule-grid{flex-direction:column;gap:.5rem;display:flex}.schedule-row{border-radius:var(--radius-sm);background:var(--bg);flex-wrap:wrap;align-items:center;gap:.75rem;padding:.5rem;display:flex}.schedule-day{min-width:64px;font-size:.85rem;font-weight:600}.schedule-checkbox{align-items:center;gap:.35rem;font-size:.8rem;display:flex}.schedule-checkbox input{width:auto}.schedule-time{align-items:center;gap:.35rem;font-size:.8rem;display:flex}.schedule-time span{color:var(--muted);font-size:.75rem}.schedule-time input[type=time]{border:1px solid var(--border);border-radius:.35rem;width:auto;padding:.3rem .5rem;font-size:.85rem}.schedule-closed{opacity:.5}.admin-detail{margin-top:1rem}.admin-detail-grid{grid-template-columns:1fr 2fr;gap:1.5rem;display:grid}@media (max-width:768px){.admin-detail-grid{grid-template-columns:1fr}}.admin-detail-info p{margin:.35rem 0;font-size:.9rem}.admin-detail-info code{background:var(--bg);border-radius:.25rem;padding:.15rem .4rem;font-size:.85rem}.admin-detail-empleados{margin-top:1.5rem}.row-selected{background:var(--bg)!important}.login-wrapper{background:linear-gradient(135deg, var(--primary), var(--primary-light));justify-content:center;align-items:center;min-height:100vh;padding:1rem;display:flex}.login-card{border-radius:var(--radius-lg);width:100%;max-width:400px;box-shadow:var(--shadow-lg);background:#fff;padding:2rem}.login-card h1{text-align:center;margin-bottom:.25rem}.login-card .subtitle{text-align:center;color:var(--muted);margin-bottom:1.5rem;font-size:.85rem}.login-card .form-group label{text-transform:uppercase;letter-spacing:.04em;font-size:.75rem}.login-card .btn-primary{justify-content:center;width:100%}.home-hero{text-align:center;background:linear-gradient(135deg, var(--primary), var(--primary-light));color:#fff;margin:-1.5rem -1rem 1.5rem;padding:3rem 1rem 2rem}.home-hero h1{color:#fff;margin-bottom:.25rem;font-size:1.8rem}.home-hero p{opacity:.85;max-width:400px;margin:0 auto 1.5rem;font-size:.95rem}.code-input-group{gap:.5rem;max-width:360px;margin:0 auto;display:flex}.code-input-group input{text-align:center;letter-spacing:.15em;text-transform:uppercase;flex:1;padding:.75rem;font-size:1.1rem}.code-input-group button{flex-shrink:0}.home-features{grid-template-columns:repeat(3,1fr);gap:.75rem;margin-top:1rem;display:grid}@media (max-width:600px){.home-features{grid-template-columns:1fr}}.home-feature{text-align:center;border-radius:var(--radius);background:var(--bg-card);box-shadow:var(--shadow-sm);padding:1.25rem}.home-feature .icon{margin-bottom:.35rem;font-size:2rem}.home-feature .title{font-size:.85rem;font-weight:600}.home-feature .desc{color:var(--muted);margin-top:.15rem;font-size:.8rem}.home-login-link{text-align:center;margin-top:1.5rem;padding:1rem}.home-login-link a{font-weight:600}.phone-input-group{gap:.5rem;max-width:360px;margin-bottom:1rem;display:flex}.phone-input-group input{flex:1}.phone-input-group button{flex-shrink:0}.cita-card{background:var(--bg-card);border-radius:var(--radius-sm);box-shadow:var(--shadow-sm);transition:var(--transition);justify-content:space-between;align-items:center;gap:.5rem;margin-bottom:.5rem;padding:.75rem 1rem;display:flex}.cita-card:hover{box-shadow:var(--shadow-md)}.cita-card .cita-info{flex:1}.cita-card .cita-info .cita-service{font-size:.9rem;font-weight:600}.cita-card .cita-info .cita-meta{color:var(--muted);font-size:.8rem}.cita-card .cita-info .cita-meta span+span:before{content:" · "}@media (max-width:480px){h1{font-size:1.3rem}.container,.container-wide{padding:1rem .75rem}.dashboard-grid{grid-template-columns:1fr 1fr}.stat-number{font-size:1.4rem}.service-grid{grid-template-columns:1fr}}
