/* Beta V3.1.1.0 — experiência premium do Portal do Cliente. */
:root{
  --client-forest:#132a5e;
  --client-forest-2:#17614b;
  --client-mint:#e8f2ed;
  --client-canvas:#f6f3ec;
  --client-card:#fffefa;
  --client-ink:#18251f;
  --client-muted:#65736c;
  --client-gold:#d3a044;
  --client-gold-soft:#f6ead2;
  --client-line:#d9e1dc;
  --client-danger:#a9443e;
  --client-shadow:0 18px 55px rgba(16,61,49,.09);
}

.client-shell{min-height:100vh;padding-bottom:104px;background:radial-gradient(circle at 86% 5%,rgba(164,207,185,.34),transparent 27%),radial-gradient(circle at 5% 92%,rgba(211,160,68,.12),transparent 25%),var(--client-canvas);color:var(--client-ink);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.client-shell button,.client-shell input,.client-shell select,.client-shell textarea{font:inherit}
.client-head{position:sticky;z-index:40;top:0;display:flex;height:78px;align-items:center;justify-content:space-between;padding:0 max(22px,calc((100vw - 1080px)/2));border:0;border-bottom:1px solid rgba(16,61,49,.1);background:rgba(255,254,250,.9);box-shadow:0 8px 28px rgba(16,61,49,.04);backdrop-filter:blur(18px)}
.client-brand{min-width:0;gap:12px;color:var(--client-forest)}
.client-brand>span{width:44px;height:44px;border:1px solid rgba(211,160,68,.7);background:linear-gradient(145deg,#fff,#f8efe0);box-shadow:0 6px 18px rgba(16,61,49,.06)}
.client-brand strong{overflow:hidden;color:var(--client-forest);font:600 clamp(18px,2vw,22px) Georgia,serif;text-overflow:ellipsis;white-space:nowrap}
.client-head>div{align-items:center;gap:5px}
.client-head>div button{position:relative;display:inline-flex;width:auto;min-width:44px;height:44px;align-items:center;justify-content:center;gap:7px;padding:9px 11px;border-radius:13px;color:var(--client-forest);transition:background .18s,transform .18s}
.client-head>div button:hover{background:var(--client-mint);transform:translateY(-1px)}
.client-head .client-chat-action>span:not([data-portal-chat-badge]){font-size:14px;font-weight:750}
.client-head svg{width:21px;height:21px}
.client-main{width:min(1080px,100%);max-width:none;margin:auto;padding:38px 24px 80px}

.client-hero{position:relative;isolation:isolate;min-height:310px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;overflow:hidden;padding:clamp(34px,7vw,72px);border:0;border-radius:30px;background:linear-gradient(125deg,#132a5e 0%,#1f3c88 58%,#294e9b 100%);color:#fff;box-shadow:0 26px 65px rgba(10,45,35,.22)}
.client-hero:before{content:"";position:absolute;z-index:-1;right:-70px;top:-135px;width:390px;height:390px;border:1px solid rgba(255,255,255,.16);border-radius:50%;box-shadow:0 0 0 45px rgba(255,255,255,.035),0 0 0 100px rgba(255,255,255,.025)}
.client-hero:after{content:"MB";position:absolute;z-index:-1;right:7%;bottom:-42px;color:rgba(255,255,255,.055);font:700 210px/1 Georgia,serif;letter-spacing:-.1em}
.client-hero small{position:relative;padding-left:34px;color:#f2c66f;font-size:12px;font-weight:800;letter-spacing:.16em}
.client-hero small:before{content:"";position:absolute;left:0;top:50%;width:24px;height:2px;background:var(--client-gold)}
.client-hero h1{max-width:650px;margin:16px 0 28px;color:#fff;font:600 clamp(38px,6vw,64px)/1.02 Georgia,serif;letter-spacing:-.045em;text-shadow:0 2px 18px rgba(0,0,0,.15)}
.client-primary{min-height:48px;padding:0 22px;border:0;border-radius:14px!important;background:linear-gradient(135deg,#e1ad4d,#f2ca78);color:#183d30!important;font-size:14px;font-weight:850;box-shadow:0 10px 28px rgba(5,28,21,.2);transition:transform .18s,box-shadow .18s,filter .18s}
.client-primary:hover:not(:disabled){filter:brightness(1.035);transform:translateY(-2px);box-shadow:0 14px 34px rgba(5,28,21,.25)}
.client-primary:focus-visible,.client-shell button:focus-visible,.client-shell input:focus-visible,.client-shell textarea:focus-visible{outline:3px solid rgba(211,160,68,.42);outline-offset:3px}

.client-feature,.client-section,.client-profile,.client-barbershop,.client-preferences,.bc-portal{margin-top:24px;padding:clamp(22px,4vw,34px);border:1px solid var(--client-line);border-radius:24px;background:rgba(255,254,250,.96);box-shadow:var(--client-shadow)}
.client-feature>header,.client-section>header{padding-bottom:14px;border-bottom:1px solid var(--client-line)}
.client-feature h2,.client-section h2,.client-preferences h2{margin:0;color:var(--client-ink);font:600 clamp(22px,3vw,29px) Georgia,serif;letter-spacing:-.02em}
.client-section>header button{min-height:38px;padding:0 12px;border-radius:10px;background:var(--client-mint);color:var(--client-forest);font-size:13px;font-weight:750}
.client-empty{min-height:125px;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-top:16px;padding:24px;border:1px dashed #becdc5;border-radius:18px;background:linear-gradient(145deg,#fbfdfb,#f4f7f4);color:var(--client-muted);font-size:15px}
.client-empty button{margin-top:7px;padding:8px 14px;border-radius:10px;background:var(--client-mint);font-size:13px}

.client-glance{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.client-glance>button{min-height:104px;grid-template-columns:52px 1fr;gap:5px 15px;padding:20px;border:1px solid var(--client-line);border-radius:21px;background:var(--client-card);box-shadow:0 12px 34px rgba(16,61,49,.06);transition:transform .18s,border-color .18s,box-shadow .18s}
.client-glance>button:hover{border-color:#a9c7b8;background:#fff;transform:translateY(-3px);box-shadow:0 18px 42px rgba(16,61,49,.1)}
.client-glance i{width:52px;height:52px;border-radius:16px;background:var(--client-gold-soft);color:#9a681b}
.client-glance span{color:var(--client-muted);font-size:12px;font-weight:650}
.client-glance strong{color:var(--client-forest);font:600 21px Georgia,serif}

.client-title{margin:8px 0 28px}
.client-title>small{color:#a87522;font-size:11px;font-weight:850;letter-spacing:.18em}
.client-title h1{margin:8px 0 12px;color:var(--client-ink);font:600 clamp(38px,6vw,58px)/1.05 Georgia,serif;letter-spacing:-.045em}
.client-title p{max-width:680px;color:var(--client-muted);font-size:15px;line-height:1.65}
.client-title>.client-primary{margin-top:-66px}
.client-back{display:inline-flex;min-height:38px;align-items:center;padding:0 13px;border:1px solid var(--client-line);border-radius:11px;background:#fff;color:var(--client-forest);font-size:13px;font-weight:750}
.client-search{min-height:58px;margin-top:22px;padding:6px;border-color:var(--client-line);border-radius:17px;box-shadow:0 8px 24px rgba(16,61,49,.05)}
.client-search input{padding:12px 15px;color:var(--client-ink);font-size:15px}
.client-search button{min-width:100px;border-radius:12px;background:var(--client-forest);color:#fff;font-size:13px}
.client-chips{gap:9px;margin-top:14px;padding-bottom:3px}
.client-chips button{min-height:40px;padding:0 16px;border-color:var(--client-line);background:var(--client-card);font-size:12px;font-weight:700}
.client-chips button.active{border-color:var(--client-forest);background:var(--client-forest);color:#fff;box-shadow:0 7px 18px rgba(16,61,49,.18)}

.client-service-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.client-service{overflow:hidden;padding:15px;border-color:var(--client-line);border-radius:22px;background:var(--client-card);box-shadow:0 12px 34px rgba(16,61,49,.055);transition:transform .2s,border-color .2s,box-shadow .2s}
.client-service:hover{border-color:#a9c6b8;transform:translateY(-4px);box-shadow:0 20px 46px rgba(16,61,49,.11)}
.client-service.selected{border-color:var(--client-forest-2);box-shadow:0 0 0 3px rgba(23,97,75,.12),0 18px 42px rgba(16,61,49,.1)}
.client-service>img,.client-service-mark{height:165px;border-radius:16px;background:linear-gradient(145deg,#dcece4,#f7ebd2)}
.client-service>small{margin-top:15px;color:#a87522;font-size:10px;letter-spacing:.12em}
.client-service h3{margin:7px 0;color:var(--client-ink);font:600 22px Georgia,serif}
.client-service p{min-height:42px;color:var(--client-muted);font-size:13px;line-height:1.55}
.client-service>div span{font-size:12px}.client-service>div strong{color:var(--client-forest);font-size:16px}
.client-service>button{min-height:43px;border-color:#b9cbc1;border-radius:12px;background:#fff;color:var(--client-forest);font-size:13px}
.client-service.selected>button{border-color:var(--client-forest);background:var(--client-forest);color:#fff}
.client-selection{bottom:94px;width:min(760px,calc(100% - 30px));padding:13px 15px;border-color:#d8c18d;border-radius:19px;background:rgba(255,253,247,.96);box-shadow:0 18px 48px rgba(16,61,49,.2);backdrop-filter:blur(16px)}
.client-selection span{color:var(--client-muted);font-size:12px}.client-selection strong{color:var(--client-forest);font-size:18px}

.client-choice-list{gap:12px}.client-choice{min-height:82px;grid-template-columns:58px 1fr;padding:13px 17px;border-color:var(--client-line);border-radius:19px;background:var(--client-card);box-shadow:0 8px 25px rgba(16,61,49,.045);transition:transform .18s,border-color .18s}
.client-choice:hover{border-color:#a7c6b7;transform:translateX(4px)}
.client-choice i{width:56px;height:56px;border-radius:17px;background:var(--client-mint)}
.client-choice strong{color:var(--client-ink);font:600 19px Georgia,serif}.client-choice span{color:var(--client-muted);font-size:12px}
.client-date input{min-height:56px;padding:14px 16px;border-color:var(--client-line);border-radius:14px;color:var(--client-ink);font-size:16px}
.client-slots{grid-template-columns:repeat(4,minmax(0,1fr));gap:11px}
.client-slots button{min-height:82px;align-items:flex-start;justify-content:center;padding:15px;border-color:var(--client-line);border-radius:16px;background:var(--client-card);transition:background .18s,border-color .18s,transform .18s}
.client-slots button:hover{border-color:var(--client-forest-2);background:var(--client-mint);transform:translateY(-2px)}
.client-slots strong{font:700 20px "Segoe UI",sans-serif}.client-slots span{width:100%;color:var(--client-muted);font-size:11px;text-align:left}

.client-appointment{grid-template-columns:68px minmax(0,1fr);gap:17px;margin:14px 0;padding:18px;border-color:var(--client-line);border-radius:20px;background:var(--client-card);box-shadow:0 8px 28px rgba(16,61,49,.05)}
.client-appointment>time{width:68px;height:68px;border-radius:18px;background:var(--client-mint);color:var(--client-forest)}
.client-appointment>time b{font:700 25px Georgia,serif}.client-appointment>time span{font-size:10px;font-weight:750}
.client-appointment small{color:#a87522;font-size:10px;letter-spacing:.09em}
.client-appointment h3{margin:6px 0;color:var(--client-ink);font:600 20px Georgia,serif}.client-appointment p{color:var(--client-muted);font-size:13px}
.client-inline{gap:8px;margin-top:14px}.client-inline button{min-height:38px;padding:0 12px;border-color:#bdccc4;border-radius:11px;color:var(--client-forest);font-size:12px}
.client-inline button[data-cancel]{border-color:#e2c4c0;color:var(--client-danger)}
.paid-badge{display:inline-flex;align-items:center;padding:0 11px;border-radius:999px;background:#e5f3eb;color:#1f7650;font-size:11px;font-weight:800}

.client-receipt{padding:clamp(22px,5vw,38px);border-color:var(--client-line);border-radius:24px;background:var(--client-card);box-shadow:var(--client-shadow)}
.client-receipt p,.client-receipt dl{gap:14px;font-size:14px}.client-receipt dt{font-size:12px}.client-receipt dd{color:var(--client-ink)}

.client-profile,.client-auth form{gap:18px}.client-profile label,.client-auth label{gap:8px;color:#35453d;font-size:13px}
.client-profile input,.client-profile textarea,.client-auth input{min-height:52px;padding:13px 15px;border-color:#c6d2cb;border-radius:13px;color:var(--client-ink);font-size:15px}
.client-profile input:focus,.client-auth input:focus{border-color:var(--client-forest-2);box-shadow:0 0 0 4px rgba(23,97,75,.1)}
.client-profile h2{margin:12px 0 0;font:600 24px Georgia,serif}.client-form-row{gap:14px}
.client-link{min-height:48px;border-color:var(--client-line);border-radius:13px;background:var(--client-card);color:var(--client-forest);font-size:13px;box-shadow:0 6px 18px rgba(16,61,49,.035)}

.client-loyalty{min-height:230px;border-radius:28px;background:radial-gradient(circle at 75% 15%,rgba(232,187,99,.26),transparent 30%),linear-gradient(145deg,#132a5e,#081f19);box-shadow:0 25px 60px rgba(10,45,35,.2)}
.client-loyalty small{font-size:11px}.client-loyalty strong{font:600 82px Georgia,serif}.client-loyalty span{font-size:12px}
.client-badges,.client-plan-grid{gap:15px}.client-badges article,.client-plan-grid article,.client-current-plan,.client-goal{padding:22px;border-color:var(--client-line);border-radius:21px;background:var(--client-card);box-shadow:0 10px 30px rgba(16,61,49,.05)}
.client-badges strong{font-size:14px}.client-badges small{font-size:11px}
.client-plan-grid h2{font:600 25px Georgia,serif}.client-plan-grid p,.client-plan-grid li{font-size:13px;line-height:1.6}.client-plan-grid article>strong{font-size:23px}
.client-current-plan{padding:28px;background:linear-gradient(125deg,#132a5e,#237257);color:#fff}.client-current-plan h2{font:600 32px Georgia,serif}.client-current-plan p{color:#dfece6;font-size:13px}
.client-goal span{font-size:11px}.client-goal small{color:var(--client-muted);font-size:12px}
.client-movement,.client-payment,.client-purchase,.client-notification{min-height:72px;margin:10px 0;padding:16px;border-color:var(--client-line);border-radius:16px;background:var(--client-card);font-size:13px}
.client-movement small,.client-payment small,.client-purchase small,.client-notification small{font-size:11px}.payment-reference{font-size:9px!important;opacity:.65}

.client-barbershop>img{margin-bottom:18px}.client-barbershop>p{color:var(--client-muted);font-size:14px;line-height:1.7}.client-barbershop dl{grid-template-columns:130px 1fr;gap:14px;font-size:14px}.client-barbershop dt{font-weight:700}
.client-preferences>p,.pwa-help{color:var(--client-muted);font-size:13px;line-height:1.6}.pwa-control{padding:20px;border-color:var(--client-line);border-radius:18px;background:var(--client-mint)}

.client-modal{background:rgba(5,25,19,.7)}.client-modal>form,.client-modal>section{padding:32px;border:1px solid rgba(255,255,255,.6);border-radius:25px;box-shadow:0 30px 90px rgba(0,0,0,.3)}
.client-modal h2{font:600 28px Georgia,serif}.client-modal textarea{padding:13px;border:1px solid var(--client-line);border-radius:13px;font-size:15px}
.client-rating button{font-size:39px}

.bc-portal{color:var(--client-ink)}.bc-portal h1{font:600 34px Georgia,serif}.bc-portal .bc-messages{height:min(52vh,520px);background:#f1f5f2}.bc-portal .bc-message{font-size:14px}.bc-portal .bc-message.bc-own{background:#dceee5;border-color:#b3d2c2}.bc-portal .bc-compose textarea{font-size:15px}

.client-nav{bottom:max(14px,env(safe-area-inset-bottom));width:min(760px,calc(100% - 28px));height:76px;padding:7px;border:1px solid rgba(255,255,255,.22);border-radius:24px;background:rgba(10,57,45,.96);box-shadow:0 20px 48px rgba(7,38,29,.3);backdrop-filter:blur(18px)}
.client-nav button{min-height:61px;gap:5px;border-radius:17px;color:#bed0c7;font-size:11px;font-weight:700;transition:background .18s,color .18s,transform .18s}
.client-nav button:hover{color:#fff;transform:translateY(-1px)}
.client-nav button.active{background:rgba(255,255,255,.12);color:#f5ca75;box-shadow:inset 0 0 0 1px rgba(255,255,255,.07)}
.client-nav i{height:25px}.client-nav svg{width:21px;height:21px}.client-nav span{font-size:10px}

.client-auth{background:var(--client-canvas)}.client-auth-art{background:radial-gradient(circle at 18% 82%,rgba(211,160,68,.33),transparent 27%),linear-gradient(145deg,#132a5e,#071e18)}
.client-auth-art h1{font-weight:600;letter-spacing:-.045em}.client-auth-card{width:min(560px,100%)}
.client-auth-tabs{padding:5px;border-radius:15px;background:#e4eae6}.client-auth-tabs button{min-height:44px;font-size:13px}.client-auth-tabs button.active{color:var(--client-forest)}
.client-auth-switch{font-size:14px}.client-auth-switch a{color:var(--client-forest)}

@media(max-width:900px){.client-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.client-slots{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:700px){
  .client-shell{padding-bottom:92px}.client-head{height:66px;padding:0 12px}.client-brand>span{width:40px;height:40px}.client-brand strong{max-width:40vw;font-size:18px}
  .client-head>div{gap:1px}.client-head>div button{min-width:38px;width:38px;height:38px;padding:7px;border-radius:11px}.client-head .client-chat-action>span:not([data-portal-chat-badge]){display:none}
  .client-main{padding:18px 14px 65px}.client-hero{min-height:275px;padding:30px 24px;border-radius:23px}.client-hero:after{right:-4%;font-size:135px}.client-hero h1{font-size:clamp(34px,11vw,47px)}
  .client-feature,.client-section,.client-profile,.client-barbershop,.client-preferences,.bc-portal{padding:19px;border-radius:20px}
  .client-glance{grid-template-columns:1fr 1fr;gap:10px}.client-glance>button{min-height:115px;display:flex;flex-direction:column;align-items:flex-start;padding:16px}.client-glance i{width:42px;height:42px}.client-glance strong{width:100%;font-size:17px}
  .client-title h1{font-size:39px}.client-title>.client-primary{float:none;width:100%;margin-top:8px}.client-search button{min-width:76px}
  .client-service-grid{grid-template-columns:1fr}.client-service{display:grid;grid-template-columns:96px 1fr;column-gap:14px}.client-service>img,.client-service-mark{grid-row:1/6;width:96px;height:118px}.client-service>small,.client-service h3,.client-service p,.client-service>div,.client-service>button{grid-column:2}.client-service p{min-height:0}.client-service h3{font-size:20px}
  .client-slots{grid-template-columns:repeat(2,minmax(0,1fr))}.client-appointment{grid-template-columns:56px minmax(0,1fr);padding:14px}.client-appointment>time{width:56px;height:60px}.client-inline button{flex:1;min-width:105px}
  .client-plan-grid,.client-badges{grid-template-columns:1fr}.client-form-row{grid-template-columns:1fr}.client-barbershop dl{grid-template-columns:1fr}.client-barbershop dd{padding-bottom:12px}
  .client-nav{bottom:0;width:100%;height:70px;padding:5px 3px calc(5px + env(safe-area-inset-bottom));border-radius:19px 19px 0 0}.client-nav button{min-height:56px;border-radius:13px}.client-nav span{font-size:9px}
  .client-auth-card{padding:28px 20px 44px}
}
@media(max-width:390px){.client-brand strong{max-width:31vw}.client-head>div button{min-width:34px;width:34px}.client-main{padding-inline:10px}.client-hero{padding-inline:20px}.client-glance{grid-template-columns:1fr}.client-service{grid-template-columns:82px 1fr}.client-service>img,.client-service-mark{width:82px;height:105px}.client-nav span{font-size:8px}.client-nav svg{width:19px;height:19px}}
@media(prefers-reduced-motion:reduce){.client-shell *{scroll-behavior:auto!important;transition:none!important}}
.client-plan-premium{position:relative;overflow:hidden;border-top:4px solid var(--plan-accent,#c89b3c)!important}.client-plan-premium.featured{box-shadow:0 18px 38px color-mix(in srgb,var(--plan-accent,#c89b3c) 22%,transparent)}.client-plan-premium>img,.client-plan-premium>i{width:62px;height:62px;display:grid;place-items:center;object-fit:cover;border-radius:14px;background:#102945;color:var(--plan-accent,#c89b3c)}.client-plan-premium>i svg{width:28px}.client-plan-premium>small{color:var(--plan-accent,#c89b3c);font-weight:800;text-transform:uppercase;letter-spacing:.08em}