/*
 * Finnanza — UI inspirada no padrão TailAdmin
 * Stack preservada: PHP + HTML + CSS + JavaScript puro.
 * Não depende de React, Tailwind runtime ou framework front-end.
 */
:root{
  --primary:#00745F;
  --primary-600:#005F50;
  --primary-50:#EDF7F3;
  --success:#12b76a;
  --success-50:#EAF6F1;
  --danger:#f04438;
  --danger-50:#fef3f2;
  --warning:#f79009;
  --warning-50:#fffaeb;
  --info:#00745F;
  --ink:#183743;
  --heading:#092536;
  --muted:#667A82;
  --muted-2:#9BA7AA;
  --line:#DDE3E1;
  --line-strong:#CBD4D1;
  --canvas:#F7F5F0;
  --surface:#fff;
  --surface-soft:#F1F0EC;
  --sidebar:#092536;
  --sidebar-hover:#183743;
  --sidebar-text:#CBD4D1;
  --shadow-xs:0 1px 2px rgba(16,24,40,.05);
  --shadow-sm:0 1px 3px rgba(16,24,40,.1),0 1px 2px rgba(16,24,40,.06);
  --shadow-md:0 4px 8px -2px rgba(16,24,40,.1),0 2px 4px -2px rgba(16,24,40,.06);
  --shadow-lg:0 12px 16px -4px rgba(16,24,40,.08),0 4px 6px -2px rgba(16,24,40,.03);
  --radius-sm:8px;
  --radius:12px;
  --radius-lg:16px;
}
*{box-sizing:border-box;scrollbar-color:#cbd5e1 transparent}
html{background:var(--canvas)}
body{
  margin:0;
  background:var(--canvas)!important;
  color:var(--ink);
  font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
body:before{display:none!important}
.app-main{margin-left:270px;background:var(--canvas)!important;min-height:100vh}
.content{max-width:1600px;margin:0 auto;padding:30px 32px 120px}

/* Sidebar */
.sidebar{
  width:270px;padding:22px 16px;background:var(--sidebar)!important;
  border:0!important;box-shadow:none!important;
}
.sidebar-brand{padding:0 10px 22px;border-bottom:1px solid rgba(255,255,255,.08)}
.brand-logo{
  width:40px;height:40px;border-radius:10px!important;
  background:var(--primary)!important;color:#fff!important;box-shadow:none!important;
}
.brand-copy strong{font-family:inherit!important;font-size:1rem;color:#fff;font-weight:500;letter-spacing:-.01em}
.brand-copy small{color:#9BA7AA;font-size:.72rem}
.nav-section-label{margin:24px 12px 8px;color:#667A82;font-size:var(--type-caption);font-weight:500;letter-spacing:.11em}
.sidebar-nav{gap:4px;margin-top:10px}
.sidebar-nav a{
  min-height:44px;padding:10px 12px;border:0!important;border-radius:8px!important;
  color:var(--sidebar-text);font-weight:500;transition:background .16s ease,color .16s ease!important;
}
.sidebar-nav a:hover{background:var(--sidebar-hover)!important;color:#fff!important;transform:none!important}
.sidebar-nav a.is-active{
  background:rgba(0,116,95,.16)!important;color:#fff!important;
  border:0!important;padding-left:12px!important;box-shadow:none!important;
}
.sidebar-nav a.is-active .icon{color:#2F8D79!important}
.sidebar-nav a .icon{width:19px;height:19px;color:#9BA7AA}
.sidebar-nav-bottom{border-top:1px solid rgba(255,255,255,.08);padding-top:12px}

/* Header */
.topbar{
  height:78px;padding:0 32px;background:rgba(255,255,255,.97)!important;
  border-bottom:1px solid var(--line)!important;box-shadow:none!important;
  backdrop-filter:saturate(180%) blur(10px)!important;-webkit-backdrop-filter:saturate(180%) blur(10px)!important;
}
.topbar-title h1{font-family:inherit!important;font-size:1.25rem;color:var(--heading);font-weight:500;letter-spacing:-.02em}
.topbar-title p{display:block;color:var(--muted);font-size:.75rem;margin-top:2px}
.avatar{border-radius:10px!important;background:var(--primary-50)!important;color:var(--primary)!important;font-weight:500}
.user-trigger{border-radius:10px!important;border:1px solid transparent;padding:5px 8px}
.user-trigger:hover{background:var(--surface-soft)!important;border-color:var(--line)!important}
.dropdown{border-radius:12px!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-lg)!important;background:#fff!important}
.dropdown a,.dropdown button{border-radius:8px!important}

/* Page heading */
.page-head,.form-page-head{margin-bottom:24px;padding:0!important;border:0!important;min-height:auto}
.page-head h2,.form-page-head h2{
  font-family:inherit!important;font-size:1.5rem!important;font-weight:500!important;
  color:var(--heading)!important;letter-spacing:-.025em!important;
}
.page-head p,.form-page-head p{font-size:.84rem;color:var(--muted);margin-top:5px}
.page-title-icon{display:flex!important;width:38px;height:38px;border-radius:10px;background:var(--primary-50);color:var(--primary)}

/* Panels and cards */
.panel,.form-section,.metric,.entity-card,.mobile-card,.calendar-shell,.empty-state{
  background:var(--surface)!important;border:1px solid var(--line)!important;
  border-radius:var(--radius)!important;box-shadow:var(--shadow-xs)!important;
}
.panel{padding:22px;margin-bottom:22px}
.panel:hover,.entity-card:hover{transform:none!important;box-shadow:var(--shadow-sm)!important}
.panel-head{padding:0 0 16px;margin:0 0 18px;border-bottom:1px solid var(--line)}
.panel-head h2,.panel>h2,.form-section-head h3,.recurrence-copy h3{
  font-family:inherit!important;color:var(--heading);font-weight:500;letter-spacing:-.015em
}
.panel-head>a,.entity-link{color:var(--primary);text-decoration:none;font-weight:500}
.panel-head>a:hover,.entity-link:hover{text-decoration:underline;text-underline-offset:3px}
.form-section{padding:22px}
.form-section-highlight{background:#fff!important;border:1px solid #B9D8CF!important}
.form-section-head{border-bottom:1px solid var(--line);padding-bottom:14px;margin-bottom:20px}
.section-icon{border-radius:9px!important;background:var(--primary-50)!important;color:var(--primary)!important}

/* KPI cards */
.metric-grid{gap:16px}
.metric{position:relative;overflow:hidden;padding:20px;border:1px solid var(--line)!important}
.metric:before{content:"";position:absolute;right:-28px;top:-36px;width:100px;height:100px;border-radius:999px;background:var(--primary-50);opacity:.7}
.metric:nth-child(2):before{background:var(--success-50)}
.metric:nth-child(3):before{background:var(--danger-50)}
.metric:nth-child(4):before{background:var(--warning-50)}
.metric:after{display:none!important}
.metric-label{font-size:.78rem;font-weight:500;color:var(--muted);text-transform:none;letter-spacing:0}
.metric-value{font-size:1.65rem;font-weight:500;color:var(--heading);margin-top:9px;font-variant-numeric:tabular-nums;letter-spacing:-.035em}
.metric small{font-size:.72rem;color:var(--muted)}

/* Buttons */
.button,.icon-button,.quick-add{
  border-radius:8px!important;box-shadow:var(--shadow-xs)!important;
  font-weight:500;letter-spacing:0;transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease!important;
}
.button:hover,.icon-button:hover{transform:none!important;box-shadow:var(--shadow-sm)!important}
.button-primary{background:var(--primary)!important;border-color:var(--primary)!important;color:#fff!important}
.button-primary:hover{background:var(--primary-600)!important;border-color:var(--primary-600)!important}
.button-success{background:var(--success)!important;border-color:var(--success)!important;color:#fff!important}
.button-soft{background:var(--primary-50)!important;color:var(--primary)!important;border-color:#B9D8CF!important}
.button-outline{background:#fff!important;border-color:var(--line-strong)!important;color:#35505B!important}
.button-outline:hover{background:var(--surface-soft)!important}
.button-ghost{background:transparent!important;border-color:transparent!important;color:#4F6670!important;box-shadow:none!important}
.button-danger{background:#fff!important;border-color:#fda29b!important;color:var(--danger)!important}
.icon-button{background:#fff!important;border-color:var(--line)!important;color:#4F6670!important}
.quick-add{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important}

/* Forms */
.field{gap:7px}
.field label{font-size:.78rem;text-transform:none;letter-spacing:0;color:#35505B;font-weight:500}
.field input,.field select,.field textarea,.input-prefix,.input-suffix{
  min-height:46px;border:1px solid var(--line-strong)!important;border-radius:8px!important;
  background:#fff!important;box-shadow:var(--shadow-xs)!important;color:var(--heading)
}
.field input::placeholder,.field textarea::placeholder{color:#9BA7AA}
.field input:hover,.field select:hover,.field textarea:hover{border-color:#9BA7AA!important}
.field input:focus,.field select:focus,.field textarea:focus,.input-prefix:focus-within,.input-suffix:focus-within{
  outline:none!important;border-color:#2F8D79!important;box-shadow:0 0 0 4px rgba(0,116,95,.12)!important
}
.input-prefix>span,.input-suffix>span{background:var(--surface-soft)!important;border-color:var(--line)!important;color:#4F6670}
.checkbox input{accent-color:var(--primary)}
.form-actions{border-top:1px solid var(--line)}
.divider{color:var(--heading);border-bottom:1px solid var(--line);padding-bottom:8px}
.section-note{background:var(--primary-50);border:1px solid #B9D8CF;border-radius:8px;color:#35505B}

/* Type selector */
.type-selector{gap:10px;border:0!important;background:transparent!important}
.type-option>span{
  min-height:72px;border:1px solid var(--line-strong)!important;border-radius:10px!important;
  background:#fff!important;box-shadow:var(--shadow-xs)!important
}
.type-option input:checked+span{background:var(--primary-50)!important;border-color:var(--primary)!important;box-shadow:0 0 0 3px rgba(0,116,95,.1)!important}
.type-expense input:checked+span{background:var(--danger-50)!important;border-color:var(--danger)!important;box-shadow:0 0 0 3px rgba(240,68,56,.09)!important}
.type-option input:focus-visible+span{outline:none;box-shadow:0 0 0 4px rgba(0,116,95,.14)!important}
.toggle-group{background:var(--surface-soft);border-radius:9px;padding:3px}
.toggle-group span{border-radius:7px}
.toggle-group input:checked+span{box-shadow:var(--shadow-xs);background:#fff;border:1px solid var(--line)}
.badge{border-radius:999px;border:0!important;padding:4px 9px;font-weight:500}

/* Tables */
.table-panel{padding:0!important;overflow:hidden}
.table-wrap{border-radius:var(--radius)!important}
.data-table{font-variant-numeric:tabular-nums}
.data-table th{
  background:#F7F5F0!important;color:#4F6670;border-bottom:1px solid var(--line)!important;
  font-size:var(--type-caption);letter-spacing:.045em;padding:13px 16px;text-transform:uppercase
}
.data-table td{padding:15px 16px;border-bottom:1px solid var(--line)!important;color:#35505B}
.data-table tbody tr:nth-child(even){background:#fff}
.data-table tbody tr:hover{background:#F7F5F0!important}
.table-actions{border:1px solid var(--line)!important;border-radius:8px!important;background:#fff!important;padding:3px}
.pagination a,.pagination span{border-radius:8px!important}
.pagination .current{background:var(--primary)!important;color:#fff!important;border-color:var(--primary)!important}

/* Entities, reports, calendar */
.entity-card{overflow:hidden;padding:18px;border-top:1px solid var(--line)!important}
.entity-card:before{display:none!important}
.entity-card-footer{border-top:1px solid var(--line)}
.progress{height:7px;border-radius:999px;background:#E5E9E7}
.progress span{border-radius:999px;background:var(--primary)}
.calendar-shell{padding:0;overflow:hidden}
.calendar-grid{border-radius:0!important;border-color:var(--line)!important}
.calendar-weekday{background:#F7F5F0!important;color:#4F6670;letter-spacing:.04em}
.calendar-day{background:#fff!important;border-color:var(--line)!important}
.calendar-day:hover{background:#F7F5F0!important;box-shadow:none!important}
.calendar-event{border-radius:6px;border-left:3px solid var(--primary);background:var(--primary-50)}
.calendar-event.expense{border-left-color:var(--danger);background:var(--danger-50)}
.date-chip{border-radius:7px;background:var(--primary-50);border:1px solid #B9D8CF;color:var(--primary)}
.upcoming-item{border-bottom:1px solid var(--line)}
.debt-summary,.simulator-result{background:var(--sidebar)!important;border-radius:var(--radius)!important;border:0!important;box-shadow:var(--shadow-md)!important}
.empty-state{border-style:dashed!important;background:#fff!important}
.empty-state-icon,.compact-empty>span{border-radius:10px;background:var(--primary-50);color:var(--primary)}
.alert{border-radius:10px!important;box-shadow:var(--shadow-xs)!important}

/* Modal */
.modal-backdrop{background:rgba(16,24,40,.56)!important;backdrop-filter:blur(2px)!important;-webkit-backdrop-filter:blur(2px)!important}
.modal-card{border-radius:16px!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-lg)!important;background:#fff!important}
.modal-close{border-radius:8px!important;background:var(--surface-soft)!important}

/* Bottom navigation */
.bottom-nav{
  background:rgba(255,255,255,.98)!important;border-top:1px solid var(--line)!important;
  box-shadow:0 -8px 24px rgba(16,24,40,.08)!important;
  grid-template-columns:repeat(5,minmax(0,1fr))!important;
}
.bottom-nav a,.bottom-nav button{color:#667A82!important}
.bottom-nav .is-active{color:var(--primary)!important}
.bottom-nav .bottom-add{
  grid-column:3!important;justify-self:center!important;align-self:center!important;
  width:58px!important;height:58px!important;border-radius:16px!important;
  background:var(--primary)!important;color:#fff!important;border:5px solid #fff!important;
  box-shadow:0 8px 18px rgba(0,116,95,.3)!important
}

@media(max-width:1100px){
  .app-main{margin-left:0}
  .sidebar{border-right:0!important}
  .topbar{padding-left:max(20px,env(safe-area-inset-left,0px));padding-right:max(20px,env(safe-area-inset-right,0px))}
  .content{padding:24px 20px 120px}
}
@media(max-width:700px){
  .topbar{height:auto;min-height:76px;padding-top:max(12px,env(safe-area-inset-top,0px))!important}
  .content{padding:18px max(14px,env(safe-area-inset-right,0px)) 150px max(14px,env(safe-area-inset-left,0px))}
  .page-head{margin-bottom:16px}
  .page-head h2,.form-page-head h2{font-size:1.25rem!important}
  .page-head p,.form-page-head p{display:none}
  .panel,.form-section{padding:16px;border-radius:12px!important}
  .panel-head{padding-bottom:12px;margin-bottom:14px}
  .metric-grid{gap:10px}
  .metric{padding:15px 14px}
  .metric-label{font-size:.7rem}
  .metric-value{font-size:1.12rem}
  .type-selector{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:7px!important}
  .type-option>span{min-height:64px!important;padding:8px 3px!important;border-radius:9px!important}
  .type-option strong{font-size:var(--type-caption)!important}
  .field input,.field select,.field textarea{font-size:1rem;width:100%;max-width:100%}
  .form-grid,.date-grid{grid-template-columns:minmax(0,1fr)!important}
  .advanced-options-trigger{border-radius:10px!important;background:#fff!important;border:1px solid var(--line)!important;box-shadow:var(--shadow-xs)!important}
  .professional-form-actions{
    position:relative!important;bottom:auto!important;margin:18px 0 44px!important;padding:16px 0 0!important;
    background:transparent!important;border-top:1px solid var(--line)!important;
  }
  .professional-form-actions .button{min-height:50px}
  .modal-card{border-radius:16px 16px 0 0!important;box-shadow:var(--shadow-lg)!important;border-bottom:0!important}
  .entry-mode-options{gap:10px}
  .entry-mode-option{padding:16px 10px;border-radius:12px!important}
  .bottom-nav{padding-bottom:max(8px,env(safe-area-inset-bottom,0px))!important;padding-left:max(4px,env(safe-area-inset-left,0px))!important;padding-right:max(4px,env(safe-area-inset-right,0px))!important}
}
@media(max-width:430px){
  .metric-grid{grid-template-columns:1fr 1fr}
  .page-head>.actions{width:100%}
  .page-head>.actions .button{flex:1}
}

/* 1.6.1 — Correção global de contraste e autenticação */
:root{
  --muted:#4F6670;
  --muted-2:#667A82;
}

/* A página de autenticação precisa manter contraste próprio, sem herdar o canvas claro do app. */
body.auth-page,
body.install-page{
  background:#092536!important;
  color:#F7F5F0;
}
.auth-page .auth-shell,
.install-page .install-shell{
  position:relative;
  background:linear-gradient(135deg,#092536 0%,#172554 48%,#f3f6fb 48%,#f3f6fb 100%)!important;
}
.auth-page .auth-intro,
.install-page .install-intro{
  color:#fff!important;
}
.auth-page .auth-intro .eyebrow,
.install-page .install-intro .eyebrow{
  color:#D7EAE4!important;
  opacity:1!important;
}
.auth-page .auth-intro h1,
.install-page .install-intro h1{
  color:#fff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.12);
}
.auth-page .auth-intro>p:not(.eyebrow),
.install-page .install-intro>p:not(.eyebrow){
  color:#EAF6F1!important;
  opacity:1!important;
}
.auth-page .brand-mark,
.install-page .brand-mark{
  background:#14b8a6!important;
  color:#fff!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.18)!important;
}
.auth-page .auth-card,
.install-page .install-card{
  background:#fff!important;
  color:#183743!important;
  border:1px solid #DDE3E1!important;
  box-shadow:0 24px 64px rgba(15,23,42,.22)!important;
}
.auth-page .auth-card h2,
.install-page .install-card h2{
  color:#092536!important;
}
.auth-page .auth-card>p,
.install-page .install-card>p,
.auth-page .auth-footer,
.install-page .auth-footer{
  color:#4F6670!important;
}
.auth-page .field label,
.install-page .field label{
  color:#35505B!important;
}
.auth-page .field input,
.auth-page .field select,
.auth-page .field textarea,
.install-page .field input,
.install-page .field select,
.install-page .field textarea{
  color:#092536!important;
  background:#fff!important;
  border-color:#9BA7AA!important;
}
.auth-page .field input::placeholder,
.auth-page .field textarea::placeholder,
.install-page .field input::placeholder,
.install-page .field textarea::placeholder{
  color:#667A82!important;
  opacity:1;
}
.auth-page .auth-footer a,
.install-page .auth-footer a{
  color:#08776b!important;
  text-decoration-thickness:2px;
  text-underline-offset:3px;
}
.auth-page .auth-footer a:hover,
.install-page .auth-footer a:hover{
  color:#065f56!important;
  text-decoration:underline;
}
.auth-page .password-toggle,
.install-page .password-toggle{
  color:#4F6670!important;
}
.auth-page .button-primary,
.install-page .button-primary{
  background:#00745F!important;
  border-color:#00745F!important;
  color:#fff!important;
}
.auth-page .button-primary:hover,
.install-page .button-primary:hover{
  background:#00745F!important;
  border-color:#00745F!important;
}

/* Contraste mínimo mais forte nas áreas operacionais. */
.page-head p,.form-page-head p,.topbar-title p,.metric-label,.metric small,
.field-help,.help-text,.empty-state p,.compact-empty p{
  color:#4F6670!important;
}
.bottom-nav a,.bottom-nav button{color:#4F6670!important}
.data-table th{color:#35505B!important}

@media(max-width:850px){
  body.auth-page,
  body.install-page{
    background:#092536!important;
  }
  .auth-page .auth-shell,
  .install-page .install-shell{
    min-height:100dvh;
    padding:
      max(28px,env(safe-area-inset-top,0px))
      max(20px,env(safe-area-inset-right,0px))
      max(32px,env(safe-area-inset-bottom,0px))
      max(20px,env(safe-area-inset-left,0px));
    gap:28px;
    background:linear-gradient(180deg,#092536 0,#172554 43%,#eef2f7 43%,#eef2f7 100%)!important;
  }
  .auth-page .auth-intro,
  .install-page .install-intro{
    padding:12px 8px 8px!important;
  }
  .auth-page .auth-intro h1,
  .install-page .install-intro h1{
    font-size:clamp(2.25rem,10vw,3.25rem)!important;
    line-height:1.02;
  }
  .auth-page .auth-intro>p:not(.eyebrow),
  .install-page .install-intro>p:not(.eyebrow){
    font-size:1rem!important;
    line-height:1.55;
  }
  .auth-page .auth-card,
  .install-page .install-card{
    border-radius:20px!important;
    padding:28px 24px!important;
    box-shadow:0 20px 48px rgba(15,23,42,.2)!important;
  }
}


/* Notificações de conclusão: temporárias e sem deslocar o conteúdo. */
.alert[data-auto-dismiss]{
  position:fixed;
  z-index:1400;
  top:max(16px,calc(env(safe-area-inset-top,0px) + 16px));
  right:max(16px,env(safe-area-inset-right,0px));
  width:min(420px,calc(100vw - 32px));
  margin:0!important;
  box-shadow:0 12px 32px rgba(15,23,42,.16);
  opacity:1;
  transform:translateY(0);
  transition:opacity .24s ease,transform .24s ease;
  cursor:pointer;
}
.alert[data-auto-dismiss].is-leaving{
  opacity:0;
  transform:translateY(-8px);
  pointer-events:none;
}
@media(max-width:850px){
  .alert[data-auto-dismiss]{
    top:max(72px,calc(env(safe-area-inset-top,0px) + 62px));
    left:16px;
    right:16px;
    width:auto;
  }
  .auth-page .alert[data-auto-dismiss],
  .install-page .alert[data-auto-dismiss]{
    top:max(16px,calc(env(safe-area-inset-top,0px) + 16px));
  }
}
@media(prefers-reduced-motion:reduce){
  .alert[data-auto-dismiss]{transition:none!important}
}


/* 1.17.0 — prefixos monetários usam uma única borda visual */
.input-prefix>input,
.input-suffix>input{
  flex:1 1 auto;
  width:100%;
  min-width:0;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  background:transparent!important;
}
.input-prefix>input:focus,
.input-suffix>input:focus{
  border:0!important;
  box-shadow:none!important;
  outline:none!important;
}