:root{--primary-dark: #05668D;--primary-medium: #028090;--primary-teal: #00A896;--primary-light: #02C39A;--accent-orange: #F4A261;--accent-gold: #E9C46A;--bg-main: #EEF8F8;--bg-card: rgba(255, 255, 255, .92);--bg-card-hover: #FFFFFF;--text-dark: #1E293B;--text-muted: #64748B;--text-light: #F8FAFC;--border-color: #CBD5E1;--border-glow: rgba(0, 168, 150, .35);--radius-sm: 8px;--radius-md: 14px;--radius-lg: 22px;--radius-full: 9999px;--shadow-sm: 0 2px 8px rgba(5, 102, 141, .06);--shadow-md: 0 8px 24px rgba(5, 102, 141, .12);--shadow-lg: 0 16px 36px rgba(5, 102, 141, .18);--font-heading: "Raleway", "Outfit", sans-serif;--font-body: "Outfit", "Inter", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-body);background-color:var(--bg-main);background-image:radial-gradient(circle at 10% 20%,rgba(2,195,154,.12) 0%,transparent 40%),radial-gradient(circle at 90% 80%,rgba(5,102,141,.15) 0%,transparent 45%);color:var(--text-dark);min-height:100vh;line-height:1.6;-webkit-font-smoothing:antialiased}.app-container{max-width:1100px;margin:0 auto;padding:20px 16px 60px}.app-header{background:linear-gradient(135deg,var(--primary-dark),var(--primary-medium));color:#fff;padding:20px 30px;border-radius:var(--radius-lg);box-shadow:var(--shadow-md);margin-bottom:28px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:16px;position:relative;overflow:hidden}.app-header:after{content:"🐾";position:absolute;right:-10px;bottom:-20px;font-size:110px;opacity:.08;pointer-events:none}.brand-title{display:flex;align-items:center;gap:12px}.brand-icon{background:#fff3;width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.brand-text h1{font-family:var(--font-heading);font-size:1.6rem;font-weight:800;letter-spacing:.5px;text-transform:uppercase}.brand-text p{font-size:.88rem;opacity:.9;font-weight:400}.admin-toggle-btn{background:#ffffff26;border:1px solid rgba(255,255,255,.3);color:#fff;padding:8px 16px;border-radius:var(--radius-full);font-family:var(--font-body);font-weight:600;font-size:.85rem;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .2s ease}.admin-toggle-btn:hover{background:#ffffff47;transform:translateY(-1px)}.admin-toggle-btn.active{background:var(--accent-orange);border-color:var(--accent-orange);color:#fff}.stepper-container{display:flex;justify-content:space-between;margin-bottom:32px;position:relative;padding:0 10px}.stepper-progress-line{position:absolute;top:20px;left:40px;right:40px;height:4px;background:#e2e8f0;z-index:1}.stepper-progress-active{height:100%;background:linear-gradient(90deg,var(--primary-medium),var(--primary-teal));transition:width .3s ease}.step-item{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer}.step-bubble{width:42px;height:42px;border-radius:50%;background:#fff;border:3px solid #CBD5E1;color:var(--text-muted);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.95rem;transition:all .25s ease}.step-item.active .step-bubble{border-color:var(--primary-teal);background:var(--primary-teal);color:#fff;box-shadow:0 0 0 5px #00a89633}.step-item.completed .step-bubble{border-color:var(--primary-medium);background:var(--primary-medium);color:#fff}.step-label{font-size:.82rem;font-weight:600;color:var(--text-muted);text-align:center}.step-item.active .step-label{color:var(--primary-dark);font-weight:700}.glass-card{background:var(--bg-card);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.8);border-radius:var(--radius-lg);padding:28px;box-shadow:var(--shadow-md);margin-bottom:24px}.section-title{font-family:var(--font-heading);font-size:1.4rem;font-weight:700;color:var(--primary-dark);margin-bottom:8px;display:flex;align-items:center;gap:10px}.section-subtitle{color:var(--text-muted);font-size:.95rem;margin-bottom:24px}.services-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.service-card{background:#fff;border:2px solid #E2E8F0;border-radius:var(--radius-md);padding:22px;cursor:pointer;transition:all .25s cubic-bezier(.4,0,.2,1);position:relative;display:flex;flex-direction:column;justify-content:space-between}.service-card:hover{border-color:var(--primary-teal);transform:translateY(-4px);box-shadow:var(--shadow-md)}.service-card.selected{border-color:var(--primary-teal);background:#f0fdf4;box-shadow:0 0 0 2px var(--primary-teal),var(--shadow-md)}.service-top-bar{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;gap:8px;flex-wrap:wrap}.service-category-tag{font-size:.78rem;color:var(--primary-medium);font-weight:700;text-transform:uppercase;letter-spacing:.5px}.service-badge{background:var(--primary-dark);color:#fff;font-size:.72rem;font-weight:700;padding:4px 10px;border-radius:var(--radius-full);text-transform:uppercase;white-space:nowrap;margin-left:auto}.service-header{display:flex;align-items:flex-start;gap:14px;margin-bottom:12px}.service-icon-box{width:48px;height:48px;border-radius:var(--radius-sm);background:#e6fffa;color:var(--primary-teal);display:flex;align-items:center;justify-content:center;flex-shrink:0}.service-card.selected .service-icon-box{background:var(--primary-teal);color:#fff}.service-name{font-family:var(--font-heading);font-size:1.15rem;font-weight:700;color:var(--text-dark);line-height:1.3}.service-desc{font-size:.9rem;color:var(--text-muted);margin-bottom:16px}.service-footer{display:flex;justify-content:space-between;align-items:center;padding-top:12px;border-top:1px solid #F1F5F9}.service-duration{display:flex;align-items:center;gap:6px;font-size:.85rem;color:var(--text-muted);font-weight:500}.service-price{font-size:1.25rem;font-weight:800;color:var(--primary-dark)}.calendar-layout{display:grid;grid-template-columns:1fr 1fr;gap:28px}@media(max-width:768px){.calendar-layout{grid-template-columns:1fr}}.custom-calendar{background:#fff;border-radius:var(--radius-md);padding:20px;border:1px solid #E2E8F0}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calendar-month-title{font-family:var(--font-heading);font-weight:700;font-size:1.1rem;color:var(--primary-dark)}.calendar-nav-btn{background:#f1f5f9;border:none;width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .2s}.calendar-nav-btn:hover{background:#e2e8f0}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-weight:600;font-size:.8rem;color:var(--text-muted);margin-bottom:10px}.calendar-days-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.calendar-day-cell{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:var(--radius-sm);border:1px solid transparent;background:#f8fafc;font-weight:600;font-size:.9rem;cursor:pointer;transition:all .2s;position:relative}.calendar-day-cell:hover:not(.disabled){background:#e6fffa;border-color:var(--primary-teal);color:var(--primary-dark)}.calendar-day-cell.selected{background:var(--primary-teal);color:#fff;font-weight:700}.calendar-day-cell.disabled{opacity:.35;cursor:not-allowed;background:#f1f5f9}.calendar-day-cell.today{border-color:var(--primary-dark)}.time-slots-container h4{font-family:var(--font-heading);font-size:1rem;color:var(--primary-dark);margin-bottom:12px}.time-slots-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(95px,1fr));gap:10px;max-height:280px;overflow-y:auto;padding-right:4px}.time-slot-btn{background:#fff;border:1px solid #CBD5E1;padding:10px 8px;border-radius:var(--radius-sm);font-family:var(--font-body);font-weight:600;font-size:.88rem;cursor:pointer;transition:all .2s;text-align:center}.time-slot-btn:hover:not(.booked){border-color:var(--primary-teal);color:var(--primary-teal);background:#f0fdf4}.time-slot-btn.selected{background:var(--primary-dark);color:#fff;border-color:var(--primary-dark);box-shadow:0 4px 12px #05668d40}.time-slot-btn.booked{background:#f1f5f9;color:#94a3b8;border-color:#e2e8f0;text-decoration:line-through;cursor:not-allowed}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}@media(max-width:640px){.form-grid{grid-template-columns:1fr}}.form-group{display:flex;flex-direction:column;gap:6px}.form-group.full-width{grid-column:1 / -1}.form-label{font-size:.88rem;font-weight:600;color:var(--text-dark);display:flex;align-items:center;gap:6px}.form-input,.form-select,.form-textarea{width:100%;padding:12px 14px;border-radius:var(--radius-sm);border:1px solid #CBD5E1;font-family:var(--font-body);font-size:.95rem;background:#fff;transition:border-color .2s,box-shadow .2s}.form-input:focus,.form-select:focus,.form-textarea:focus{outline:none;border-color:var(--primary-teal);box-shadow:0 0 0 3px #00a89626}.payment-box{background:#fff;border:2px solid var(--primary-teal);border-radius:var(--radius-md);padding:24px;margin-top:16px}.payment-type-selector{display:flex;gap:12px;margin-bottom:20px}.payment-option-btn{flex:1;padding:14px;border:2px solid #E2E8F0;border-radius:var(--radius-sm);background:#fff;cursor:pointer;text-align:center;font-weight:600;transition:all .2s}.payment-option-btn.selected{border-color:var(--primary-dark);background:#f0f9ff;color:var(--primary-dark)}.credit-card-mock{background:linear-gradient(135deg,#1e293b,#0f172a);color:#fff;border-radius:var(--radius-md);padding:20px;margin-bottom:20px;box-shadow:0 10px 20px #00000026;position:relative;overflow:hidden}.credit-card-chip{width:38px;height:28px;background:linear-gradient(135deg,#f59e0b,#fbbf24);border-radius:4px;margin-bottom:20px}.card-number-preview{font-family:monospace;font-size:1.25rem;letter-spacing:2px;margin-bottom:16px}.card-details-row{display:flex;justify-content:space-between;font-size:.8rem;text-transform:uppercase;letter-spacing:1px}.buttons-row{display:flex;justify-content:space-between;align-items:center;margin-top:28px;gap:16px}.btn{padding:12px 24px;border-radius:var(--radius-full);font-family:var(--font-body);font-weight:700;font-size:.95rem;cursor:pointer;border:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:all .25s ease;text-decoration:none}.btn-primary{background:linear-gradient(135deg,var(--primary-medium),var(--primary-teal));color:#fff;box-shadow:0 4px 14px #00a89659}.btn-primary:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px #00a89673}.btn-secondary{background:#e2e8f0;color:var(--text-dark)}.btn-secondary:hover{background:#cbd5e1}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none!important}.summary-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #E2E8F0;font-size:.95rem}.summary-label{color:var(--text-muted);font-weight:500}.summary-value{font-weight:700;color:var(--text-dark)}.summary-total{display:flex;justify-content:space-between;padding:18px 0;margin-top:10px;border-top:2px solid var(--primary-teal);font-size:1.2rem;font-weight:800;color:var(--primary-dark)}.admin-table{width:100%;border-collapse:collapse;margin-top:16px;font-size:.9rem}.admin-table th{background:#f1f5f9;text-align:left;padding:12px 16px;color:var(--primary-dark);font-weight:700;border-bottom:2px solid #CBD5E1}.admin-table td{padding:12px 16px;border-bottom:1px solid #E2E8F0}.status-badge{padding:4px 10px;border-radius:var(--radius-full);font-size:.75rem;font-weight:700;text-transform:uppercase}.status-badge.confirmed{background:#dcfce7;color:#15803d}.status-badge.paid{background:#e0f2fe;color:#0369a1}.status-badge.cancelled{background:#fee2e2;color:#b91c1c}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0f172aa6;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:var(--radius-lg);max-width:540px;width:100%;padding:32px;box-shadow:0 25px 50px -12px #00000040;text-align:center;animation:modalPop .3s cubic-bezier(.34,1.56,.64,1)}@keyframes modalPop{0%{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}.modal-icon-success{width:70px;height:70px;border-radius:50%;background:#dcfce7;color:#16a34a;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.info-banner{background:#e6fffa;border-left:4px solid var(--primary-teal);padding:14px;border-radius:0 var(--radius-sm) var(--radius-sm) 0;margin-bottom:20px;font-size:.9rem;color:#047857;display:flex;align-items:flex-start;gap:10px}
