/* PEXINXE Web v5 — identidade das pranchas Pexinxe_App_Pranchas (grafite, dourado, areia, bege),
   componentes das telas novas e ajuste proporcional para celular. Carregado por último. */
:root{
  --ink:#1F1F1F;--ink-2:#33302C;--text:#3B3632;--muted:#6F675E;--faint:#9A9087;
  --line:#EAE3D6;--line-2:#F1EBE0;--bg:#FFFFFF;--bg-2:#FAF7F2;--bg-3:#F1EAE0;
  --brand:#D4A017;--brand-600:#B8860B;--brand-700:#8A6400;--brand-50:#FBF6EC;--brand-100:#F5EBD7;
  --green:#2F6B4F;--green-50:#E1EEE5;--red:#A8322D;--red-50:#F6E3E1;--blue:#1F4E5F;--blue-50:#DDE9EC;--amber:#8E4015;--amber-50:#F8E6DA;
  --sage:#7FB89A;--peach:#E8A87C;--r:12px;--r-lg:18px;
  font-family:'Manrope',system-ui,-apple-system,'Segoe UI',Roboto,Arial,sans-serif;
}
html{-webkit-text-size-adjust:100%}
h1,h2,h3,h4{letter-spacing:-.02em}
h1{font-weight:800}h2,h3{font-weight:700}
.btn{font-weight:700}
.btn-brand{background:var(--ink);border-color:var(--ink);color:#fff}
.btn-brand:hover{background:var(--ink-2);border-color:var(--ink-2)}
.btn-sage{background:var(--sage);border-color:var(--sage);color:var(--ink)}
.btn-sage:hover{background:#6FAB8C;border-color:#6FAB8C}
.site-logo img{height:40px}
.footer-cols img{height:40px}
.site-topbar{background:var(--ink);color:#D6D2CA}
.site-topbar a,.site-topbar button{color:#D6D2CA}

/* ---------- componentes das telas novas ---------- */
.reco{border:2px solid var(--brand);padding:18px 20px;margin-bottom:20px}
.reco h2{font-size:20px}
.reco-price{font-size:26px;font-weight:800;color:var(--ink);letter-spacing:-.02em;margin-right:6px;white-space:nowrap}
.src-line{font-size:12.5px;color:var(--muted);margin-top:3px}
.bd-mark{display:inline-grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--green-50);color:var(--green)}
.bd-mark.swap{background:var(--amber-50);color:var(--amber)}
.bd-mark.no{background:var(--red-50);color:var(--red)}
.bd-mark .ico{width:13px;height:13px}
.mask{background:var(--bg-3);color:var(--muted);border-radius:6px;padding:0 7px;white-space:nowrap}
.kv{display:grid;border:1px solid var(--line);border-radius:var(--r);background:var(--bg-2)}
.kv>div{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-bottom:1px solid var(--line)}
.kv>div:last-child{border-bottom:0}
.kv b{color:var(--ink);font-weight:800;text-align:right}
.txt-red{color:var(--red)!important}.txt-green{color:var(--green)!important}.txt-amber{color:var(--amber)!important}
.trust-card{border:2px solid var(--line);padding:18px 20px}
.trust-card.limited{border-color:#F5C888;background:#FFFAF1}
.trust-card.search{border-color:#E8B4AF;background:#FFF7F6}
.trust-score{font-size:40px;font-weight:800;line-height:1;color:var(--green);letter-spacing:-.02em}
.trust-card.limited .trust-score{color:var(--amber)}.trust-card.search .trust-score{color:var(--red)}
.trust-bar{position:relative;height:10px;border-radius:99px;background:linear-gradient(90deg,#E0A5A1 0 40%,#F7D58E 40% 70%,#B5D5C3 70% 100%);margin:14px 0 6px}
.trust-bar i{position:absolute;top:-4px;width:4px;height:18px;border-radius:2px;background:var(--ink);transform:translateX(-50%)}
.trust-scale{position:relative;display:flex;justify-content:space-between;font-size:12px;color:var(--muted);height:18px}
.trust-scale span[style]{position:absolute;transform:translateX(-50%)}
.order-hero{background:var(--ink);color:#fff;border-radius:var(--r-lg);padding:16px 18px;text-align:left;display:grid;gap:6px}
.order-hero small{color:#D6D2CA;font-size:12.5px}
.order-hero b{font-size:26px;font-weight:800;letter-spacing:.05em;font-variant-numeric:tabular-nums}
.badge.b-peach{background:var(--peach);color:var(--ink)}
.thread-back{display:none}
.only-mobile{display:none!important}

/* ---------- celular: o site se ajusta proporcionalmente ---------- */
@media (max-width:760px){
  html,body{font-size:14px;overflow-x:hidden}
  .only-mobile{display:inline-flex!important}
  .only-desktop{display:none!important}
  .container{padding:0 16px}
  h1{font-size:22px}h2{font-size:18px}
  :root{--header-h:58px}
  .site-bar{gap:8px}
  .site-logo{flex:none}
  .site-logo img{height:30px}
  .portal-tag{display:none}
  .site-actions{gap:2px}
  .site-actions .btn-brand{padding:0 12px;height:38px;font-size:13px}
  .site-actions .btn-ghost{padding:0 10px}
  .site-actions .btn{white-space:nowrap}
  .site-header nav.row{display:none}
  .account-btn{padding:0 2px}
  .account-btn>.ico{display:none}
  .site-nav .container{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;height:44px;gap:0;padding:0 8px}
  .site-nav .container::-webkit-scrollbar{display:none}
  .nav-link{height:44px;padding:0 10px;white-space:nowrap;flex:none;font-size:13.5px}
  .nav-link.nav-cta{margin-left:0}
  .mega .container{grid-template-columns:1fr 1fr;gap:2px 8px;padding-top:10px;padding-bottom:14px}
  .dropdown-menu{position:fixed!important;left:12px!important;right:12px!important;top:calc(var(--header-h) + 4px)!important;width:auto!important;max-height:70vh;overflow:auto}
  .page-head{flex-direction:column;align-items:stretch;gap:12px;margin:10px 0 16px}
  .page-head .actions{flex-wrap:wrap}
  .page-head .actions .btn{flex:1}
  .page-head .row{flex-wrap:wrap}
  .crumbs{font-size:12px}
  .steps{gap:6px;overflow-x:auto;scrollbar-width:none;margin-bottom:14px}
  .steps::-webkit-scrollbar{display:none}
  .steps .step{white-space:nowrap;font-size:12.5px;flex:none}
  .steps .step-line{min-width:12px;flex:none}
  .kpis{grid-template-columns:1fr 1fr;gap:10px}
  .kpi b{font-size:20px}
  .grid-2,.grid-3,.grid-4,.form-grid,.layout-aside,.layout-aside-r,.settings{grid-template-columns:1fr!important;gap:14px}
  .sticky{position:static!important}
  .panel-head{flex-wrap:wrap;gap:8px}
  .panel-foot.row-between{flex-direction:column;align-items:stretch;gap:10px}
  .tabs{overflow-x:auto;scrollbar-width:none;flex-wrap:nowrap}
  .tabs::-webkit-scrollbar{display:none}
  .tabs .tab{white-space:nowrap;flex:none}
  .panel{overflow-x:auto;-webkit-overflow-scrolling:touch}
  .panel>table.table{min-width:100%}
  .table-wrap td:nth-child(2){min-width:170px}
  .table-wrap{-webkit-overflow-scrolling:touch}
  .table-wrap>table{min-width:560px}
  .table th,.table td{padding-left:10px;padding-right:10px}
  .edit-table{min-width:640px}
  .row.wrap,.row-between.wrap{gap:8px}
  .form-actions{flex-direction:column-reverse;align-items:stretch}
  .form-actions .btn{width:100%}
  .reco{padding:14px}
  .reco .row.wrap{width:100%}
  .reco .row.wrap .btn{flex:1}
  .reco-price{width:100%;margin:6px 0 2px}
  .inbox{grid-template-columns:1fr!important;height:auto!important;min-height:0!important;overflow:visible}
  .inbox-list{border-right:0}
  .inbox-items{max-height:none}
  .inbox.has-thread .inbox-list{display:none}
  .inbox:not(.has-thread) .thread{display:none}
  .thread{min-height:70vh}
  .thread-back{display:inline-flex;align-items:center;gap:6px;font-weight:700;color:var(--brand-700);padding:10px 16px;border-bottom:1px solid var(--line)}
  .thread-head{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 16px}
  .thread-info{grid-template-columns:1fr 1fr;padding:12px 16px}
  .thread-body{padding:14px;max-height:none}
  .thread-foot{padding:10px 12px}
  .proposal-box .row-between{flex-direction:column;align-items:stretch;gap:12px}
  .proposal-box .row{flex-wrap:wrap}
  .proposal-box .row .btn{flex:1}
  .msg{max-width:88%}
  .modal-backdrop{padding:0;place-items:end center}
  .modal,.modal-lg{width:100%;max-height:92vh;border-radius:18px 18px 0 0}
  .modal-head{padding:16px}
  .modal-body{padding:16px}
  .modal-foot{padding:12px 16px;flex-direction:column-reverse}
  .modal-foot .btn{width:100%}
  .footer-cols{grid-template-columns:1fr 1fr;gap:24px;padding:28px 16px 20px}
  .footer-cols>div:first-child{grid-column:1/-1}
  .footer-bottom .container{flex-direction:column;align-items:flex-start;gap:4px;height:auto;padding-top:12px;padding-bottom:12px}
  .auth{min-height:0}
  .auth-main{padding:16px 16px 32px}
  .auth-main>*{margin-top:0!important;margin-bottom:0!important}
  .auth-main .top{margin-bottom:28px!important}
  .lp-hero h1{font-size:32px}
  .lp-hero p{font-size:15px}
  .alert{flex-wrap:wrap}
  .alert .btn{flex:1}
  .qr-box{max-width:220px;margin:0 auto}
  .chips{flex-wrap:wrap}
  .toast-wrap,.toasts{left:12px;right:12px;bottom:12px}
}
@media (max-width:380px){
  .kpis{grid-template-columns:1fr}
  .site-actions .icon-btn[title="Favoritos"]{display:none}
}
.auth-side .logo{filter:none;height:44px}
