:root{font-family:var(--font-family);color:var(--color-text);background:var(--color-bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body,#root{width:100%;min-width:320px;min-height:100%;margin:0}body{background:var(--color-bg);min-height:100vh}#root{min-height:100vh}button,input,select,textarea{font:inherit}:root{--color-bg:#f4f6f8;--color-surface:#fff;--color-text:#111827;--color-text-muted:#6b7280;--color-border:#e5e7eb;--color-primary:#111827;--color-primary-hover:#1f2937;--color-success:#16a34a;--color-warning:#d97706;--color-danger:#dc2626;--radius-sm:10px;--radius-md:14px;--radius-lg:18px;--space-1:8px;--space-2:12px;--space-3:16px;--space-4:24px;--space-5:32px;--shadow-card:0 6px 20px #00000014;--font-family:"Inter", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-md:1rem;--font-size-lg:1.25rem;--font-size-xl:2rem;--font-weight-regular:400;--font-weight-medium:500;--font-weight-bold:700}.login-page{background:radial-gradient(circle at top,#1118270f,#0000 35%),#f3f4f6;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:#fff;border:1px solid #e5e7eb;border-radius:24px;width:100%;max-width:420px;padding:32px;box-shadow:0 18px 45px #11182714}.login-brand{align-items:center;gap:14px;margin-bottom:34px;display:flex}.login-logo{color:#fff;background:#111827;border-radius:14px;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.3rem;font-weight:800;display:flex}.login-brand h1{color:#111827;margin:0;font-size:1.35rem;font-weight:800}.login-brand p{color:#6b7280;margin:2px 0 0;font-size:.85rem}.login-heading{margin-bottom:26px}.login-heading h2{color:#111827;margin:0 0 8px;font-size:1.8rem;font-weight:800}.login-heading p{color:#6b7280;margin:0;line-height:1.5}.login-form{gap:18px;display:grid}.login-form label{color:#374151;gap:7px;margin:0;font-size:.9rem;font-weight:700;display:grid}.login-form input{color:#111827;background:#fff;border:1px solid #d1d5db;border-radius:12px;outline:none;width:100%;height:50px;padding:0 14px;font-size:1rem}.login-form input:focus{border-color:#111827;box-shadow:0 0 0 3px #11182714}.login-button{color:#fff;cursor:pointer;background:#111827;border:none;border-radius:14px;width:100%;min-height:52px;margin-top:4px;font-size:1rem;font-weight:800}.login-button:hover{background:#1f2937}.login-button:disabled{opacity:.65;cursor:wait}.login-error{color:#b91c1c;margin:-4px 0 0;font-size:.88rem;font-weight:600}.login-footer{color:#9ca3af;text-align:center;margin:28px 0 0;font-size:.8rem}@media (width<=600px){.login-page{align-items:flex-start;padding:24px 16px}.login-card{border-radius:20px;margin-top:32px;padding:24px 20px}.login-heading h2{font-size:1.55rem}}.page-container{width:100%;max-width:1100px;padding:var(--space-5);gap:var(--space-5);flex-direction:column;margin:0 auto;display:flex}.appointment-card{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);grid-template-columns:64px 1fr auto;align-items:center;gap:14px;margin-bottom:12px;padding:16px;display:grid}.appointment-time{font-size:1.05rem;font-weight:var(--font-weight-bold);color:var(--color-text);white-space:nowrap}.appointment-content{min-width:0}.appointment-content h3{font-size:1rem;font-weight:var(--font-weight-bold);color:var(--color-text);text-transform:capitalize;margin:0 0 4px}.appointment-content p{color:var(--color-text-muted);margin:0;font-size:.9rem}.appointment-price{color:var(--color-text);font-size:.95rem;font-weight:var(--font-weight-bold);white-space:nowrap}@media (width<=600px){.appointment-card{grid-template-columns:48px 1fr auto;gap:12px}.appointment-time{font-size:1rem}}.appointment-status{white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:5px 9px;font-size:.75rem;font-weight:700;display:inline-flex}.appointment-status.confirmed{color:#3730a3;background:#eef2ff}.appointment-status.completed{color:#047857;background:#ecfdf5}.appointment-status.cancelled{color:#b91c1c;background:#fef2f2}@media (width<=600px){.appointment-card{grid-template-columns:72px minmax(0,1fr) auto;gap:10px;padding:16px 14px}.appointment-time{font-size:.95rem}.appointment-content{min-width:0}.appointment-status{padding:5px 8px;font-size:.7rem}.appointment-price{font-size:.9rem}}.agenda-summary{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);margin-bottom:20px;padding:20px}.agenda-summary h1{color:var(--color-text);font-size:1.5rem;font-weight:var(--font-weight-bold);margin:0 0 8px}.agenda-summary-info{color:var(--color-text-muted);flex-wrap:wrap;align-items:center;gap:8px;font-size:.95rem;display:flex}.agenda-summary-info strong{color:var(--color-text);font-size:.95rem;font-weight:var(--font-weight-bold)}.agenda-summary-dot{color:var(--color-text-muted)}@media (width<=600px){.agenda-summary{padding:18px}.agenda-summary h1{font-size:1.35rem}}.agenda-toolbar{justify-content:space-between;align-items:end;gap:16px;margin-bottom:24px;display:flex}.agenda-barber-selector{flex:1;max-width:320px}.agenda-barber-selector label{color:var(--color-text-muted);margin-bottom:6px;font-size:.9rem;font-weight:500;display:block}.agenda-barber-selector select{border:1px solid var(--color-border);background:var(--color-surface);width:100%;min-height:46px;color:var(--color-text);border-radius:10px;padding:10px 12px;font-size:1rem}.new-appointment-button{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:12px;min-height:46px;padding:10px 18px;font-size:1rem;font-weight:700}.new-appointment-button:hover{opacity:.9}@media (width<=600px){.agenda-toolbar{flex-direction:column;align-items:stretch;gap:12px;margin-bottom:18px}.agenda-barber-selector{width:100%;max-width:none}.agenda-barber-selector label{margin-bottom:6px;font-size:.85rem;font-weight:600}.agenda-barber-selector select{border-radius:12px;width:100%;min-height:48px;padding:10px 12px;font-size:.95rem}.new-appointment-button{border-radius:12px;width:100%;min-height:48px;padding:12px 16px;font-size:.95rem}.agenda-date-navigation{grid-template-columns:42px minmax(0,1fr) 42px;gap:8px;margin-bottom:18px}.agenda-date-navigation>button{border-radius:11px;width:42px;height:42px;font-size:1.3rem}.agenda-date-picker button{min-height:42px;padding:0 6px;font-size:.88rem;line-height:1.2}.appointment-detail{margin-top:12px;padding:18px}.appointment-actions button{min-height:48px;font-size:.95rem}.agenda-empty{padding:28px 18px}}.appointment-detail{background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-card);margin-top:20px;padding:20px}.detail-back-button{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;margin-bottom:16px;padding:0;font-weight:600}.appointment-detail h2{color:var(--color-text);margin:0 0 16px;font-size:1.35rem}.appointment-detail p{color:var(--color-text-muted);margin:8px 0}.appointment-detail strong{color:var(--color-text)}.appointment-actions{gap:10px;margin-top:22px;display:grid}.appointment-actions button{cursor:pointer;border-radius:12px;width:100%;min-height:46px;margin:0;padding:10px 16px;font-size:.95rem;font-weight:700}.complete-appointment-button{background:var(--color-primary);color:#fff;border:none}.edit-appointment-button,.whatsapp-button{color:var(--color-text);background:#fff;border:1px solid #d1d5db}.cancel-appointment-button{color:#b91c1c;background:#fff;border:1px solid #fecaca}.appointment-actions button:hover{opacity:.88}.agenda-date-navigation{grid-template-columns:44px 1fr 44px;align-items:center;gap:10px;margin-bottom:20px;display:grid}.agenda-date-navigation strong{text-align:center;color:var(--color-text);font-size:.95rem;font-weight:var(--font-weight-bold);text-transform:capitalize}.agenda-date-navigation>button{border:1px solid var(--color-border);background:var(--color-surface);width:44px;height:44px;color:var(--color-text);cursor:pointer;border-radius:12px;font-size:1.4rem;line-height:1}.agenda-date-navigation>button:hover{border-color:var(--color-text-muted)}.agenda-date-picker{justify-content:center;display:flex;position:relative}.agenda-date-picker button{width:100%;min-height:44px;color:var(--color-text);font-size:.95rem;font-weight:var(--font-weight-bold);text-transform:capitalize;cursor:pointer;background:0 0;border:none}.agenda-date-picker input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.agenda-empty{border:1px dashed var(--color-border);border-radius:var(--radius-lg);background:var(--color-surface);text-align:center;margin-top:8px;padding:32px 20px}.agenda-empty p{color:var(--color-text);font-size:1rem;font-weight:var(--font-weight-bold);margin:0 0 6px}.agenda-empty span{color:var(--color-text-muted);font-size:.9rem;line-height:1.4;display:block}.new-appointment-page{width:100%}.new-appointment-card{background:var(--color-surface);border-radius:var(--radius-lg);width:100%;max-width:680px;box-shadow:var(--shadow-card);padding:var(--space-4);margin:0 auto}.new-appointment-header{margin-bottom:var(--space-4)}.new-appointment-header h1{color:var(--color-text);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold);margin:0}.new-appointment-header p{margin-top:var(--space-2);color:var(--color-text-muted);font-size:var(--font-size-sm)}.new-appointment-card label{color:var(--color-text-muted);margin-bottom:6px;font-size:.9rem;font-weight:500;display:block}.new-appointment-card input,.new-appointment-card select{width:100%;min-height:46px;color:var(--color-text);box-sizing:border-box;background:#fff;border:1px solid #d8dbe2;border-radius:10px;margin-bottom:18px;padding:10px 12px;font-size:1rem}.new-appointment-card input:focus,.new-appointment-card select:focus{border-color:var(--color-primary);outline:none}.new-appointment-card>div{width:100%}@media (width<=600px){.new-appointment-card{padding:20px 16px}}.back-button{color:var(--color-text-muted);cursor:pointer;background:0 0;border:none;align-items:center;margin-bottom:16px;padding:8px 12px;font-size:.9rem;font-weight:600;display:inline-flex}.back-button:hover{color:var(--color-text)}.save-appointment-button{background:var(--color-primary);color:#fff;cursor:pointer;border:none;border-radius:12px;width:100%;min-height:48px;margin-top:8px;padding:12px 18px;font-size:1rem;font-weight:700}.save-appointment-button:hover{opacity:.9}.save-appointment-button:active{transform:scale(.99)}.date-time-row{grid-template-columns:1fr 1fr;gap:16px;display:grid}.date-time-row>div{width:100%}@media (width<=600px){.date-time-row{grid-template-columns:1fr;gap:0}}*{box-sizing:border-box}body{color:#111827;background:#f3f4f6;min-width:320px;min-height:100vh;margin:0;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}button,input,select{font:inherit}.page{background:#fff;width:min(100%,520px);min-height:100vh;margin:0 auto;padding:28px 20px}.page h1{color:#111827;text-align:center;margin:0 0 28px;font-size:30px;font-weight:800}form{gap:10px;display:grid}label{margin-top:10px;font-size:14px;font-weight:700}input,select{color:#111827;background:#fff;border:1px solid #d1d5db;border-radius:12px;outline:none;width:100%;height:50px;padding:0 14px}input:focus,select:focus{border-color:#111827;box-shadow:0 0 0 3px #11182714}.save-button{color:#fff;cursor:pointer;background:#111827;border:0;border-radius:14px;height:54px;margin-top:20px;font-weight:800}.save-button:hover{background:#1f2937}.option-card{cursor:pointer;background:#fff;border:2px solid #e5e7eb;border-radius:18px;flex-direction:column;align-items:flex-start;gap:6px;width:100%;padding:18px;transition:all .2s;display:flex}.option-card strong{font-size:18px}.option-card span{color:#6b7280;font-size:14px}.option-card:hover{border-color:#111827}.option-card.selected{color:#fff;background:#111827;border-color:#111827}.option-card.selected span{color:#d1d5db}.page h2{color:#111827;margin:0 0 12px;font-size:20px;font-weight:800}.option-card{color:#111827;text-align:left;height:auto;margin:0}.option-card strong{color:inherit}.option-list{gap:10px;margin-bottom:10px;display:grid}.time-grid{grid-template-columns:repeat(3,1fr);gap:12px;display:grid}.time-slot{cursor:pointer;color:#111827;background:#fff;border:2px solid #e5e7eb;border-radius:14px;height:52px;font-size:16px;font-weight:700;transition:all .2s}.time-slot:hover{border-color:#111827}.time-slot.selected{color:#fff;background:#111827;border-color:#111827}.time-slot.disabled{color:#9ca3af;cursor:not-allowed;background:#f3f4f6}.date-options{gap:12px;display:grid}.date-option{cursor:pointer;color:#111827;background:#fff;border:2px solid #e5e7eb;border-radius:16px;flex-direction:column;align-items:flex-start;width:100%;padding:16px;transition:all .2s;display:flex}.date-option strong{font-size:18px}.date-option span{color:#6b7280;font-size:14px}.date-option:hover{border-color:#111827}.date-option.selected{color:#fff;background:#111827;border-color:#111827}.date-option.selected span{color:#d1d5db}.client-results{gap:8px;margin-top:8px;display:grid}.client-item{color:#111827;text-align:left;cursor:pointer;background:#fff;border:1px solid #e5e7eb;border-radius:12px;width:100%;padding:14px}.client-item:hover{background:#f9fafb;border-color:#111827}.appointment-summary{color:#111827;background:#f9fafb;border:1px solid #e5e7eb;border-radius:18px;margin-top:28px;padding:20px}.appointment-summary h2{margin-top:0}.appointment-summary p{margin:10px 0}.booking-summary{background:#f9fafb;border:1px solid #e5e7eb;border-radius:16px;flex-direction:column;gap:8px;margin-bottom:24px;padding:18px;display:flex}.booking-summary p{margin:0;font-weight:600}.customer-intro{color:#6b7280;text-align:center;margin:-6px 0 22px}.confirm-booking-button{color:#fff;cursor:pointer;background:#111827;border:0;border-radius:14px;width:100%;height:54px;margin-top:22px;font-weight:800}.confirm-booking-button:hover{background:#1f2937}input[type=date]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}input[type=date]::-webkit-calendar-picker-indicator{cursor:pointer;opacity:1;display:block}.logout-button{border:1px solid var(--color-border);background:var(--color-surface);color:var(--color-text-muted);cursor:pointer;z-index:100;border-radius:10px;padding:8px 14px;font-size:.9rem;font-weight:600;position:fixed;top:16px;right:16px}.logout-button:hover{color:var(--color-text);border-color:var(--color-text-muted)}