﻿/* Customer workspace: navigation, dashboard, forms, histories and support. */
body[data-page=client]{--canvas:#101114;--ink:#f5f2ed;--muted:#beb4aa;--line:#373330;--brand:#ffad6b;background:#101114;color:#f5f2ed;color-scheme:dark;font-family:Inter,ui-sans-serif,system-ui,sans-serif}
body[data-page=client] .app-workspace{margin-left:0;width:100%;min-width:0}
body[data-page=client] #client-sidebar{display:none}
body[data-page=client] .app-topbar{padding:16px 30px;min-height:86px;gap:24px;background:#17181cf5;border-bottom:1px solid #373330;position:sticky;top:0;z-index:30}
body[data-page=client] .customer-brand{display:flex;align-items:center;gap:10px;font-size:27px;font-weight:750;letter-spacing:-1px;color:#f5f2ed}
body[data-page=client] .customer-brand img{width:46px;height:46px;object-fit:contain}
body[data-page=client] .customer-brand b{color:#ffad6b}
body[data-page=client] .customer-main-nav{display:flex;gap:8px;align-items:center;margin:auto}
body[data-page=client] .customer-main-nav a{font-size:13px;color:#beb4aa;padding:11px 15px;border:1px solid transparent;border-radius:10px}
body[data-page=client] .customer-main-nav a[aria-current],body[data-page=client] .customer-main-nav a:hover{color:#f5f2ed;border-color:#655343;background:#65534330}
body[data-page=client] .topbar-heading{display:none}
body[data-page=client] .customer-workspace-shell{max-width:1536px;margin:auto;display:grid;grid-template-columns:210px minmax(0,1fr);gap:32px;padding:32px}
body[data-page=client] .customer-section-nav{align-self:start;position:sticky;top:118px;display:flex;flex-direction:column;gap:6px;min-width:0}
body[data-page=client] .customer-nav-label{font-size:10px;letter-spacing:.14em;color:#a08f80;padding:9px 14px 17px;font-weight:650}
body[data-page=client] .customer-section-nav a{display:flex;align-items:center;gap:12px;padding:13px 14px;border-radius:11px;font-size:13px;color:#beb4aa;border:1px solid transparent;min-height:46px}
body[data-page=client] .customer-section-nav svg{width:18px;height:18px;flex-shrink:0}
body[data-page=client] .customer-section-nav a.active{background:linear-gradient(110deg,#6553433b,#3733302b);border-color:#655343;color:#ffd0a6;font-weight:600}
body[data-page=client] .customer-section-nav a:hover{background:#202125;color:#f5f2ed}
body[data-page=client] .customer-section-nav .customer-back-store{margin-top:24px;border-top:1px solid #373330;border-radius:0;padding-top:22px;color:#ffd0a6}
body[data-page=client] main.account-content{padding:0;max-width:none;min-width:0;width:100%}
body[data-page=client] .welcome-row{margin:0 0 26px;gap:20px;align-items:center}
body[data-page=client] .welcome-row h2{font-size:32px;letter-spacing:-1px;line-height:1.2;color:#f5f2ed}
body[data-page=client] .welcome-row p{font-size:13px;color:#beb4aa;line-height:1.8;max-width:650px}
body[data-page=client] .section-kicker{color:#ffad6b;font-size:10px;letter-spacing:.13em}
body[data-page=client] .welcome-wave{color:#ffad6b}
body[data-page=client] .customer-dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;margin-bottom:26px}
body[data-page=client] .account-metrics{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:0}
body[data-page=client] .balance-card{grid-column:1/-1;min-height:210px;background:radial-gradient(ellipse at right top,#a08f8038,transparent 70%),#17181c;border:1px solid #655343;border-radius:18px;padding:26px}
body[data-page=client] .balance-card>strong{font-size:44px;font-weight:650;letter-spacing:-1.5px;color:#f5f2ed;margin:22px 0}
body[data-page=client] .balance-card>div{color:#ffd0a6;font-size:12px}
body[data-page=client] .balance-card button{display:inline-flex;align-items:center;gap:12px;background:#ffd0a6;color:#17181c;border:0;border-radius:9px;padding:12px 17px;font-weight:650;font-size:12px}
body[data-page=client] .balance-chip{border-color:#655343;background:#ffffff0a;color:#ffd0a6}
body[data-page=client] .metric-card{border:1px solid #373330;background:#17181c;border-radius:15px;padding:22px;box-shadow:none;min-height:170px;grid-template-columns:1fr auto}
body[data-page=client] .metric-card>strong{color:#f5f2ed;font-size:30px;grid-column:1;margin:12px 0;font-weight:650}
body[data-page=client] .metric-card>a{color:#ffd0a6;font-size:11px;grid-column:1/-1}
body[data-page=client] .metric-card>span:not(.metric-icon){color:#beb4aa;font-size:12px}
body[data-page=client] .metric-icon{background:#ffad6b1a;color:#ffd0a6;border-radius:10px;padding:9px}
body[data-page=client] .account-promo{margin:0;border:1px solid #655343;border-radius:18px;display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;padding:28px;background:linear-gradient(150deg,#202125,#17181c);overflow:hidden;gap:22px}
body[data-page=client] .account-promo h2{font-size:30px;line-height:1.15;letter-spacing:-.8px;color:#f5f2ed;margin:12px 0}
body[data-page=client] .account-promo p{font-size:12px;color:#beb4aa;line-height:1.7}
body[data-page=client] .promo-product{width:100%;min-width:0;position:relative;border-radius:12px;overflow:hidden;transform:none}
body[data-page=client] .promo-product img{width:100%;height:155px;object-fit:cover;border-radius:12px}
body[data-page=client] .promo-product span{font-size:11px;background:#101114dd;color:#ffd0a6;border-color:#655343;position:absolute;bottom:10px;right:10px;padding:8px 10px;border-radius:8px}
body[data-page=client] .account-card,body[data-page=client] .catalog-section{background:#17181c;border:1px solid #373330;border-radius:16px;box-shadow:none;overflow:hidden}
body[data-page=client] .card-heading{padding:23px 25px;border-bottom:1px solid #373330;gap:16px}
body[data-page=client] .card-heading h3{font-size:16px;font-weight:600;color:#f5f2ed}
body[data-page=client] .card-heading p{font-size:12px;color:#beb4aa;line-height:1.7}
body[data-page=client] .card-heading>a,body[data-page=client] .text-button{color:#ffd0a6;font-size:12px}
body[data-page=client] .primary-button{background:#ffad6b;border:1px solid #ffad6b;color:#fff;border-radius:10px;font-size:12px;min-height:43px;font-weight:600;padding:12px 18px;box-shadow:none}
body[data-page=client] .primary-button:hover{background:#ffad6b}
body[data-page=client] .secondary-button{background:#202125;border:1px solid #655343;color:#ffd0a6;border-radius:9px;min-height:40px;padding:10px 15px;font-size:12px}
body[data-page=client] .account-content input:not([type=checkbox]):not([type=radio]):not([type=color]),body[data-page=client] .account-content select,body[data-page=client] .account-content textarea{background:#101114!important;color:#f5f2ed;border:1px solid #655343;border-radius:10px;min-height:44px;font-size:13px;color-scheme:dark}
body[data-page=client] .account-content :is(input,textarea)::placeholder{color:#a08f80}
body[data-page=client] .account-content :is(input,textarea,select):focus{border-color:#ffad6b;outline:2px solid #ff8b3222;outline-offset:2px;box-shadow:none}
body[data-page=client] .history-content table{width:100%;border-collapse:collapse}
body[data-page=client] .history-content :is(th,td){border-color:#373330;color:#d8cfc5;padding:19px 22px;background:#17181c;font-size:12px}
body[data-page=client] .history-content th{background:#101114;color:#beb4aa;font-size:11px}
body[data-page=client] .history-content td strong{color:#f5f2ed}
body[data-page=client] .history-content td small{color:#beb4aa}
body[data-page=client] .history-row{border-color:#373330}
body[data-page=client] .history-row:hover{background:#202125}
body[data-page=client] .empty-state{color:#beb4aa;padding:38px 24px;min-height:190px;justify-content:center}
body[data-page=client] .empty-state strong{color:#ffd0a6}
body[data-page=client] .empty-icon{display:flex;align-items:center;justify-content:center;background:#202125;color:#ffd0a6;width:46px;height:46px;border-radius:13px;padding:12px}
body[data-page=client] .empty-icon svg{width:22px;height:22px}
body[data-page=client] .account-chip{background:#202125;border-color:#655343;color:#ffd0a6}
body[data-page=client] .recharge-explainer{background:#17181c;border:1px solid #655343;color:#beb4aa;border-radius:14px;padding:21px;margin-bottom:24px}
body[data-page=client] .recharge-explainer strong{color:#ffd0a6}
body[data-page=client] .recharge-explainer svg{color:#ffd0a6}
body[data-page=client] .profile-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:22px;align-items:start}
body[data-page=client] .profile-details{padding:28px}
body[data-page=client] .profile-identity{border-color:#373330}
body[data-page=client] .profile-details dl>div{border-color:#373330}
body[data-page=client] .profile-details dt{color:#beb4aa}
body[data-page=client] .profile-details dd{color:#ffd0a6}
body[data-page=client] .preferences-form{padding:25px}
body[data-page=client] .preferences-form label{font-size:12px;color:#ffd0a6;margin-bottom:9px}
body[data-page=client] .preferences-form p{color:#beb4aa;font-size:12px;line-height:1.7}
body[data-page=client] .appearance-card{margin-top:24px}
body[data-page=client] .profile-style-layout{background:transparent}
body[data-page=client] .profile-style-preview{background:#101114;border-color:#373330}
body[data-page=client] .profile-preview-card{background:#17181c;border-color:#655343}
body[data-page=client] .profile-style-toggles label,body[data-page=client] .profile-custom-color{background:#17181c;border-color:#373330;color:#ffd0a6}
body[data-page=client] .profile-style-footer{border-color:#373330}
body[data-page=client] .support-layout{grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:22px}
body[data-page=client] .support-contact{position:relative;background:radial-gradient(ellipse at top right,#65534333,transparent),#17181c;padding:28px}
body[data-page=client] .support-contact strong{color:#ffd0a6}
body[data-page=client] .support-symbol{background:#ff8b3220;color:#ffd0a6}
body[data-page=client] .support-faq details{border-color:#373330}
body[data-page=client] .support-faq summary{color:#f5f2ed;font-size:12px}
body[data-page=client] .support-faq p,body[data-page=client] .support-faq a{color:#beb4aa}
body[data-page=client] .catalog-section{margin:0;padding:26px}
body[data-page=client] .catalog-card{background:#17181c;border-color:#373330;border-radius:15px}
body[data-page=client] .catalog-order-card{background:#17181c;border-color:#373330;color:#ffd0a6}
body[data-page=client] .catalog-label{background:#ff8b321a;border-color:#655343;color:#ffd0a6}
body[data-page=client] .catalog-check{color:#beb4aa}
body[data-page=client] .catalog-dialog{background:#17181c;border-color:#655343;color:#ffd0a6}
body[data-page=client] #wallet-widget{background:#17181c;border-color:#655343}
body[data-page=client] #btn-abrir-recarga{background:#ffad6b;color:#fff}
body[data-page=client] .app-footer{background:#101114;border-color:#373330;margin-left:0;padding:22px 32px}
body[data-page=client] .app-dialog>div,body[data-page=client] .notice{background:#17181c;border-color:#655343;color:#f5f2ed}
body[data-page=client] :is(a,button):focus-visible{outline:2px solid #ffd0a6;outline-offset:3px}
@media(max-width:1150px){body[data-page=client] .customer-workspace-shell{grid-template-columns:180px minmax(0,1fr);gap:22px;padding:24px}body[data-page=client] .customer-main-nav a{padding:10px;font-size:12px}body[data-page=client] .customer-dashboard-grid{grid-template-columns:1fr}body[data-page=client] .account-promo{display:grid;grid-template-columns:1fr 1fr;align-items:center}body[data-page=client] .customer-brand{font-size:23px}body[data-page=client] .customer-section-nav a{padding:12px 10px;font-size:12px}}
@media(max-width:900px){body[data-page=client] .customer-workspace-shell{grid-template-columns:1fr;padding:22px;gap:24px}body[data-page=client] .customer-section-nav{position:static;flex-direction:row;overflow:auto;padding-bottom:8px;gap:7px;scrollbar-width:thin}body[data-page=client] .customer-section-nav a{white-space:nowrap;flex-shrink:0;border:1px solid #373330;padding:11px 13px}body[data-page=client] .customer-nav-label,body[data-page=client] .customer-section-nav .customer-back-store{display:none}body[data-page=client] .customer-main-nav{display:none}body[data-page=client] .topbar-heading{display:flex;margin-left:auto}body[data-page=client] .topbar-heading>div{display:none}body[data-page=client] .mobile-menu{display:flex;color:#ffd0a6}body[data-page=client] #client-sidebar{display:flex;transform:translateX(-100%);background:#17181c;border-color:#373330}body[data-page=client] #client-sidebar.is-open{transform:translateX(0)}body[data-page=client] .app-navigation a.active{background:#ff8b32;color:#fff}body[data-page=client] .sidebar-help{background:#202125;border-color:#655343}}
@media(max-width:650px){body[data-page=client] .app-topbar{padding:12px 16px;gap:12px;min-height:72px}body[data-page=client] .customer-brand{font-size:21px;gap:6px}body[data-page=client] .customer-brand img{width:34px;height:34px}body[data-page=client] .customer-workspace-shell{padding:17px;gap:20px}body[data-page=client] .welcome-row{flex-wrap:wrap;align-items:flex-start;gap:16px;margin-bottom:22px}body[data-page=client] .welcome-row h2{font-size:26px}body[data-page=client] .welcome-row p{font-size:12px}body[data-page=client] .account-metrics{gap:12px}body[data-page=client] .balance-card{padding:23px;min-height:200px}body[data-page=client] .balance-card>strong{font-size:40px}body[data-page=client] .metric-card{padding:18px;min-height:155px}body[data-page=client] .metric-card>span:not(.metric-icon){font-size:11px}body[data-page=client] .metric-icon{padding:7px}body[data-page=client] .account-promo{display:flex;padding:24px;gap:20px}body[data-page=client] .account-promo h2{font-size:27px}body[data-page=client] .profile-grid,body[data-page=client] .support-layout{grid-template-columns:1fr}body[data-page=client] .card-heading{padding:20px;flex-wrap:wrap}body[data-page=client] .card-heading h3{font-size:15px}body[data-page=client] .preferences-form,body[data-page=client] .profile-details{padding:22px}body[data-page=client] .catalog-section{padding:20px}body[data-page=client] .app-footer{padding:22px 17px}body[data-page=client] #wallet-widget>span:first-child{display:none}body[data-page=client] .history-content :is(th,td){padding:16px;font-size:11px}}
@media(max-width:360px){body[data-page=client] .app-topbar{padding-inline:10px;gap:7px}body[data-page=client] .customer-brand{font-size:18px}body[data-page=client] .customer-brand img{width:30px;height:30px}body[data-page=client] .metric-card{padding:16px 12px}body[data-page=client] .metric-card>a{font-size:10px}}
body[data-page=client] .account-view .section-kicker{color:#ffad6b}
body[data-page=client] .account-table tbody tr,body[data-page=client] .account-table tbody td{background:#17181c;border-color:#373330}
body[data-page=client] .account-table tbody tr:nth-child(even) td{background:#17181c}
body[data-page=client] .account-table td.amount{color:#ffd0a6}
body[data-page=client] .account-table .table-action{background:#373330;border-color:#655343;color:#ffd0a6;border-radius:7px;padding:8px 10px}
