/* FINANÇA PLUS · Executive Green Mobile 2.0 · 2026-10-27
   Camada exclusivamente visual aplicada APÓS executive-theme.css.
   Preserva estado financeiro, Supabase, Guardião, importações e eventos.
*/
:root {
  --bg:#f6f9f7; --surface:#ffffff; --surface2:#f4faf6; --text:#142c22;
  --muted:#718479; --stroke:#e2ede6; --green:#00b86b; --green-dark:#008b51;
  --green-pale:#e9f9f1; --blue:#248af4; --red:#e94552; --amber:#e99427;
  --shadow:0 9px 30px rgba(24,74,47,.055);
  --exec-ink:#132e23; --exec-gold:#f0ac32;
}
html { color-scheme:light; -webkit-text-size-adjust:100%; }
body:has(.exec-shell),.layout.exec-shell,.layout.exec-shell .page {
  background:#f6f9f7 !important;color:#162d23!important;
}
.layout.exec-shell,.layout.exec-shell button,.layout.exec-shell input,
.layout.exec-shell select,.layout.exec-shell textarea {
  font-family:'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
}
.layout.exec-shell :is(.money-value,.metric-value,.row-amount,.exec-metric>strong,.exec-wallet-amount,.exec-bank-balance strong){
  font-variant-numeric:tabular-nums;
  min-width:0;
}
.layout.exec-shell :is(.panel,.exec-panel,.metric,.submetric,.summary-tile,.source-card,.goal-card,.budget-card,.debt-card) {
  background:#fff;border-color:#e2ece5;box-shadow:0 8px 24px rgba(19,88,52,.045);
}
.layout.exec-shell .sidebar{
  background:linear-gradient(164deg,#063b29 0%,#052b24 74%,#071f1c 100%)!important;
  border-right-color:#1b5940!important;
}
.layout.exec-shell .brand{color:#fff!important}
.layout.exec-shell .brand .plus,.layout.exec-shell .exec-brand-subtitle{color:#3fe798!important}
.layout.exec-shell .brand-mark{
  background:linear-gradient(155deg,#02c975,#00643b)!important;color:#fff!important;
  border-color:#39db8b!important;box-shadow:0 7px 24px #001b124a!important;
}
.layout.exec-shell .nav-label,.layout.exec-shell .nav-label-premium{color:#85b69e!important}
.layout.exec-shell .sidebar .nav-btn{color:#c5ddcf!important;border-color:transparent}
.layout.exec-shell .sidebar .nav-btn svg{color:#9dd0b0}
.layout.exec-shell .sidebar .nav-btn:hover{background:#10533b!important;color:#fff!important}
.layout.exec-shell .sidebar .nav-btn.active{
  background:#126347!important;color:#fff!important;border-color:#327f5e!important;
  box-shadow:inset 3px 0 0 #18e28a!important
}
.layout.exec-shell .sidebar .nav-btn.active svg{color:#56efaa}
.layout.exec-shell .sidebar .user-chip{background:#114631;border-color:#2b684f}
.layout.exec-shell .sidebar-end>.btn{background:#116b49!important;border-color:#338861!important}
.layout.exec-shell .topbar,.layout.exec-shell.is-dashboard-page .topbar{
  background:#ffffffee!important;border-bottom:1px solid #e5eee8!important;
  box-shadow:0 3px 14px #173a2506!important
}
.layout.exec-shell .breadcrumb,.layout.exec-shell .top-date{color:#6f8476}
.layout.exec-shell .breadcrumb b,.layout.exec-shell .page-title{color:#153127}
.layout.exec-shell .exec-top-logo{
  background:#ecfaf1;color:#009656;border-color:#d8f0e3;
}
.layout.exec-shell .icon-btn,.layout.exec-shell .menu-toggle{
  background:#fff!important;border-color:#dfece4!important;color:#2a6348!important;
}
.layout.exec-shell .exec-new-btn,.layout.exec-shell .btn{
  background:linear-gradient(130deg,#05c875,#00a861)!important;
  border:1px solid #08b96e!important;color:#fff!important;
  box-shadow:0 4px 13px rgba(0,174,96,.13)!important;
}
.layout.exec-shell .btn.secondary,.layout.exec-shell .btn.ghost{
  background:#fff!important;color:#087a4a!important;border-color:#cee8d9!important;box-shadow:none!important
}
.layout.exec-shell .btn.red{background:#e34754!important;border-color:#e34754!important}
.layout.exec-shell .btn:hover{filter:brightness(.97);transform:none}
.layout.exec-shell .panel h2,.layout.exec-shell .section-smallhead,
.layout.exec-shell .exec-panel-head h2,.layout.exec-shell .exec-money-panel-head h2,
.layout.exec-shell .section-head h1,.layout.exec-shell .section-head h2{color:#19392b!important}
.layout.exec-shell :is(.page-subtitle,.fine,.panel-caption,.exec-panel-head p,.row-content small,.row-amount small){
  color:#72867a!important;
}
.layout.exec-shell :is(.panel-link,.text-btn,.exec-text-link,.exec-icon-link){
  color:#068b52!important
}
.layout.exec-shell .exec-account-top{
  color:#126944;background:#ebf8f0;
}
.layout.exec-shell .eyebrow,.exec-kicker,.exec-hero-kicker,.exec-period-label span,.exec-money-kicker{
  color:#00a967!important
}
.layout.exec-shell :is(input:not([type=checkbox]):not([type=radio]),textarea,select,.select,.filter-field){
  background:#fff!important;color:#173d2b!important;border-color:#d7e7dc!important;
  font-size:16px;min-height:42px
}
.layout.exec-shell :is(input,select,textarea,button,[tabindex]):focus-visible{
  outline:3px solid #46dba2!important;outline-offset:2px!important;
}
.layout.exec-shell :is(button,summary,[data-page],[data-action],[data-modal]){
  touch-action:manipulation;
}
.layout.exec-shell .modal{background:#fff!important;border-color:#e0ebe5!important;color:#1a3327!important}
.layout.exec-shell .modal-header{background:#fff!important;border-bottom-color:#e6eee9!important;color:#123b2a!important}
.layout.exec-shell .modal-body{color:#234332!important}
.layout.exec-shell .table-row,.layout.exec-shell .data-row{border-bottom-color:#e8f0ea!important}
.layout.exec-shell .row-icon{background:#e9f9f0!important;color:#049f5a!important}
.layout.exec-shell .row-icon.expense{background:#fff0f1!important;color:#e44857!important}
.layout.exec-shell .submetric strong,.layout.exec-shell .summary-tile strong{color:#153b2a}
.layout.exec-shell .status{background:#e5f8ec;color:#09844e}
.layout.exec-shell .status.overdue{background:#fff0f1;color:#c74453}
.layout.exec-shell .status.soon{background:#fff4df;color:#a87926}
/* Início: estrutura executiva branca e verde, em vez de azul e dourado. */
.layout.exec-shell .executive-dashboard{color:#153b2a}
.layout.exec-shell .exec-hero{
  background:linear-gradient(115deg,#fff 0%,#fff 57%,#e8f9ef 100%);
  border-color:#e1efe5;box-shadow:0 8px 22px #174c2c08
}
.layout.exec-shell .exec-hero:before{background:#04cb78}
.layout.exec-shell .exec-hero h1{color:#172e25}
.layout.exec-shell .exec-hero h1 em{color:#00ad66}
.layout.exec-shell .exec-hero p{color:#73877a}
.layout.exec-shell .exec-primary-action{background:linear-gradient(135deg,#00cf78,#009e5d);color:#fff;border-color:#00ba69}
.layout.exec-shell .exec-guardian-action{background:#e9faf0;color:#087b4a;border-color:#c5e9d6}
.layout.exec-shell .exec-period{border-bottom-color:#e3ede7}
.layout.exec-shell .exec-period-label strong{color:#22503a}
.layout.exec-shell .exec-period-controls .period-pills{background:#eff4f0;border-color:#e5ece7}
.layout.exec-shell .exec-period-controls .period-pills button{color:#657e6e}
.layout.exec-shell .exec-period-controls .period-pills button.selected,
.layout.exec-shell .exec-period-controls .period-pills button[aria-pressed=true]{
  color:#027b47!important;background:#fff!important;
  box-shadow:0 2px 7px #165e2e1a
}
.layout.exec-shell .exec-wallet{
  background:linear-gradient(117deg,#045d3b 0%,#01814e 67%,#00ad6d 100%);
  border-color:#149667;color:#fff;box-shadow:0 12px 30px #08694519
}
.layout.exec-shell .exec-caption-on-dark{color:#b5f6d5}
.layout.exec-shell .exec-wallet-badge{color:#dcffe9;border-color:#92f8c280;background:#ffffff18}
.layout.exec-shell .exec-wallet-amount{color:#fff}
.layout.exec-shell .exec-wallet-breakdown>div{background:#ffffff10;border-color:#ffffff33}
.layout.exec-shell .exec-wallet-breakdown strong{color:#fff}
.layout.exec-shell .exec-wallet-footer button{color:#eefff5}
.layout.exec-shell .exec-metric,.layout.exec-shell .exec-metric:last-child{
  background:#fff;border:1px solid #e1ece5;box-shadow:0 8px 23px #165b3310
}
.layout.exec-shell .exec-metric-top>span:first-child{color:#73887a}
.layout.exec-shell .exec-metric h2{color:#617c6b}
.layout.exec-shell .exec-metric>strong{color:#1a3328}
.layout.exec-shell .exec-metric.exec-income>strong{color:#009b59}
.layout.exec-shell .exec-metric.exec-expense>strong{color:#e34754}
.layout.exec-shell .exec-metric.exec-loss>strong{color:#e34754}
.layout.exec-shell .exec-metric-icon{background:#ebf8f0;color:#068d56}
.layout.exec-shell .exec-metric.exec-income .exec-metric-icon{background:#00c875;color:#fff}
.layout.exec-shell .exec-metric.exec-expense .exec-metric-icon{background:#ffebed;color:#e34754}
.layout.exec-shell .exec-panel{background:#fff;border-color:#e2ece5}
.layout.exec-shell .exec-panel-head h2{color:#143a2a}
.layout.exec-shell .exec-expense-head,.layout.exec-shell .exec-due-total{
  background:#f3faf6;border-color:#e2f0e8
}
.layout.exec-shell .exec-category-dot{box-shadow:0 0 0 2px #fff}
.layout.exec-shell .exec-progress-line{background:#e9f0eb}
.layout.exec-shell .exec-expense-head strong,.layout.exec-shell .exec-category-value{color:#1d4530}
.layout.exec-shell .exec-due-row strong,.layout.exec-shell .exec-due-row>b,
.layout.exec-shell .exec-due-total b{color:#20432f}
.layout.exec-shell .exec-due-symbol{background:#edf9f0;color:#059a5b}
.layout.exec-shell .exec-source-tile{background:#fafdfb;border-color:#e2ede7}
.layout.exec-shell .exec-source-name strong,.layout.exec-shell .exec-source-tile>b{color:#1c3c2b}
.layout.exec-shell .exec-source-foot span{color:#6e8677}
.layout.exec-shell .exec-money-hero{
  background:linear-gradient(120deg,#045836,#00a063);color:#fff;
  box-shadow:0 13px 29px #075b381c
}
.layout.exec-shell .exec-money-hero-main>span{color:#c1ffd9}
.layout.exec-shell .exec-money-hero-main>p{color:#d8f9e6}
.layout.exec-shell .exec-money-hero-split>div{background:#ffffff0c;border-color:#ffffff36}
.layout.exec-shell .exec-money-hero-split span{color:#d1f3e0}
.layout.exec-shell .exec-money-panel-head h2{color:#1d4932}
.layout.exec-shell .exec-money-panel-head>button{color:#068c56}
.layout.exec-shell .exec-bank-row{border-top-color:#e0ede6;border-right-color:#e0ede6;border-bottom-color:#e0ede6}
.layout.exec-shell .exec-bank-title strong{color:#1f4430}
.layout.exec-shell .exec-bank-balance strong{color:#1f4931}
.layout.exec-shell .exec-bank-edit{background:#f6fbf8;border-top-color:#e0ede6}
.layout.exec-shell .exec-bank-edit summary{color:#117349}
.layout.exec-shell .exec-money-panel{border-color:#e0ede5}
.layout.exec-shell .exec-cash-card{background:#eaf8ed;border-color:#d2ecda}
.layout.exec-shell .exec-cash-card h2,.layout.exec-shell .exec-cash-card>strong{color:#08683f}
.layout.exec-shell .source-card{border-color:#e1ece5}
.layout.exec-shell .source-profit{color:#047d4b}
/* Símbolos de conta mantêm Nubank roxo, Mercado Pago azul, Inter laranja e espécie verde. */
.layout.exec-shell .exec-bank-row.exec-bank-nubank{--bank-color:#7435ef}
.layout.exec-shell .exec-bank-row.exec-bank-mercado{--bank-color:#078de6}
.layout.exec-shell .exec-bank-row.exec-bank-inter{--bank-color:#fc8b20}
.layout.exec-shell .exec-bank-row.exec-bank-cash{--bank-color:#0ab56e}
@media(max-width:900px){
  .layout.exec-shell .page,.layout.exec-shell .content,.layout.exec-shell :is(.executive-dashboard,.exec-money-page,.panel){min-width:0}
  .layout.exec-shell .head-btns{max-width:100%}
}
@media(max-width:720px){
  html,body{max-width:100%;overflow-x:clip}
  .layout.exec-shell{overflow-x:clip}
  .layout.exec-shell .content,.layout.exec-shell.is-dashboard-page .content{
    padding:15px 13px calc(100px + env(safe-area-inset-bottom,0px))!important
  }
  .layout.exec-shell .topbar,.layout.exec-shell.is-dashboard-page .topbar{
    min-height:62px;height:62px;padding:0 13px!important
  }
  .layout.exec-shell .breadcrumb b{color:#123c29}
  .layout.exec-shell .sidebar{width:min(320px,88vw)}
  .layout.exec-shell .sidebar .nav-btn{min-height:46px;font-size:13px}
  .layout.exec-shell .menu-close{background:#146c48!important;color:#fff!important;border-color:#398a65!important}
  .layout.exec-shell .bottom-nav{
    display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;
    background:#fff!important;border-top:1px solid #e1eae3!important;
    min-height:74px;padding:7px 7px calc(10px + env(safe-area-inset-bottom,0px))!important;
    box-shadow:0 -7px 28px #154d2912!important;z-index:75
  }
  .layout.exec-shell .bottom-nav .bottom-tab{
    color:#6a8274!important;font-size:10px!important;min-height:48px;
    border-radius:11px
  }
  .layout.exec-shell .bottom-nav .bottom-tab.active{
    color:#00a461!important;background:#e9f9f0!important
  }
  .layout.exec-shell .bottom-nav .f5-bottom-add{
    border-radius:50%!important;width:54px;height:54px;min-width:54px;min-height:54px;
    background:linear-gradient(145deg,#06d980,#00a562)!important;
    box-shadow:0 6px 18px #00b86b51!important;transform:translateY(-10px)
  }
  .layout.exec-shell .bottom-nav :is(button,.bottom-tab):focus-visible{
    outline:2px solid #04b16d!important;outline-offset:2px
  }
  .layout.exec-shell .executive-dashboard{gap:13px}
  .layout.exec-shell .exec-hero{padding:18px 16px;border-radius:17px}
  .layout.exec-shell .exec-hero h1{font-size:clamp(23px,6vw,29px)}
  .layout.exec-shell .exec-hero-actions button{min-height:44px}
  .layout.exec-shell .exec-wallet{padding:20px 17px;min-height:258px}
  .layout.exec-shell .exec-wallet-amount{font-size:clamp(29px,8vw,42px);overflow-wrap:anywhere}
  .layout.exec-shell .exec-wallet-breakdown strong{font-size:clamp(14px,3.7vw,19px);overflow-wrap:anywhere}
  .layout.exec-shell .exec-metric{min-height:134px;padding:14px 12px}
  .layout.exec-shell .exec-metric:last-child{min-height:110px}
  .layout.exec-shell .exec-metric>strong{font-size:clamp(16px,4.4vw,23px)}
  .layout.exec-shell .exec-panel{padding:17px 14px}
  .layout.exec-shell .exec-panel-head h2{font-size:18px}
  .layout.exec-shell .exec-source-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layout.exec-shell .exec-source-tile{padding:12px}
  .layout.exec-shell .exec-money-panel{padding:16px 13px}
  .layout.exec-shell .exec-bank-summary{padding:15px 12px}
  .layout.exec-shell .exec-bank-balance strong{white-space:normal;overflow-wrap:anywhere}
  .layout.exec-shell .section-head{gap:10px}
  .layout.exec-shell .page-title{font-size:clamp(23px,6vw,29px)}
  .layout.exec-shell .table-row{flex-wrap:wrap}
  .layout.exec-shell .table-buttons{margin-left:0}
  .layout.exec-shell .modal-backdrop{padding:8px 8px max(8px,env(safe-area-inset-bottom,0px))}
  .layout.exec-shell .modal{width:min(100%,530px);max-width:100%;max-height:calc(100dvh - 18px);overflow-y:auto}
  .layout.exec-shell :is(.toolbar,.head-btns,.field-grid,.form-row){min-width:0}
  .layout.exec-shell .toolbar .search{min-width:min(200px,100%)}
  .layout.exec-shell :is(.table-row,.data-row,.exec-recent-row){min-width:0}
  .layout.exec-shell :is(.exec-due-row>b,.exec-recent-row>b){white-space:normal;text-align:right;overflow-wrap:anywhere}
}
@media(max-width:380px){
  .layout.exec-shell .exec-source-grid{grid-template-columns:minmax(0,1fr)}
  .layout.exec-shell .exec-wallet-breakdown{gap:6px}
  .layout.exec-shell .exec-wallet-breakdown>div{padding:8px}
  .layout.exec-shell .exec-wallet-breakdown strong{font-size:13px}
  .layout.exec-shell .top-actions .icon-btn{width:35px;min-width:35px}
  .layout.exec-shell .exec-metric>strong{font-size:16px}
  .layout.exec-shell .bottom-nav .bottom-tab{font-size:9px!important}
}
@media(prefers-reduced-motion:reduce){
  .layout.exec-shell :is(button,.sidebar,.modal,.panel){animation:none!important;transition:none!important}
}

/* Cards de contas reais no início: cores por banco sem interferir em dados. */
.layout.exec-shell .exec-wallets-preview{margin:0}
.layout.exec-shell .exec-wallets-preview .exec-panel-head{margin-bottom:14px}
.layout.exec-shell .exec-wallet-mini-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.layout.exec-shell .exec-wallet-mini{
 --bank-a:#069f61;--bank-b:#027b4c;display:flex;flex-direction:column;align-items:flex-start;
 justify-content:space-between;min-width:0;min-height:116px;gap:10px;text-align:left;
 padding:14px 12px;border-radius:15px;border:1px solid #ffffff31;
 background:linear-gradient(136deg,var(--bank-a),var(--bank-b));color:#fff;
 box-shadow:0 6px 16px #1d523113;cursor:pointer
}
.layout.exec-shell .exec-wallet-mini:hover{filter:brightness(1.04)}
.layout.exec-shell .exec-wallet-mini-symbol{color:#fff;opacity:.96}
.layout.exec-shell .exec-wallet-mini-name{font-size:11px;font-weight:750;color:#fff;opacity:.92;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.layout.exec-shell .exec-wallet-mini strong{color:#fff!important;font:850 clamp(12px,1.7vw,18px)/1.28 'Plus Jakarta Sans',sans-serif;letter-spacing:-.04em;overflow-wrap:anywhere}
.layout.exec-shell .exec-wallet-mini-nubank{--bank-a:#873aff;--bank-b:#5b0ec1}
.layout.exec-shell .exec-wallet-mini-mercado{--bank-a:#1caff6;--bank-b:#066dc9}
.layout.exec-shell .exec-wallet-mini-inter{--bank-a:#ffad31;--bank-b:#ec7716}
.layout.exec-shell .exec-wallet-mini-cash{--bank-a:#05c977;--bank-b:#00894f}
.layout.exec-shell .exec-wallet-mini-picpay{--bank-a:#1ecf7f;--bank-b:#008c62}
@media(max-width:720px){
 .layout.exec-shell .exec-wallet-mini-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
 .layout.exec-shell .exec-wallet-mini{min-height:105px;padding:11px 7px;border-radius:12px;gap:8px}
 .layout.exec-shell .exec-wallet-mini-symbol svg{height:19px;width:19px}
 .layout.exec-shell .exec-wallet-mini-name{font-size:10px}
 .layout.exec-shell .exec-wallet-mini strong{font-size:clamp(10px,2.65vw,13px);line-height:1.2}
}
@media(max-width:350px){
 .layout.exec-shell .exec-wallet-mini-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
 .layout.exec-shell .exec-wallet-mini strong{font-size:15px}
}