/* MyBills • Interface 2026. Shared by public, customer and administration pages. */
:root {
  --color-primary:#6546e8; --color-primary-dark:#5032c7; --color-primary-light:#eeeafd;
  --color-primary-on-light:#5032c7; --bg-page:#f4f6fb; --text-primary:#182038;
  --text-secondary:#626d84; --text-muted:#707b90; --border-color:#e3e8f2;
  --radius-sm:10px; --radius-md:15px; --radius-lg:22px;
  --shadow-card:0 3px 18px rgba(24,32,56,.045);
  --shadow-elevated:0 16px 48px rgba(24,32,56,.12);
}
[data-theme=dark] { --bg-page:#101320; --bg-card:#191f30; --bg-card-alt:#20283c;
  --bg-hover:#263047; --text-primary:#f1f4fc; --text-secondary:#b4bfd5;
  --text-muted:#99a7c2; --border-color:#2d3850; --color-primary-light:#302750;
  --color-primary-on-light:#d0c2ff; --color-primary:#a38bff; --color-primary-dark:#8b70ee;
}
html { scroll-behavior:smooth; scroll-padding-top:90px; -webkit-text-size-adjust:100%; }
body { line-height:1.5; }
img,video { max-width:100%; }
button,input,select,textarea { font:inherit; }
button,a,input,select,textarea,summary { -webkit-tap-highlight-color:transparent; }
:focus-visible { outline:3px solid var(--color-primary); outline-offset:4px; }
button:disabled { cursor:not-allowed; opacity:.58; }
[hidden] { display:none !important; }
.mb-skip { position:fixed; top:-100px; left:16px; z-index:10000; padding:12px 20px; border-radius:12px; background:var(--bg-card); color:var(--text-primary); box-shadow:var(--shadow-elevated); }
.mb-skip:focus { top:12px; }
.main-content { min-width:0; padding:32px clamp(18px,3vw,48px); }
.main-content > h2 { font-size:clamp(25px,3vw,34px); letter-spacing:-.035em; margin-bottom:24px; }
.sidebar { padding:25px 18px; border-right-color:var(--border-color); }
.sidebar-logo { padding-bottom:22px; }
.sidebar-account { padding:14px; background:var(--bg-page); }
.sidebar-nav .nav-item { min-height:44px; margin:2px 0; font-size:13px; }
.nav-item.active { color:var(--color-primary-on-light); }
.nav-item.active::before { left:-8px; top:12px; bottom:12px; }
.btn-new { min-height:48px; justify-content:center; background:linear-gradient(115deg,#5845db,#8248ef); box-shadow:0 5px 14px #6546e82b; }
.card,.summary-card,.auth-box { border:1px solid var(--border-color); box-shadow:var(--shadow-card); }
.card { padding:clamp(18px,2.3vw,28px); }
.card h3 { letter-spacing:-.02em; }
.summary-cards-grid { gap:16px; }
.summary-card { position:relative; min-height:128px; padding:24px; overflow:hidden; transition:transform .18s ease,box-shadow .18s ease; }
.summary-card .label { font-size:12px; font-weight:600; letter-spacing:.01em; }
.summary-card .value { font-size:clamp(22px,2.3vw,32px); letter-spacing:-.045em; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.summary-icon { border-radius:14px; width:46px; height:46px; }
.summary-card:first-child { background:linear-gradient(125deg,#4533a5,#7551e8); color:#fff; border-color:transparent; }
.summary-card:first-child .label,.summary-card:first-child .value { color:#fff; }
.summary-card:first-child .summary-icon { background:#ffffff20; color:#fff; }
.topbar { gap:16px; margin-bottom:24px; }
.btn-primary,.btn-secondary,.icon-btn,.btn-danger { min-height:44px; border-radius:11px; }
.btn-primary { background:var(--color-primary); color:#fff; font-weight:650; }
[data-theme=dark] .btn-primary { background:#7150df; }
.btn-secondary { background:var(--bg-card); border:1px solid var(--border-color); }
.form-group { margin-bottom:20px; min-width:0; }
.form-group label { display:block; font-weight:600; font-size:13px; margin-bottom:8px; color:var(--text-primary); }
.form-group :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { min-height:46px; border:1px solid var(--border-color-strong); border-radius:11px; padding:11px 13px; background:var(--bg-card); color:var(--text-primary); width:100%; max-width:100%; }
.form-group :is(input,select,textarea):focus { border-color:var(--color-primary); box-shadow:0 0 0 3px var(--color-primary-light); }
input[type=checkbox],input[type=radio] { accent-color:var(--color-primary); width:18px; height:18px; }
textarea { resize:vertical; }
input[inputmode=decimal] { font-variant-numeric:tabular-nums; }
.mb-recurring { border:1px solid var(--border-color); border-radius:14px; padding:16px; margin:0 0 22px; background:var(--bg-card-alt); }
.mb-recurring legend { padding:0 6px; font-weight:600; font-size:13px; }
.mb-recurring label { display:flex; align-items:center; gap:10px; }
.mb-recurring [data-recurring-options] { display:grid; gap:8px; margin-top:16px; }
.mb-recurring input[type=number] { max-width:130px; padding:10px; border:1px solid var(--border-color); border-radius:8px; background:var(--bg-card); color:var(--text-primary); }
.mb-recurring small { color:var(--text-secondary); }
.mb-table-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; border-radius:12px; }
table { width:100%; border-collapse:separate; border-spacing:0; font-variant-numeric:tabular-nums; }
thead th { background:var(--bg-card-alt); color:var(--text-secondary); font-size:11px; letter-spacing:.045em; text-transform:uppercase; padding:14px 12px; }
tbody td { padding:15px 12px; border-bottom:1px solid var(--border-color); }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:var(--bg-hover); }
.alert { border-radius:13px; padding:14px 18px; line-height:1.6; }
.mb-page-heading { display:flex; justify-content:space-between; gap:20px; align-items:center; margin:0 0 26px; }
.mb-page-heading h1 { font-size:clamp(25px,3vw,34px); letter-spacing:-.04em; line-height:1.2; margin:4px 0 8px; }
.mb-page-heading p { margin:0; color:var(--text-secondary); font-size:14px; }
.mb-eyebrow { font-size:10px; font-weight:750; text-transform:uppercase; letter-spacing:.14em; color:var(--color-primary); }
.mb-heading-date { font-size:12px; padding:10px 14px; background:var(--bg-card); border:1px solid var(--border-color); border-radius:12px; white-space:nowrap; color:var(--text-secondary); }
.lp-header { backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); }
.lp-hero { background:radial-gradient(ellipse at 85% 10%,#8662ee19,transparent 50%),radial-gradient(ellipse at 10% 70%,#01bfe912,transparent 45%); }
.lp-hero h1 { letter-spacing:-.05em; line-height:1.08; }
.lp-hero-sub { line-height:1.8; }
.lp-bento-card,.lp-segment-card,.lp-price-card { border:1px solid var(--border-color); }
.lp-btn { min-height:48px; border-radius:12px; }
.lp-faq-question { min-height:56px; text-align:left; }
.lp-section-header h2 { letter-spacing:-.035em; }
@media (hover:hover) { a.summary-card:hover { transform:translateY(-3px); box-shadow:var(--shadow-elevated); } }
@media(min-width:769px) and (max-width:1100px) { :root { --sidebar-width:220px; } .sidebar { padding:20px 12px; } .main-content { padding:26px 22px; } .summary-cards-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:768px) {
 .main-content { padding:22px 16px calc(100px + env(safe-area-inset-bottom)); }
 .summary-cards-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
 .summary-card { padding:16px; min-height:112px; gap:8px; }
 .summary-card .value { font-size:clamp(19px,4.8vw,27px); }
 .summary-icon { width:34px; height:34px; flex-shrink:0; }
 .card { border-radius:17px; padding:18px; }
 .bottom-nav { padding-bottom:env(safe-area-inset-bottom); height:calc(var(--bottomnav-height) + env(safe-area-inset-bottom)); background:var(--bg-card); box-shadow:0 -4px 24px #18203808; }
 .bottom-nav a { min-height:48px; }
 .form-group :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size:16px; }
 .mb-page-heading { margin-bottom:22px; } .mb-heading-date { display:none; }
 .topbar { flex-wrap:wrap; }
 .lp-container { padding-inline:20px; }
 .lp-hero h1 { font-size:clamp(34px,9vw,52px); }
}
@media(max-width:380px) { .summary-card { flex-direction:column-reverse; align-items:flex-start; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; animation:none !important; transition:none !important; } .reveal { opacity:1 !important; transform:none !important; } }
@media print { .sidebar,.bottom-nav,.mb-skip { display:none !important; } .main-content { margin:0; padding:0; } .card { box-shadow:none; break-inside:avoid; } .mb-table-scroll { overflow:visible; } }
/* Keep amounts legible without separating currency from the number. */
.summary-card .value { white-space:nowrap; font-size:clamp(20px,1.65vw,27px); }
.summary-card { padding:20px; }
.summary-card > div:first-child { min-width:0; }
@media(min-width:769px) { .summary-card { align-items:flex-start; } .summary-icon { width:34px; height:34px; } }
@media(max-width:768px) { .summary-card .value { font-size:clamp(17px,4.4vw,25px); } .summary-card { flex-direction:column-reverse; align-items:flex-start; } }
.custom-select-option { width:100%; border:0; background:transparent; text-align:left; color:var(--text-primary); font:inherit; }
.custom-select-option:focus-visible { outline-offset:-3px; background:var(--color-primary-light); }
.custom-select-trigger { min-height:46px; }
.main-content > h1 { font-size:clamp(25px,3vw,34px); letter-spacing:-.035em; margin:0 0 24px; }
.lp-faq-item.open .lp-faq-answer { max-height:none; }

/* Marca clicável: retorno à home pública */
a.auth-logo:hover, a.sidebar-logo:hover { opacity:.9; }
a.auth-logo:focus-visible, a.sidebar-logo:focus-visible { outline:2px solid #8b5cf6; outline-offset:4px; border-radius:8px; }
