/* Vértice — contrato visual global
   Garante contraste/visibilidade dos controles estruturais em web, PWA e Tauri.
   Escopo limitado a body.v-app para não interferir no site público. */

body.v-app .sv-sidebar,
body.v-app .sv-sidebar * {
  box-sizing: border-box;
}

body.v-app .sv-sidebar .sv-icon,
body.v-app .v-app-menu-toggle svg,
body.v-app .vtx-notifications-bell svg,
body.v-app .vtx-user-chip svg {
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
}

body.v-app .sv-sidebar .sv-icon {
  width: 18px;
  height: 18px;
  min-width: 18px;
  flex: 0 0 18px;
  color: currentColor;
}

body.v-app .sv-sidebar .sv-nav-link:not([aria-disabled="true"]):not(.sv-nav-unavailable):not(.sv-disabled):not(.sv-nav-plan-locked),
body.v-app .sv-sidebar .sv-nav-summary:not([aria-disabled="true"]),
body.v-app .sv-sidebar .sv-logout {
  opacity: 1 !important;
  filter: none !important;
}

body.v-app .sv-sidebar .sv-nav-link:not([aria-disabled="true"]):not(.sv-nav-unavailable):not(.sv-disabled):not(.sv-nav-plan-locked) > .sv-icon,
body.v-app .sv-sidebar .sv-nav-summary:not([aria-disabled="true"]) > .sv-icon,
body.v-app .sv-sidebar .sv-logout > .sv-icon {
  color: #475569;
}

body.v-app .sv-sidebar .sv-nav-link.active > .sv-icon,
body.v-app .sv-sidebar .sv-nav-link[aria-current="page"] > .sv-icon,
body.v-app .sv-sidebar .sv-nav-summary.active > .sv-icon,
body.v-app .sv-sidebar .sv-nav-summary[aria-current="page"] > .sv-icon {
  color: #ffffff !important;
}

body.v-app .vtx-sidebar-user-hub {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  opacity: 1 !important;
  filter: none !important;
  overflow: visible;
}

body.v-app .vtx-notifications-bell,
body.v-app .vtx-sidebar-avatar {
  display: grid !important;
  place-items: center;
  flex: 0 0 38px;
  width: 38px !important;
  height: 38px !important;
  min-width: 38px;
  min-height: 38px;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  overflow: visible;
}

body.v-app .vtx-notifications-bell {
  color: #244f83 !important;
  background: #ffffff !important;
  border-color: #c7d6e8 !important;
}

body.v-app .vtx-notifications-bell svg {
  color: #244f83 !important;
  stroke: currentColor !important;
}

body.v-app .vtx-sidebar-avatar {
  color: #ffffff !important;
  background: linear-gradient(145deg, #3478f6, #1d5ddd) !important;
  border-color: #2563eb !important;
}

body.v-app .vtx-notifications-badge {
  z-index: 3;
  visibility: visible;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.75);
}

/* Em modo recolhido os dois controles do rodapé ficam empilhados.
   Assim ambos cabem integralmente nos 76 px da Sidebar. */
body.v-app.sidebar-collapsed .sv-sidebar .vtx-sidebar-user-hub,
body.v-app.sv-sidebar-collapsed .sv-sidebar .vtx-sidebar-user-hub {
  flex-direction: column !important;
  gap: 7px !important;
  padding: 8px 0 !important;
  align-items: center !important;
  justify-content: center !important;
}

body.v-app.sidebar-collapsed .sv-sidebar .sv-sidebar-footer,
body.v-app.sv-sidebar-collapsed .sv-sidebar .sv-sidebar-footer {
  overflow: visible !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
}

/* Controles essenciais: nunca ficam translúcidos quando estão habilitados. */
body.v-app .v-app-menu-toggle:not(:disabled),
body.v-app .vtx-notifications-bell:not(:disabled),
body.v-app .vtx-notifications-settings-btn:not(:disabled),
body.v-app .vtx-notifications-text-btn:not(:disabled),
body.v-app .vtx-user-chip:not(:disabled),
body.v-app [data-vertice-pwa-install]:not([aria-disabled="true"]),
body.v-app [data-vertice-passkey-enable]:not([aria-disabled="true"]) {
  opacity: 1 !important;
  filter: none !important;
  visibility: visible !important;
}

/* Drawers e modais não podem ser cortados por shells compactos. */
body.v-app .vtx-notifications-drawer,
body.v-app .vtx-notification-dialog,
body.v-app .vtx-passkey-modal-backdrop,
body.v-app .vtx-upgrade-backdrop,
body.v-app .vtx-upgrade-dialog {
  visibility: visible;
}

body.v-app .vtx-notifications-drawer {
  max-width: 100vw !important;
}

body.v-app .vtx-notifications-actions,
body.v-app .vtx-notification-item,
body.v-app .vtx-user-chip,
body.v-app .sv-nav-link,
body.v-app .sv-nav-summary {
  min-width: 0;
}

/* Em mobile a Sidebar é drawer completo; o rodapé volta a ficar horizontal. */
@media (max-width: 767px) {
  body.v-app .sv-sidebar .vtx-sidebar-user-hub {
    flex-direction: row !important;
    gap: 9px !important;
    padding: 7px 0 !important;
  }

  body.v-app .vtx-notifications-bell,
  body.v-app .vtx-sidebar-avatar {
    width: 42px !important;
    height: 42px !important;
    min-width: 42px;
    min-height: 42px;
    flex-basis: 42px;
  }
}

/* Melhora a leitura em alto contraste sem depender de filtros/opacidade. */
@media (forced-colors: active) {
  body.v-app .sv-sidebar .sv-icon,
  body.v-app .vtx-notifications-bell,
  body.v-app .vtx-sidebar-avatar {
    forced-color-adjust: auto;
  }
}


/* ===== 2026-09-22 v3: ícones estruturais críticos =====
   Não dependem de SVG inline para evitar desaparecimento por CSS legado/WebView. */
body.v-app .vtx-critical-icon,
body.v-app .sv-collapse-glyph {
  display: block !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  min-height: 18px;
  flex: 0 0 18px;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
}

body.v-app .vtx-critical-icon--bell {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23244f83' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8a6 6 0 0 0-12 0c0 7-3 7-3 9h18c0-2-3-2-3-9'/%3E%3Cpath d='M10 21h4'/%3E%3C/svg%3E") !important;
}

body.v-app .sv-collapse-glyph {
  width: 16px !important;
  height: 16px !important;
  min-width: 16px;
  min-height: 16px;
  flex-basis: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 18l-6-6 6-6'/%3E%3C/svg%3E") !important;
  transition: transform .18s ease;
}

body.v-app.sidebar-collapsed .sv-sidebar .sv-collapse-glyph,
body.v-app.sv-sidebar-collapsed .sv-sidebar .sv-collapse-glyph {
  transform: rotate(180deg);
}

/* Ícones SVG funcionais em cartões e ações nunca herdam fill/transparência destrutivos. */
body.v-app .vapps-icon svg,
body.v-app .vapps-install-icon svg,
body.v-app .sv-sidebar svg.sv-icon {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  overflow: visible;
}