/* Juntô 2.0.2 — revisão de estabilidade visual e temas */
:root,
:root[data-theme="dark"]{
  --v2-bg:#0A1440;
  --v2-surface:#12193f;
  --v2-surface-2:#182055;
  --v2-text:#EEF0FA;
  --v2-muted:#9AA3C9;
  --v2-faint:#6B76A0;
  --v2-primary:#0066FF;
  --v2-primary-dark:#0052CC;
  --v2-border:#24306b;
  --v2-positive:#35d0a0;
  --v2-negative:#ff806c;
  --v2-warning:#f4b84b;
  --v2-shadow:0 14px 36px rgba(0,0,0,.28);
  --v2-soft-shadow:0 6px 20px rgba(0,0,0,.18);
  --v2-radius:16px;
  color-scheme:dark;
}
:root[data-theme="light"]{
  --v2-bg:#F7F9FC;
  --v2-surface:#ffffff;
  --v2-surface-2:#E2E6EF;
  --v2-text:#0A1440;
  --v2-muted:#5D6680;
  --v2-faint:#667085;
  --v2-primary:#0066FF;
  --v2-primary-dark:#0052CC;
  --v2-border:#E2E6EF;
  --v2-positive:#078c66;
  --v2-negative:#d84f42;
  --v2-warning:#bf7414;
  --v2-shadow:0 12px 30px rgba(27,39,70,.09);
  --v2-soft-shadow:0 5px 18px rgba(27,39,70,.06);
  color-scheme:light;
}

html,body{background:var(--v2-bg)!important;color:var(--v2-text)!important}
body{letter-spacing:-.01em}
.app-shell{max-width:none;min-height:calc(100vh - 76px);background:var(--v2-bg)!important}
.version-badge{opacity:.72;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--v2-muted)}

/* Cabeçalho e navegação */
.site-header{height:72px;background:color-mix(in srgb,var(--v2-surface) 94%,transparent)!important;border-bottom:1px solid var(--v2-border)!important;backdrop-filter:blur(16px);position:fixed;inset:0 0 auto 0;width:100%;z-index:60}
.header-inner{max-width:1440px;margin:auto;padding:0 28px;height:100%}
.site-logo{max-height:34px}
.site-nav-item{height:42px;border-radius:10px;color:var(--v2-muted)!important;font-weight:700;transition:.18s}
.site-nav-item:hover{background:color-mix(in srgb,var(--v2-primary) 10%,transparent);color:var(--v2-primary)!important}
.site-nav-item.active{background:color-mix(in srgb,var(--v2-primary) 14%,transparent);color:var(--v2-primary)!important}
.header-theme,.user-profile,.iconbtn{background:var(--v2-surface-2)!important;border-color:var(--v2-border)!important;color:var(--v2-text)!important}
.user-copy strong{color:var(--v2-text)!important}.user-copy small{color:var(--v2-muted)!important}.menu-dot{background:var(--v2-negative)}

/* Estrutura */
.screen{max-width:1440px;margin:0 auto;padding:26px 28px 96px;background:transparent!important;color:var(--v2-text)}
.screen:not(#screen-eventos){padding-top:22px}
.screen:has(>.topbar),#screen-evento.screen{padding-top:12px!important}
.topbar{background:var(--v2-surface)!important;border:1px solid var(--v2-border)!important;border-radius:14px;padding:13px 15px;margin-bottom:18px;box-shadow:var(--v2-soft-shadow)}
.topbar .title,.section-title,h1,h2,h3,.name,strong{color:var(--v2-text)}
.topbar .sub,.meta,.note,.field-help,.participants-directory-head p{color:var(--v2-muted)!important}
.content{color:var(--v2-text)}
.event-tab-heading{
  margin:0 0 14px;
  padding:13px 15px;
  border:1px solid var(--v2-border);
  border-radius:14px;
  background:var(--v2-surface);
  box-shadow:var(--v2-soft-shadow);
  color:var(--v2-text)!important;
}
.event-tab-panel{
  padding:18px;
  border:1px solid var(--v2-border);
  border-radius:18px;
  background:var(--v2-surface);
  box-shadow:var(--v2-soft-shadow);
}
.event-tab-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  margin:0;
  padding:0 0 13px;
  border-bottom:1px solid var(--v2-border);
}
.event-tab-panel-head .section-title{margin:0 0 4px}
.event-tab-panel-head p{margin:0;color:var(--v2-muted);font-size:12px}
.event-participants-action{flex:0 0 auto;width:auto!important;margin:0}
.event-participants-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px;
  padding-top:14px;
}
#screen-evento .event-participants-list .participant-row{
  min-width:0;
  margin:0;
  padding:12px;
  border:1px solid var(--v2-border);
  border-radius:14px;
  background:var(--v2-surface-2);
  transition:border-color .18s ease,background .18s ease,transform .18s ease;
}
#screen-evento .event-participants-list .participant-row:hover{
  border-color:color-mix(in srgb,var(--v2-primary) 42%,var(--v2-border));
  background:color-mix(in srgb,var(--v2-primary) 5%,var(--v2-surface-2));
  transform:translateY(-1px);
}
#screen-evento .event-participants-list .participant-row:last-child{border-bottom:1px solid var(--v2-border)}
.event-activities-list{display:grid;gap:9px;padding-top:14px}
#screen-evento .event-activities-list .activity-item{
  position:relative;
  display:grid;
  grid-template-columns:10px minmax(0,1fr);
  gap:11px;
  margin:0;
  padding:12px 14px;
  border:1px solid var(--v2-border);
  border-radius:14px;
  background:var(--v2-surface-2);
}
#screen-evento .event-activities-list .activity-dot{margin-top:6px}
#screen-evento .event-activities-list .activity-time{margin-top:4px;color:var(--v2-muted)}

@media(max-width:760px){
  .event-tab-panel{padding:15px}
  .event-participants-list{grid-template-columns:1fr}
}
@media(max-width:560px){
  .event-tab-panel-head{align-items:stretch;flex-direction:column;gap:11px}
  .event-participants-action{width:100%!important;justify-content:center}
  #screen-evento .event-participants-list .participant-row,
  #screen-evento .event-activities-list .activity-item{padding:11px 12px}
}

@media(min-width:1101px){
  .header-inner{
    width:100%;
    max-width:1440px;
    padding-inline:120px;
  }
  .screen{padding-inline:120px;--screen-inline-gutter:120px}
}

/* Dashboard */
.v2-dashboard{margin-bottom:22px}
.v2-welcome{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:16px}
#screen-eventos .v2-dashboard{margin-bottom:14px}
#screen-eventos .v2-welcome{margin-bottom:0}
.v2-eyebrow{display:block;color:var(--v2-primary);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:5px}
.v2-welcome h1{font-family:Inter,sans-serif;font-size:clamp(28px,3vw,40px);line-height:1.08;margin:0 0 7px;color:var(--v2-text)!important}
.v2-welcome p{margin:0;color:var(--v2-muted)!important}
.v2-primary-action{flex:0 0 auto!important;width:auto!important;min-width:148px;min-height:42px!important;height:42px!important;padding:0 18px!important;border-radius:11px!important;box-shadow:0 8px 20px color-mix(in srgb,var(--v2-primary) 24%,transparent)}
.v2-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.v2-kpi{display:flex;align-items:center;gap:13px;background:var(--v2-surface)!important;border:1px solid var(--v2-border)!important;border-radius:var(--v2-radius);padding:16px;box-shadow:var(--v2-soft-shadow);min-height:100px;color:var(--v2-text)}
.v2-kpi:hover{transform:translateY(-1px);box-shadow:var(--v2-shadow);transition:.18s}
.v2-kpi-icon{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;flex:0 0 auto}
.v2-kpi-icon .icon{width:21px;height:21px}.v2-kpi-icon.positive{background:color-mix(in srgb,var(--v2-positive) 14%,transparent);color:var(--v2-positive)}.v2-kpi-icon.negative{background:color-mix(in srgb,var(--v2-negative) 14%,transparent);color:var(--v2-negative)}.v2-kpi-icon.neutral{background:color-mix(in srgb,var(--v2-primary) 14%,transparent);color:var(--v2-primary)}.v2-kpi-icon.balance{background:color-mix(in srgb,var(--v2-warning) 16%,transparent);color:var(--v2-warning)}
.v2-kpi small,.v2-kpi em{display:block;color:var(--v2-muted)!important;font-style:normal}.v2-kpi small{font-weight:700;margin-bottom:3px}.v2-kpi strong{display:block;font:800 21px/1.2 Inter,sans-serif;margin-bottom:3px;color:var(--v2-text)!important}.v2-kpi em{font-size:11px}

/* Superfícies, listas e cards */
.events-panel,.content,.summary-card,.finance-card,.directory-card,.profile-card,.profile-section,.modal-card,.participants-directory-panel,.participant-directory-card,.event-project-card,.expense-row,.debt-card,.participant-card,.alert-row,.contact-directory-card,.card{
  background:var(--v2-surface)!important;border-color:var(--v2-border)!important;color:var(--v2-text)!important;box-shadow:var(--v2-soft-shadow)
}
.events-panel{border-radius:var(--v2-radius);padding:20px}.panel-heading{align-items:flex-end}.panel-heading h2{font-size:21px;color:var(--v2-text)!important}.panel-heading p{color:var(--v2-muted)!important}
.event-filter-group,.seg-row,.event-tabs{background:var(--v2-surface-2)!important;padding:4px;border-radius:11px;gap:3px;border:1px solid var(--v2-border)}
.home-filter,.seg{border-radius:8px!important;color:var(--v2-muted)!important;background:transparent!important;border-color:transparent!important;min-height:36px!important;height:36px!important}
.home-filter:hover,.seg:hover{color:var(--v2-text)!important}
.home-filter.active,.seg.active{background:var(--v2-surface)!important;box-shadow:0 3px 10px rgba(0,0,0,.12);color:var(--v2-primary)!important;border-color:var(--v2-border)!important}
.home-filter span{background:var(--v2-surface-2)!important;color:var(--v2-muted)!important}.home-filter.active span{background:color-mix(in srgb,var(--v2-primary) 16%,transparent)!important;color:var(--v2-primary)!important}
.event-project-card{border-radius:14px!important;transition:.18s}.event-project-card:hover{border-color:color-mix(in srgb,var(--v2-primary) 48%,var(--v2-border))!important;transform:translateY(-1px);box-shadow:var(--v2-shadow)}
.event-project-title h3,.event-stats strong,.participant-directory-info strong{color:var(--v2-text)!important}.event-project-title p,.event-stats span,.participant-directory-info span,.participant-directory-info small{color:var(--v2-muted)!important}
.event-list-icon{border-radius:12px}.event-status{border-radius:999px}.status-active{color:#fff!important}.status-finished{color:#075f4d!important}

/* Botões: impede crescimento exagerado fora de barras próprias */
.btn{border-radius:10px;min-height:40px;height:auto;font-weight:750;transition:.16s}
.btn-primary{background:linear-gradient(150deg,#00C6B3,var(--v2-primary))!important;border-color:transparent!important;color:#fff!important}
.btn-primary:hover{filter:brightness(.96)}
.btn-secondary{background:var(--v2-surface-2)!important;border:1px solid var(--v2-border)!important;color:var(--v2-text)!important}
.home-new-event-action,.participants-add-contact,.btn-compact{flex:0 0 auto!important;width:auto!important;min-height:38px!important;height:38px!important;padding:0 14px!important;border-radius:10px!important}
.participant-directory-actions button{background:var(--v2-surface-2)!important;border-color:var(--v2-border)!important;color:var(--v2-muted)!important}
.participant-directory-actions button:hover{color:var(--v2-primary)!important;border-color:var(--v2-primary)!important}
.global-expense-fab{left:50%!important;right:auto!important;bottom:24px!important;transform:translateX(-50%)!important;width:240px!important;max-width:calc(100vw - 32px);height:46px!important;padding:0 18px!important;border-radius:999px!important;box-shadow:0 13px 28px color-mix(in srgb,var(--v2-primary) 30%,transparent);background:linear-gradient(150deg,#00C6B3,var(--v2-primary))!important}
.global-expense-fab:hover{transform:translate(-50%,-1px)!important}

/* Formulários e leitura */
.input,.field input,.field select,select,textarea{border-radius:10px!important;border:1px solid var(--v2-border)!important;background:var(--v2-surface-2)!important;color:var(--v2-text)!important;min-height:44px}
.input::placeholder,input::placeholder,textarea::placeholder{color:var(--v2-faint)!important;opacity:1}
.input:focus,.field input:focus,.field select:focus,select:focus,textarea:focus{outline:3px solid color-mix(in srgb,var(--v2-primary) 18%,transparent)!important;border-color:var(--v2-primary)!important}
select option{background:var(--v2-surface)!important;color:var(--v2-text)!important}
.field-label,label{color:var(--v2-muted)}

/* Modais, login e overlays */
.modal-overlay{backdrop-filter:blur(5px);background:rgba(4,7,16,.68)!important}.modal-card{border-radius:18px!important}
.login-shell,.login-card,.auth-card,.account-editor-card{background:var(--v2-surface)!important;color:var(--v2-text)!important;border-color:var(--v2-border)!important}
.auth-subtitle,.auth-divider,.login-card p{color:var(--v2-muted)!important}

/* Rodapé mobile */
.bottomnav{background:color-mix(in srgb,var(--v2-surface) 96%,transparent)!important;border-top:1px solid var(--v2-border)!important;backdrop-filter:blur(16px)}.navitem{color:var(--v2-muted)!important}.navitem.active{color:var(--v2-primary)!important}

/* Acessibilidade */
.iconbtn:focus-visible,.btn:focus-visible,.site-nav-item:focus-visible,.navitem:focus-visible,.event-project-card:focus-visible{outline:3px solid color-mix(in srgb,var(--v2-primary) 34%,transparent);outline-offset:2px}

@media(max-width:1100px){.v2-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.header-inner{padding:0 18px}.screen{padding-left:20px;padding-right:20px}.site-nav-item span{display:none}.site-nav-item{width:42px;justify-content:center}}
@media(max-width:720px){
  .site-header{height:60px}.header-inner{padding:0 13px}.site-nav{display:none}.user-copy{display:none}.site-logo{max-width:122px}.screen{padding:16px 13px 92px}
  .v2-welcome{align-items:flex-start}.v2-welcome p{font-size:13px}.v2-primary-action{width:42px!important;min-width:42px!important;height:42px!important;padding:0!important;font-size:0}.v2-primary-action .icon{margin:0}
  .v2-kpi-grid{grid-template-columns:1fr 1fr;gap:9px}.v2-kpi{padding:13px;min-height:98px;display:block}.v2-kpi-icon{width:34px;height:34px;border-radius:10px;margin-bottom:8px}.v2-kpi strong{font-size:17px}.v2-kpi em{display:none}
  .events-panel{padding:14px;border-radius:14px}.panel-heading{align-items:flex-start}.home-toolbar{width:100%}.event-filter-group{overflow:auto;max-width:100%}.home-new-event-action{display:none!important}
  .topbar{border-radius:12px;margin-bottom:13px}.event-header-actions .btn{font-size:0;width:40px!important;min-width:40px!important;padding:0!important}.event-header-actions .btn .icon{margin:0}.content{border-radius:14px}.bottomnav{display:flex!important}
}
@media(max-width:420px){.v2-kpi-grid{grid-template-columns:1fr}.v2-kpi{display:flex;min-height:82px}.v2-kpi-icon{margin:0}.v2-kpi em{display:block}.v2-welcome h1{font-size:27px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation:none!important;transition:none!important}}

/* Autenticação: usa integralmente o tema ativo */
body.auth-mode{background:var(--v2-bg)!important}
body.auth-mode .app-shell{background:var(--v2-bg)!important}
.auth-screen{background:var(--v2-bg)!important;color:var(--v2-text)!important}
.auth-content{background:transparent!important}
.auth-intro strong,.auth-footer b,.auth-test-note strong{color:var(--v2-text)!important}
.auth-intro span,.auth-footer,.auth-test-note{color:var(--v2-muted)!important}
.auth-btn{background:var(--v2-surface)!important;border:1px solid var(--v2-border)!important;color:var(--v2-text)!important;box-shadow:none!important}
.auth-btn:hover{border-color:var(--v2-primary)!important;background:var(--v2-surface-2)!important}
.auth-divider{color:var(--v2-muted)!important}.auth-divider::before,.auth-divider::after{background:var(--v2-border)!important}
.auth-test-note{background:var(--v2-surface-2)!important;border-color:var(--v2-border)!important}


/* Juntô 2.0.2 — limpeza estrutural e padronização das ações */
.v2-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.v2-welcome{align-items:flex-start}
.v2-primary-action{display:none!important}

/* Remove o painel cinza que envolvia blocos já individualizados em cards. */
#screen-evento > .content,
#screen-financeiro > .content,
#screen-resumo-participante-dividas > .content,
#screen-divida > .content,
#screen-alertas > .content,
#screen-historico > .content,
#screen-participantes > .content,
#screen-participante > .content,
#screen-despesa-detalhe > .content,
#screen-perfil > .content{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  border-radius:0!important;
  padding-left:0!important;
  padding-right:0!important;
}

/* Ações principais sempre em azul e com dimensões consistentes. */
.btn-primary,
.home-new-event-action,
.home-new-expense-action,
.event-header-actions .btn-primary,
.participants-add-contact{
  background:var(--v2-primary)!important;
  border-color:var(--v2-primary)!important;
  color:#fff!important;
  box-shadow:0 8px 20px color-mix(in srgb,var(--v2-primary) 24%,transparent)!important;
}
.btn-primary:hover,
.home-new-event-action:hover,
.home-new-expense-action:hover,
.participants-add-contact:hover{
  background:var(--v2-primary-dark)!important;
  border-color:var(--v2-primary-dark)!important;
  filter:none!important;
}
.home-new-event-action,.home-new-expense-action{
  flex:0 0 auto!important;
  width:auto!important;
  min-height:38px!important;
  height:38px!important;
  padding:0 14px!important;
  border-radius:10px!important;
  gap:7px;
}
@media(max-width:1100px){.v2-kpi-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:720px){
  .v2-kpi-grid{grid-template-columns:1fr 1fr}
  .home-toolbar{display:flex;flex-wrap:wrap;gap:8px}
  .event-filter-group{flex:1 1 100%}
  .home-new-event-action,.home-new-expense-action{display:inline-flex!important;flex:1 1 calc(50% - 4px)!important;justify-content:center}
}
@media(max-width:420px){.v2-kpi-grid{grid-template-columns:1fr}.home-new-event-action,.home-new-expense-action{flex-basis:100%!important}}

/* Juntô 2.0.3 — alinhamento do cabeçalho Meus eventos */
#screen-eventos .panel-heading{
  display:grid!important;
  grid-template-columns:minmax(190px,1fr) auto minmax(max-content,1fr);
  align-items:center!important;
  gap:18px;
}
#screen-eventos .home-toolbar{
  display:contents!important;
}
#screen-eventos .event-filter-group{
  grid-column:2;
  justify-self:center;
  margin:0!important;
  padding:4px!important;
}
#screen-eventos .home-event-actions{
  grid-column:3;
  justify-self:end;
  display:flex;
  align-items:center;
  gap:9px;
}
#screen-eventos .home-new-expense-action{
  flex:0 0 auto!important;
  width:auto!important;
  min-height:38px!important;
  height:38px!important;
  padding:0 14px!important;
  color:var(--v2-primary)!important;
  background:transparent!important;
  border:1px solid color-mix(in srgb,var(--v2-primary) 62%,var(--v2-border))!important;
  box-shadow:none!important;
}
#screen-eventos .home-new-expense-action:hover{
  color:#fff!important;
  background:var(--v2-primary-dark)!important;
  border-color:var(--v2-primary-dark)!important;
  box-shadow:0 6px 16px color-mix(in srgb,var(--v2-primary) 18%,transparent)!important;
}
#screen-eventos .home-new-event-action{
  box-shadow:0 8px 20px color-mix(in srgb,var(--v2-primary) 24%,transparent)!important;
}

@media(max-width:980px){
  #screen-eventos .panel-heading{
    grid-template-columns:1fr auto;
  }
  #screen-eventos .panel-heading>div:first-child{grid-column:1}
  #screen-eventos .event-filter-group{grid-column:1 / -1;grid-row:2;justify-self:center}
  #screen-eventos .home-event-actions{grid-column:2;grid-row:1}
}
@media(max-width:720px){
  #screen-eventos .panel-heading{
    display:flex!important;
    flex-direction:column!important;
    align-items:stretch!important;
    gap:12px;
  }
  #screen-eventos .home-toolbar{display:contents!important}
  #screen-eventos .event-filter-group{
    width:100%!important;
    justify-content:center;
    overflow-x:auto;
  }
  #screen-eventos .home-event-actions{
    width:100%;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:8px;
  }
  #screen-eventos .home-new-event-action,
  #screen-eventos .home-new-expense-action{
    display:inline-flex!important;
    width:100%!important;
    justify-content:center;
  }
}
/* Juntô 2.0.4 — cartão de identidade e seções do perfil */
.profile-card{
  display:flex;
  flex-direction:column;
  align-items:center;
  text-align:center;
  gap:6px;
  padding:26px 22px;
  margin-bottom:18px;
  border:1px solid var(--v2-border);
  border-radius:var(--v2-radius);
}
.profile-card .avatar-account{margin-bottom:6px}
.profile-card-name{font-weight:700;font-size:16px;margin-bottom:2px}
.profile-card-detail{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:13px;
  color:var(--v2-muted);
}
.profile-card-detail .icon{width:15px;height:15px;flex:0 0 auto;stroke:var(--v2-muted)}
.profile-section{
  padding:6px 18px;
  margin-bottom:18px;
  border:1px solid var(--v2-border);
  border-radius:var(--v2-radius);
}
.profile-section .section-title{margin-top:14px}
.profile-section .settings-row:first-of-type{padding-top:4px}

@media(max-width:420px){
  #screen-eventos .home-event-actions{grid-template-columns:1fr}
}