/* Studio Aurora — área da cliente. Estrutura Maciel em linguagem Beauty.
   Demonstração local, sem senha ou autenticação. */
[hidden]{display:none!important}
body.client-demo-lock{overflow:hidden}
.client-account-trigger{flex:none;white-space:nowrap;border:1px solid #dcc5cb;background:#fff9fa;color:#844b61;font-size:12px;font-weight:800;padding:11px 14px;border-radius:12px;min-height:42px}
.client-account-trigger:hover{background:#f4e3e9;border-color:#cfa6b4}
.client-account-trigger:focus-visible,.beauty-account-card button:focus-visible,.client-area-section button:focus-visible{outline:3px solid #e9b5c8;outline-offset:2px}
.beauty-account-overlay{position:fixed;inset:0;z-index:200;background:#30212bc5;backdrop-filter:blur(9px);display:grid;place-items:center;padding:20px;overflow-y:auto}
.beauty-account-card{position:relative;display:grid;grid-template-columns:.82fr 1.18fr;width:min(850px,100%);max-height:min(92vh,820px);min-height:505px;overflow:auto;background:#fffaf9;border:1px solid #ffffff9a;border-radius:25px;box-shadow:0 36px 100px #26141f70}
.beauty-account-art{position:relative;display:flex;flex-direction:column;justify-content:space-between;gap:45px;overflow:hidden;background:linear-gradient(150deg,#513248,#8d6174 65%,#b78b9b);color:#fff;padding:39px 33px}
.beauty-account-art:after{content:'✧';position:absolute;right:-52px;bottom:25px;font:280px Georgia,serif;line-height:1;color:#eab5cc24;transform:rotate(-12deg);pointer-events:none}
.beauty-account-logo{display:flex;align-items:center;gap:10px;z-index:1}
.beauty-account-logo>span{display:grid;place-items:center;width:37px;height:37px;background:#fff2;border:1px solid #fff7;border-radius:11px;font:600 25px Georgia,serif}
.beauty-account-logo strong{font:500 27px Georgia,serif;letter-spacing:-.05em}
.beauty-account-logo small{font-size:8px;letter-spacing:.18em;color:#f1d4df;margin-top:6px}
.beauty-account-kicker{display:block;color:#bd7e94;font-size:10px;letter-spacing:.17em;font-weight:800;margin-bottom:12px}
.beauty-account-art .beauty-account-kicker{color:#f8d9e5}
.beauty-account-art h2{font:500 clamp(35px,4vw,49px)/1.11 'Playfair Display',Georgia,serif;letter-spacing:-.045em}
.beauty-account-art h2 em{color:#f7cfdd}
.beauty-account-art p{font-size:13px;color:#f6dfe8;line-height:1.8;max-width:275px;margin-top:18px}
.beauty-account-art .beauty-account-art-note{font-size:11px;color:#fce7ef;margin-top:0;position:relative;z-index:1}
.beauty-account-side{position:relative;padding:47px clamp(22px,4vw,48px) 28px}
.beauty-account-close{position:absolute;right:17px;top:15px;background:#fff;border:1px solid #e6d4da;width:34px;height:34px;border-radius:9px;font-size:23px;color:#8c5d70;line-height:1}
.beauty-account-side h2{font:600 30px/1.15 'Playfair Display',Georgia,serif;color:#523545}
.beauty-account-side>p{color:#8e7a83;font-size:12px;line-height:1.65;margin:9px 0 18px}
.beauty-account-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;background:#f4e8eb;border:1px solid #ead9df;border-radius:11px;padding:4px;margin-bottom:19px}
.beauty-account-tabs button{border:0;background:transparent;border-radius:8px;padding:10px;font-size:12px;font-weight:750;color:#926778}
.beauty-account-tabs button.selected{background:white;color:#74445a;box-shadow:0 2px 8px #74526913}
.beauty-account-form{display:grid;gap:11px}
.beauty-account-form label{font-size:12px;color:#6c4e5c;font-weight:750}
.beauty-account-form label input{background:white;border:1px solid #e1d2d8;border-radius:10px;min-height:44px;padding:10px 12px;width:100%;margin-top:6px;color:#4a2d3b}
.beauty-account-form label input:focus{outline:2px solid #d7a8b9;outline-offset:1px}
.beauty-account-form>.btn{width:100%;border-radius:11px;margin-top:5px;min-height:45px}
#clientDemoMessage{font-size:12px;line-height:1.6;min-height:0;color:#a05265}
#clientDemoMessage:empty{display:none}
.beauty-account-example{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin:15px 0;padding:11px 0;border-top:1px solid #ecdee3}
.beauty-account-example span{font-size:11px;color:#97818b}
.beauty-account-example button{font-size:11px;font-weight:800;color:#925167;background:transparent;border:0;text-decoration:underline;text-underline-offset:4px;padding:4px 0}
.beauty-account-side .beauty-account-privacy{font-size:10px;line-height:1.7;color:#94828b;margin:5px 0 13px}
.beauty-explore{font-size:11px;text-decoration:underline;text-underline-offset:4px;border:0;background:transparent;color:#8d5a6e;font-weight:750;padding:6px 0}
#bookingDate{width:100%;min-width:0;cursor:pointer}
#bookingDate::-webkit-calendar-picker-indicator{cursor:pointer;opacity:1}
.booking-profile-bar{display:flex;justify-content:space-between;align-items:center;gap:13px;border:1px solid #ecdae2;border-radius:12px;padding:11px 14px;margin-bottom:18px;background:#fff6f8}
.booking-profile-bar>div{min-width:0}
.booking-profile-bar small{display:block;color:#a46c7e;font-size:10px;font-weight:750;letter-spacing:.05em;margin-bottom:3px}
.booking-profile-bar strong{display:block;color:#634153;font-size:12px;line-height:1.5}
.client-profile-change{flex:none;background:#fff;border:1px solid #e1bcc9;border-radius:9px;color:#884d63;font-size:11px;padding:9px 10px;font-weight:800}
.client-booking-summary{margin-top:27px;background:#fff;border:1px solid #ead8de;border-radius:18px;padding:22px;box-shadow:0 16px 32px #8055680d}
.client-booking-summary h3{font:550 25px/1.25 'Playfair Display',Georgia,serif;color:#513344;margin:11px 0 19px}
.client-booking-summary>div{display:flex;align-items:baseline;justify-content:space-between;gap:13px;padding:11px 0;border-bottom:1px solid #f1e7e9}
.client-booking-summary>div span{font-size:12px;color:#97818b}
.client-booking-summary>div strong{font-size:12px;color:#5f3a4e;text-align:right}
.client-booking-summary>div.client-summary-total{border:0;margin-top:6px}
.client-booking-summary>div.client-summary-total strong{font-size:22px;color:#934d69}
.client-booking-summary>small{display:block;margin-top:10px;color:#b18d9e;font-size:10px}
.booking-success .client-success-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:14px}
.booking-success .client-success-actions .btn{min-height:37px;font-size:11px;white-space:normal;text-align:center}
.client-area-section{padding:75px 0;background:#fffafb;border-top:1px solid #e8d9df}
.client-area-head{display:flex;align-items:end;justify-content:space-between;gap:16px;margin-bottom:27px}
.client-area-head h2{font:500 clamp(30px,4vw,43px)/1.2 'Playfair Display',Georgia,serif;color:#523546;margin:7px 0}
.client-area-head p{font-size:13px;color:#947e88}
.client-area-grid{display:grid;grid-template-columns:minmax(230px,.75fr) minmax(0,1.75fr);gap:20px;align-items:start}
.client-profile-card,.client-appointments-card{border:1px solid #eadde2;background:#fff;border-radius:19px;padding:23px;box-shadow:0 12px 35px #603f5109;min-width:0}
.client-profile-card{background:linear-gradient(160deg,#fdf5f7,#fff)}
.client-avatar{width:57px;height:57px;border-radius:16px;background:#e9d0da;color:#8e5271;font:500 26px Georgia,serif;display:grid;place-items:center;margin-bottom:21px}
.client-profile-card h3{font:550 25px 'Playfair Display',Georgia,serif;color:#503444;margin-bottom:20px}
.client-profile-detail{display:grid;gap:3px;padding:12px 0;border-bottom:1px solid #eadde3}
.client-profile-detail span{font-size:10px;color:#9c7989}
.client-profile-detail strong{font-size:12px;color:#5f4151}
.client-profile-card .btn{width:100%;border-radius:11px;margin:19px 0 13px}
.client-profile-card p{font-size:10px;line-height:1.65;color:#9b8991}
.client-appointments-top{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.client-appointments-top h3{font:550 25px 'Playfair Display',Georgia,serif;color:#5c3c4b}
.client-booking-tabs{display:flex;gap:5px;background:#f5ecee;border-radius:10px;padding:4px}
.client-booking-tabs button{padding:9px 13px;border-radius:8px;border:0;background:transparent;color:#9f798a;font-weight:800;font-size:11px}
.client-booking-tabs button.selected{background:white;box-shadow:0 3px 8px #76506015;color:#7e4660}
.client-bookings-list{display:grid;gap:11px}
.client-booking-item{display:grid;grid-template-columns:65px minmax(0,1fr) auto;gap:15px;align-items:center;background:#fffafd;border:1px solid #eddee5;border-radius:13px;padding:16px}
.client-booking-date{display:grid;place-items:center;gap:1px;background:#f1dfe7;color:#85526b;padding:10px 6px;border-radius:11px;min-height:62px}
.client-booking-date strong{font-size:20px;line-height:1;font-weight:800}
.client-booking-date small{font-size:10px;text-transform:uppercase;font-weight:750}
.client-booking-information{min-width:0;display:grid;gap:5px}
.client-booking-information strong{font-size:13px;color:#634156}
.client-booking-information small{font-size:11px;color:#9c818d;line-height:1.4}
.client-booking-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.client-booking-status{display:inline-block;background:#faf0db;color:#987346;font-size:10px;font-weight:800;border-radius:8px;padding:5px 7px}
.client-booking-status.confirmado{background:#e8f0fb;color:#5576a2}
.client-booking-status.concluido{background:#e6f3e8;color:#438453}
.client-booking-status.cancelado{background:#f8e7eb;color:#a46b7d}
.client-booking-actions{display:grid;gap:7px;justify-items:end}
.client-booking-actions button{font-size:11px;font-weight:800;color:#945b71;padding:7px 9px;border:1px solid #dfc7d0;border-radius:9px;background:white;white-space:nowrap}
.client-booking-actions button:hover{background:#fbedf3}
.client-empty-state{display:grid;justify-items:center;gap:10px;text-align:center;padding:36px 20px;color:#977e8a;background:#fcf8fa;border:1px dashed #e4d4db;border-radius:15px}
.client-empty-state strong{font:550 20px 'Playfair Display',Georgia,serif;color:#6b455a}
.client-empty-state p{font-size:12px;line-height:1.5}
.client-empty-state button{border:1px solid #d8b6c4;color:#8c546b;background:#fff;padding:9px 14px;border-radius:10px;font-weight:750;font-size:11px}
.client-demo-disclaimer{font-size:10px;color:#a9929e;line-height:1.6;margin-top:20px}
@media(max-width:1100px){.site-head .nav{gap:12px}.site-head .nav a:not(.btn){font-size:11px}.client-account-trigger{font-size:11px}}
@media(max-width:920px){.site-head .nav a:not(.btn){display:none}.site-head .nav{gap:8px}.client-area-grid{grid-template-columns:1fr}.client-profile-card{display:grid;grid-template-columns:60px 1fr;gap:0 20px}.client-profile-card>.eyebrow,.client-profile-card>h3,.client-profile-card>.client-profile-detail,.client-profile-card>.btn,.client-profile-card>p{grid-column:2}.client-avatar{grid-column:1;grid-row:1/4}}
@media(max-width:700px){.beauty-account-overlay{padding:9px;align-items:center}.beauty-account-card{display:block;max-height:96vh;border-radius:18px}.beauty-account-art{padding:22px;gap:11px}.beauty-account-art h2{font-size:26px}.beauty-account-art h2 em{white-space:nowrap}.beauty-account-art p{font-size:11px;margin:8px 0}.beauty-account-art .beauty-account-art-note{display:none}.beauty-account-side{padding:22px 21px}.beauty-account-close{right:15px;top:12px}.beauty-account-side .beauty-account-kicker{padding-right:32px}.client-area-section{padding:48px 0}.client-area-head{align-items:start;flex-direction:column}.client-area-head .btn{min-height:37px}.client-account-trigger{padding:8px 10px;min-height:37px}.topbar .brand-text strong{font-size:21px}.topbar{gap:8px}.client-booking-summary{margin-top:20px}.client-profile-card{grid-template-columns:1fr;display:block}.client-avatar{margin-bottom:11px}.client-booking-item{grid-template-columns:55px 1fr;gap:12px;padding:11px}.client-booking-actions{grid-column:2;display:flex;justify-content:flex-start;flex-wrap:wrap}}
@media(max-width:430px){.site-head .nav{display:none}.client-booking-summary{padding:17px}.booking-profile-bar{align-items:start}.booking-profile-bar strong{font-size:11px}.client-profile-change{padding:8px}.client-appointments-card{padding:17px 12px}.client-appointments-top h3{font-size:21px}.client-area-grid{gap:13px}}
@media(prefers-reduced-motion:reduce){.beauty-account-overlay,.client-area-section{scroll-behavior:auto}}

/* Formas de pagamento: mesmo conceito de seleção visual da Maciel. */
.client-payment-group{padding:15px;background:#fff9fa;border:1px solid #eadce2;border-radius:14px}
.client-payment-group>strong{display:block;font-size:12px;color:#684454;margin-bottom:4px}
.client-payment-group>p{font-size:11px;color:#967b89;line-height:1.5;margin-bottom:12px}
.client-payment-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.client-payment-options button{border:1px solid #e8d3dc;border-radius:10px;min-height:40px;background:#fff;color:#86566b;font-size:11px;font-weight:700;padding:8px 6px}
.client-payment-options button:hover{background:#fff0f6;border-color:#c18ba1}
.client-payment-options button.selected{background:#854b63;color:#fff;border-color:#854b63}
.client-payment-group>select[hidden]{display:none!important}
@media(max-width:600px){.client-payment-options{grid-template-columns:repeat(2,minmax(0,1fr))}#mobileTopCta{display:none!important}}


/* Clareza de pagamento no salão e permanência do perfil fictício. */
.client-remember-option{
  display:flex!important;align-items:flex-start;gap:11px;
  padding:13px 14px;border:1px solid #e5cbd5;border-radius:12px;
  background:#fff4f7;cursor:pointer;margin-top:2px;
}
.beauty-account-form .client-remember-option>input[type="checkbox"]{
  flex:0 0 18px;width:18px;height:18px;min-width:18px;min-height:18px;
  margin:2px 0 0;padding:0;accent-color:#95546c;
}
.client-remember-option span{display:block;flex:1;min-width:0}
.client-remember-option strong{display:block;color:#75455a;font-size:12px;font-weight:800;line-height:1.4}
.client-remember-option small{display:block;margin-top:4px;color:#907783;font-size:10px;line-height:1.55;font-weight:450}
.client-area-account-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.client-area-account-actions .btn{min-height:41px;white-space:nowrap}
.client-area-account-actions #clientAreaLogout{background:#fff7f9;border-color:#e9d2db;color:#965d74}
.client-payment-group>p{font-size:12px;color:#795c6a;line-height:1.6;margin:6px 0 12px}
.client-payment-group>p strong{color:#6e3c53;font-weight:800}
.client-payment-important{
  display:flex;align-items:flex-start;gap:10px;
  padding:12px 13px;background:#f4e9ed;
  border:1px solid #dcb4c4;border-radius:11px;
  font-size:11px;line-height:1.55;color:#654355;margin:0 0 15px;
}
.client-payment-important>span:first-child{
  flex:0 0 25px;width:25px;height:25px;display:grid;place-items:center;
  border-radius:50%;background:#965773;color:#fff;font-size:13px;font-weight:800;
}
.client-payment-important>span:last-child{flex:1;min-width:0}
.client-payment-important strong{color:#713c55;font-weight:850}
.client-summary-payment-notice{
  font-size:11px!important;line-height:1.65!important;
  margin:15px 0 5px!important;padding:11px 12px!important;
  border:1px solid #dec0cc;border-radius:10px;background:#fff1f5;
  color:#77495f!important;
}
.client-summary-payment-notice strong{font-weight:850}
.booking-success>small{display:block;margin:12px 0 4px;color:#755266;line-height:1.7}
.booking-success>small strong{color:#854e64}
@media(max-width:700px){
  .client-area-account-actions{width:100%;gap:9px}
  .client-area-account-actions .btn{flex:1 1 auto;justify-content:center;min-width:0}
  .client-payment-important{font-size:11px;padding:10px}
  .client-remember-option{padding:11px}
}

.client-booking-payment{display:block;margin-top:7px;color:#92516c;font-size:11px;font-weight:750;line-height:1.5}
