/* ==========================================================================
   FechAí — padrão visual verde-escuro v1
   Camada final de estabilidade visual. Mantém o gerenciador com a identidade
   da plataforma e deixa a cor personalizada restrita à vitrine do cliente.
   ========================================================================== */

:root{
  --fechai-green:#0b6b46;
  --fechai-green-dark:#063f2b;
  --fechai-green-deep:#042b1e;
  --fechai-green-soft:#e8f4ee;
  --fechai-green-line:#cfe2d8;
  --fechai-page:#f5f8f6;
  --fechai-ink:#17241e;
  --fechai-muted:#66746d;
}

/* Gerenciador: identidade fixa da plataforma. A cor da loja continua disponível
   nos controles de personalização e na vitrine pública, sem recolorir o painel. */
#screen-commerce-app:not(.vf-pdv-focus){
  --primary:var(--fechai-green)!important;
  --primary-dark:var(--fechai-green-dark)!important;
  --fechai-manager-accent:var(--fechai-green)!important;
  --fechai-manager-accent-dark:var(--fechai-green-dark)!important;
  --fechai-manager-accent-soft:var(--fechai-green-soft)!important;
  --fechai-manager-accent-glow:rgba(11,107,70,.16)!important;
  --fechai-manager-accent-glow-strong:rgba(11,107,70,.28)!important;
  --fechai-manager-graphite:var(--fechai-green-deep)!important;
  --fechai-manager-graphite-2:#0a3828!important;
  --fechai-manager-cream:var(--fechai-page)!important;
  --fechai-manager-ink:var(--fechai-ink)!important;
  --fechai-manager-muted:var(--fechai-muted)!important;
  --fechai-manager-line:#dfe8e3!important;
  background:var(--fechai-page)!important;
}

@media (min-width:931px){
  #screen-commerce-app.shell:not(.vf-pdv-focus){
    grid-template-columns:276px minmax(0,1fr)!important;
    background:
      radial-gradient(circle at 96% -8%,rgba(11,107,70,.10),transparent 28%),
      var(--fechai-page)!important;
  }
  #screen-commerce-app.shell:not(.vf-pdv-focus)>.sidebar{
    width:276px!important;min-width:276px!important;max-width:276px!important;
  }
  #screen-commerce-app.shell:not(.vf-pdv-focus)>.main{
    min-width:0!important;
    background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(245,248,246,.98) 340px),var(--fechai-page)!important;
  }
}

#screen-commerce-app:not(.vf-pdv-focus)>.sidebar{
  color:#fff!important;
  background:
    radial-gradient(circle at 4% -5%,rgba(39,190,125,.24),transparent 31%),
    radial-gradient(circle at 100% 14%,rgba(255,255,255,.06),transparent 27%),
    linear-gradient(180deg,#0a3a29 0%,#063322 55%,#04261a 100%)!important;
  border-right:1px solid rgba(255,255,255,.08)!important;
  box-shadow:16px 0 36px rgba(4,43,30,.18)!important;
}

#screen-commerce-app:not(.vf-pdv-focus) .sidebar>.logo{
  display:flex!important;align-items:center!important;min-width:0!important;
  min-height:66px!important;margin:0 2px 14px!important;padding:0 2px 17px!important;
  overflow:visible!important;border-bottom:1px solid rgba(255,255,255,.13)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-platform-brand{
  display:flex!important;align-items:center!important;gap:11px!important;min-width:0!important;width:100%!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-platform-brand-mark{
  width:42px!important;height:42px!important;flex:0 0 42px!important;display:block!important;
  object-fit:cover!important;border-radius:13px!important;background:#fff!important;padding:1px!important;
  border:1px solid rgba(255,255,255,.32)!important;box-shadow:0 9px 21px rgba(0,0,0,.22)!important;
  filter:none!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-platform-brand-copy{
  display:grid!important;gap:1px!important;min-width:0!important;line-height:1.1!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-platform-brand-copy strong{
  color:#fff!important;font-size:18px!important;font-weight:900!important;letter-spacing:-.035em!important;
  white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-platform-brand-copy small{
  color:rgba(255,255,255,.63)!important;font-size:10px!important;font-weight:800!important;
  letter-spacing:.10em!important;text-transform:uppercase!important;
}
/* A marca antiga tinha uma imagem horizontal com fundo branco e filtros
   conflitantes. Quando ainda existir no DOM, ela não pode formar a mancha. */
#screen-commerce-app:not(.vf-pdv-focus) .sidebar>.logo .vf-logo-pill{display:none!important}

#screen-commerce-app:not(.vf-pdv-focus) #commerce-sidebar-business.business-name{
  min-width:0!important;margin:0 1px 16px!important;padding:13px!important;overflow:hidden!important;
  border:1px solid rgba(255,255,255,.14)!important;border-radius:14px!important;
  background:rgba(255,255,255,.075)!important;box-shadow:inset 0 1px rgba(255,255,255,.05)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) #commerce-sidebar-business.business-name strong,
#screen-commerce-app:not(.vf-pdv-focus) #commerce-sidebar-business.business-name>*{
  max-width:100%!important;overflow:hidden!important;text-overflow:ellipsis!important;
}
#screen-commerce-app:not(.vf-pdv-focus) #commerce-sidebar-business.business-name::after{color:#79e6ad!important}

#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav button.active,
#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav button[aria-current="page"],
#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav .vf-config-subnav.active{
  background:linear-gradient(135deg,#0f8256,#08613f)!important;
  color:#fff!important;box-shadow:0 10px 22px rgba(1,32,21,.30)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav button:hover,
#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav .vf-config-subnav:hover{
  background:rgba(255,255,255,.09)!important;color:#fff!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .sidebar .nav-title{color:rgba(255,255,255,.47)!important}
#screen-commerce-app:not(.vf-pdv-focus) .sidebar-bottom .btn{
  color:#fff!important;border-color:rgba(255,255,255,.16)!important;background:rgba(255,255,255,.055)!important;
}

#screen-commerce-app:not(.vf-pdv-focus) .main .btn.primary,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-page-tools .btn.primary{
  border-color:transparent!important;background:linear-gradient(135deg,var(--fechai-green),var(--fechai-green-dark))!important;
  color:#fff!important;box-shadow:0 10px 20px rgba(11,107,70,.24)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .main .btn.primary:hover,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-page-tools .btn.primary:hover{
  box-shadow:0 14px 25px rgba(11,107,70,.30)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .commerce-dashboard-hero{
  background:
    radial-gradient(circle at 88% 10%,rgba(46,198,130,.20),transparent 33%),
    linear-gradient(125deg,#063724 0%,#075038 58%,#0b6b46 100%)!important;
  border-color:rgba(255,255,255,.11)!important;box-shadow:0 18px 36px rgba(4,43,30,.18)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .metric .icon,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-metric-icon{
  background:var(--fechai-green-soft)!important;color:var(--fechai-green-dark)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .card,
#screen-commerce-app:not(.vf-pdv-focus) .metric,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-card,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-panel{border-color:#dfe8e3!important}

/* Personalização permanece visível e independente da identidade do painel. */
#screen-commerce-app:not(.vf-pdv-focus) .vf-theme-preset.active{
  border-color:var(--commerce-accent)!important;
  box-shadow:0 0 0 3px color-mix(in srgb,var(--commerce-accent) 17%,transparent)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .store-appearance-preview-cover{
  background:linear-gradient(135deg,var(--preview-color,var(--commerce-accent)),color-mix(in srgb,var(--preview-color,var(--commerce-accent)) 55%,#071b13))!important;
}

/* Vitrine pública: cartões flexíveis, sem texto vazando do botão. */
#store-app.vf-store-app{
  --vf-platform-green:#0b6b46;
  --vf-platform-green-dark:#063f2b;
  background:
    radial-gradient(circle at 95% 0,color-mix(in srgb,var(--vf-accent) 7%,transparent),transparent 26%),
    #f7faf8!important;
}
#store-app .vf-store-header{
  background:linear-gradient(90deg,var(--vf-accent-dark),color-mix(in srgb,var(--vf-accent) 76%,#052e20))!important;
  border-bottom:1px solid rgba(255,255,255,.10)!important;
}
#store-app .vf-brand{max-width:min(70vw,520px)!important;min-width:0!important}
#store-app .vf-brand-name,#store-app #store-brand-name{
  min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
}
#store-app .vf-category-pills{scroll-padding-inline:4px!important}
#store-app .vf-category-pills button{flex:0 0 auto!important;max-width:min(82vw,420px)!important;overflow:hidden!important;text-overflow:ellipsis!important}
#store-app .vf-products-grid{align-items:stretch!important}
#store-app .vf-product{min-width:0!important;width:100%!important;overflow:hidden!important}
#store-app .vf-product-body{min-width:0!important}
#store-app .vf-product-footer{
  display:flex!important;align-items:center!important;justify-content:space-between!important;
  gap:10px!important;min-width:0!important;width:100%!important;
}
#store-app .vf-product-footer>strong{
  flex:1 1 auto!important;min-width:0!important;white-space:nowrap!important;
  overflow:hidden!important;text-overflow:ellipsis!important;
}
#store-app .vf-add{
  box-sizing:border-box!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;
  flex:0 0 auto!important;width:auto!important;min-width:112px!important;max-width:58%!important;height:42px!important;
  padding:0 13px!important;gap:7px!important;overflow:hidden!important;white-space:nowrap!important;
  border-radius:12px!important;background:linear-gradient(135deg,var(--vf-accent),var(--vf-accent-dark))!important;
  color:#fff!important;font-size:13px!important;font-weight:850!important;line-height:1!important;
  box-shadow:0 8px 17px color-mix(in srgb,var(--vf-accent) 27%,transparent)!important;
}
#store-app .vf-add i{flex:0 0 auto!important;font-size:17px!important}
#store-app .vf-add-label{display:inline!important;min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important}
#store-app .vf-add:disabled{min-width:112px!important;max-width:60%!important}

@media (max-width:760px){
  #store-app .vf-add{width:40px!important;min-width:40px!important;max-width:40px!important;height:40px!important;padding:0!important}
  #store-app .vf-add-label{display:none!important}
  #store-app .vf-add:disabled{width:40px!important;min-width:40px!important;max-width:40px!important}
}
@media (max-width:420px){
  #store-app .vf-products-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
  #store-app .vf-product-footer{gap:6px!important}
  #store-app .vf-product-footer>strong{font-size:15px!important}
}

/* Mobile do gerenciador: menu legível, sem largura ou marca cortadas. */
@media (max-width:930px){
  #screen-commerce-app:not(.vf-pdv-focus)>.sidebar{width:min(88vw,300px)!important;max-width:min(88vw,300px)!important}
  #screen-commerce-app:not(.vf-pdv-focus) .sidebar>.logo{min-height:62px!important}
}

@media (prefers-reduced-motion:reduce){
  #store-app .vf-product,#store-app .vf-add,#screen-commerce-app .btn{transition:none!important}
}

/* Neutraliza os últimos destaques laranja herdados do tema anterior. */
:root{
  --vf-accent:#0b6b46;
  --vf-accent-dark:#063f2b;
  --vf-dark:#063f2b;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-manager-page-kicker{
  color:var(--fechai-green)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-manager-page-kicker i{
  color:var(--fechai-green)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .commerce-dashboard-copy .eyebrow{
  color:#a7f3d0!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .commerce-dashboard-copy .eyebrow::before{
  background:#34d399!important;
  box-shadow:0 0 0 4px rgba(52,211,153,.15)!important;
}

/* Todos os módulos internos usam a identidade FechAí; laranja permanece apenas
   em alertas e estados semânticos, não como cor principal da interface. */
#screen-commerce-app{
  --vf5-blue:#0b6b46!important;
  --vf5-blue-dark:#063f2b!important;
  --vf5-blue-soft:#e8f4ee!important;
  --vf5-orange:#0b6b46!important;
  --vf5-orange-soft:#e8f4ee!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-theme-preset.active{
  border-color:var(--commerce-store-accent,#0b6b46)!important;
  background:var(--commerce-store-accent-pale,#e8f4ee)!important;
  color:var(--commerce-store-accent-dark,#063f2b)!important;
  box-shadow:0 0 0 3px var(--commerce-store-accent-soft,rgba(11,107,70,.18))!important;
}
#screen-commerce-app:not(.vf-pdv-focus) input:focus,
#screen-commerce-app:not(.vf-pdv-focus) select:focus,
#screen-commerce-app:not(.vf-pdv-focus) textarea:focus{
  border-color:var(--fechai-green)!important;
  box-shadow:0 0 0 3px rgba(11,107,70,.14)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-orders-tabs button.active,
#screen-commerce-app:not(.vf-pdv-focus) .vf-payment-settings-tabs button.active,
#screen-commerce-app:not(.vf-pdv-focus) .vf-tables-page-tabs button.active{
  background:var(--fechai-green-soft)!important;
  color:var(--fechai-green-dark)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-manager-category-icon{
  background:var(--fechai-green-soft)!important;color:var(--fechai-green-dark)!important;
}
#screen-commerce-app:not(.vf-pdv-focus) .vf-manager-category-card:hover,
#screen-commerce-app:not(.vf-pdv-focus) .commerce-order-card:hover,
#screen-commerce-app:not(.vf-pdv-focus) .vf-tables-card:hover,
#screen-commerce-app:not(.vf-pdv-focus) .vf-dispatch-card:hover{
  border-color:#8fc9ad!important;box-shadow:0 12px 25px rgba(11,107,70,.12)!important;
}

/* PDV, mesas, caixa e telas operacionais seguem a mesma base verde-escuro. */
html:has(#screen-commerce-app.vf-pdv-focus),body.vf-pdv-focus-active{background:var(--fechai-page)!important}
#screen-commerce-app.shell.vf-pdv-focus,
#screen-commerce-app.vf-pdv-focus .main,
#screen-commerce-app.vf-pdv-focus .vf-pdv-page,
#screen-commerce-app.vf-pdv-focus .vf-pdv-console,
#screen-commerce-app.vf-pdv-focus .vf-pdv-workspace,
#screen-commerce-app.vf-pdv-focus .vf-pdv-catalog{background:var(--fechai-page)!important}
#screen-commerce-app.vf-pdv-focus .vf-pdv-store-avatar{
  background:var(--fechai-green-soft)!important;color:var(--fechai-green-dark)!important;
}
#screen-commerce-app.vf-pdv-focus .vf-pdv-control:hover{
  border-color:#8fc9ad!important;background:#f7fbf9!important;
}
#screen-commerce-app.vf-pdv-focus .vf-pdv-mode-tab.active,
#screen-commerce-app.vf-pdv-focus .vf-pdv-category-btn.active{
  background:var(--fechai-green-soft)!important;border-color:#8fc9ad!important;color:var(--fechai-green-dark)!important;
}
#screen-commerce-app.vf-pdv-focus .vf-pdv-mode-tab.active strong,
#screen-commerce-app.vf-pdv-focus .vf-pdv-product-price{color:var(--fechai-green-dark)!important}
#screen-commerce-app.vf-pdv-focus .vf-pdv-product-card:hover{border-color:#8fc9ad!important}
#screen-commerce-app.vf-pdv-focus .vf-pdv-product-media{background:#eef7f2!important}
#screen-commerce-app.vf-pdv-focus .vf-pdv-pay-disabled,
#screen-commerce-app.vf-pdv-focus .vf-pdv-pay-button,
#screen-commerce-app.vf-pdv-focus .vf-pdv-pay-ready{
  background:linear-gradient(135deg,var(--fechai-green),var(--fechai-green-dark))!important;
  box-shadow:0 11px 21px rgba(11,107,70,.24)!important;
}
