/* ======================================================================
   DELIVERY JURUTI — CUSTOMIZAÇÃO VISUAL
   Compatível com: Delivery Juruti 4.1.9 / Gerenciador 1.0.9

   Carregar DEPOIS de app.css:
   <link rel="stylesheet" href="/static/css/custom.css?v={{ app_version }}">

   Objetivos:
   - painéis claros e legíveis;
   - identidade vinho consistente;
   - remover preto, roxo, azul e laranja indevidos;
   - melhorar Gestor, Banners, Queridinhos e Faturas;
   - melhorar Visão geral, Pedidos, Cardápio e Financeiro do estabelecimento;
   - padronizar hover/foco dos segmentos e categorias do cliente.
   ====================================================================== */

/* ----------------------------------------------------------------------
   01. Variáveis da identidade
   ---------------------------------------------------------------------- */
:root {
  --dj-primary: #8e1f2b;
  --dj-primary-strong: #761823;
  --dj-primary-dark: #5f111a;
  --dj-primary-soft: #f8edef;
  --dj-primary-softer: #fff7f8;

  --dj-bg: #f6f3f1;
  --dj-surface: #ffffff;
  --dj-surface-soft: #fbf8f7;
  --dj-surface-muted: #f4efed;

  --dj-text: #251f20;
  --dj-text-secondary: #6f6467;
  --dj-text-muted: #94898b;
  --dj-border: #e2d8da;
  --dj-border-strong: #d2bdc1;

  --dj-success: #247a49;
  --dj-success-soft: #edf8f1;
  --dj-warning: #a96812;
  --dj-warning-soft: #fff5df;
  --dj-danger: #b4232f;
  --dj-danger-soft: #fff0f1;

  --dj-radius-sm: 10px;
  --dj-radius-md: 14px;
  --dj-radius-lg: 20px;
  --dj-radius-xl: 24px;
  --dj-shadow-sm: 0 6px 18px rgba(68, 32, 35, 0.06);
  --dj-shadow-md: 0 12px 32px rgba(68, 32, 35, 0.08);
  --dj-shadow-lg: 0 22px 60px rgba(55, 24, 28, 0.16);
}

html,
body {
  color: var(--dj-text) !important;
  background-color: var(--dj-bg) !important;
}

/* ----------------------------------------------------------------------
   02. Foco, formulários e botões globais
   ---------------------------------------------------------------------- */
button,
[role="button"],
a,
input,
textarea,
select,
summary {
  -webkit-tap-highlight-color: transparent;
}

button:focus-visible,
[role="button"]:focus-visible,
a:focus-visible,
summary:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(142, 31, 43, 0.20) !important;
  outline-offset: 2px !important;
}

input,
textarea,
select,
.dialog-card input,
.dialog-card textarea,
.dialog-card select,
.dialog-form input,
.dialog-form textarea,
.dialog-form select,
.admin-invoice-form input,
.admin-invoice-form select,
.inline-filter select,
.owner-order-footer select {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-soft) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--dj-text-muted) !important;
  opacity: 1;
}

input:focus,
textarea:focus,
select:focus,
.dialog-card input:focus,
.dialog-card textarea:focus,
.dialog-card select:focus,
.dialog-form input:focus,
.dialog-form textarea:focus,
.dialog-form select:focus,
.admin-invoice-form input:focus,
.admin-invoice-form select:focus {
  border-color: var(--dj-primary) !important;
  background: var(--dj-surface) !important;
  box-shadow: 0 0 0 4px rgba(142, 31, 43, 0.10) !important;
}

input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--dj-primary) !important;
}

.primary-button,
.install-button,
.file-picker-button,
.banner-button,
.add-button,
.consumer-sticky-action {
  color: #ffffff !important;
  border: 1px solid var(--dj-primary) !important;
  background: linear-gradient(135deg, var(--dj-primary), var(--dj-primary-strong)) !important;
  box-shadow: 0 10px 24px rgba(142, 31, 43, 0.18) !important;
}

.primary-button:hover:not(:disabled),
.install-button:hover:not(:disabled),
.file-picker-button:hover:not(:disabled),
.banner-button:hover:not(:disabled),
.add-button:hover:not(:disabled),
.consumer-sticky-action:hover:not(:disabled) {
  color: #ffffff !important;
  border-color: var(--dj-primary-dark) !important;
  background: linear-gradient(135deg, #9d2634, var(--dj-primary-dark)) !important;
  transform: translateY(-1px);
  box-shadow: 0 13px 28px rgba(142, 31, 43, 0.23) !important;
}

.secondary-button,
.hero-secondary,
.checkout-new-address-button {
  color: var(--dj-primary) !important;
  border: 1px solid var(--dj-border-strong) !important;
  background: var(--dj-surface) !important;
  box-shadow: none !important;
}

.secondary-button:hover:not(:disabled),
.hero-secondary:hover:not(:disabled),
.checkout-new-address-button:hover:not(:disabled) {
  color: var(--dj-primary-dark) !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary-soft) !important;
}

.danger-button,
.danger-outline,
.danger-order-button,
.icon-action.danger {
  color: var(--dj-danger) !important;
  border-color: #ebc2c6 !important;
  background: var(--dj-danger-soft) !important;
}

.danger-button:hover:not(:disabled),
.danger-outline:hover:not(:disabled),
.danger-order-button:hover:not(:disabled),
.icon-action.danger:hover:not(:disabled) {
  color: #8f1721 !important;
  border-color: var(--dj-danger) !important;
  background: #ffe4e7 !important;
}

button:disabled,
.primary-button:disabled,
.secondary-button:disabled {
  opacity: 0.48 !important;
  transform: none !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* ----------------------------------------------------------------------
   03. Áreas vazias — remover blocos roxos/cinza-escuros
   ---------------------------------------------------------------------- */
.empty-state,
.compact-empty,
#orders-list .empty-state,
.owner-panel .empty-state,
.admin-panel .empty-state,
.owner-recent-list .empty-state,
.owner-orders-list .empty-state,
.menu-admin-grid > .empty-state,
.payment-method-list > .empty-state,
.finance-delivery-list > .empty-state,
.invoice-list > .empty-state,
.highlight-manager-list > .empty-state,
.highlight-candidate-list > .empty-state,
.admin-banner-list > .empty-state {
  color: var(--dj-text-secondary) !important;
  border: 1px dashed var(--dj-border-strong) !important;
  background: linear-gradient(180deg, #ffffff 0%, #faf6f6 100%) !important;
  box-shadow: none !important;
}

.empty-state h2,
.empty-state h3,
.empty-state strong,
.compact-empty h2,
.compact-empty h3,
.compact-empty strong,
#orders-list .empty-state h2 {
  color: var(--dj-text) !important;
}

.empty-state p,
.empty-state span,
.empty-state small,
.compact-empty p,
.compact-empty span,
.compact-empty small,
#orders-list .empty-state p {
  color: var(--dj-text-secondary) !important;
}

.compact-empty {
  min-height: 128px !important;
  padding: 24px !important;
  border-radius: var(--dj-radius-lg) !important;
}

/* ----------------------------------------------------------------------
   04. Navegação dos painéis — Gestor e Estabelecimento
   ---------------------------------------------------------------------- */
.owner-tabs,
.admin-tabs {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.owner-tabs button,
.admin-tabs button {
  color: var(--dj-text-secondary) !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.owner-tabs button:hover,
.admin-tabs button:hover {
  color: var(--dj-primary) !important;
  background: var(--dj-primary-softer) !important;
}

.owner-tabs button.active,
.admin-tabs button.active {
  color: var(--dj-primary-dark) !important;
  background: var(--dj-primary-soft) !important;
  box-shadow: inset 0 0 0 1px #eed5d9 !important;
}

.owner-section-heading,
.admin-section-heading,
.finance-section-heading {
  color: var(--dj-text) !important;
}

.owner-section-heading h2,
.owner-section-heading h3,
.admin-section-heading h2,
.admin-section-heading h3,
.finance-section-heading h2,
.finance-section-heading h3 {
  color: var(--dj-text) !important;
}

.owner-section-heading p,
.admin-section-heading p,
.finance-section-heading p {
  color: var(--dj-text-secondary) !important;
}

.eyebrow {
  color: var(--dj-primary) !important;
}

/* ----------------------------------------------------------------------
   05. Painel do estabelecimento — cabeçalho, visão geral e pedidos
   ---------------------------------------------------------------------- */
.owner-header {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: linear-gradient(135deg, #ffffff 0%, #fff9f9 100%) !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.owner-identity h1,
.owner-identity strong {
  color: var(--dj-text) !important;
}

.owner-identity p {
  color: var(--dj-text-secondary) !important;
}

.owner-identity img {
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-primary-soft) !important;
}

.owner-header-actions .secondary-button {
  color: var(--dj-primary) !important;
  border-color: var(--dj-border-strong) !important;
  background: var(--dj-surface) !important;
}

/* Notificações deixam de ser botão verde/preto e passam a usar a marca. */
.courier-sound-toggle {
  color: var(--dj-primary-dark) !important;
  border: 1px solid #e2c7cc !important;
  background: var(--dj-primary-soft) !important;
  box-shadow: none !important;
}

.courier-sound-toggle input {
  accent-color: var(--dj-primary) !important;
}

.courier-sound-toggle:hover,
.courier-sound-toggle:has(input:checked) {
  color: #ffffff !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary) !important;
}

/* Verde fica apenas como indicação semântica de loja aberta. */
.store-state.status-button.open,
.store-state.open {
  color: #17683b !important;
  border: 1px solid #acd8bd !important;
  background: var(--dj-success-soft) !important;
  box-shadow: none !important;
}

.store-state.status-button.open:hover {
  color: #ffffff !important;
  border-color: var(--dj-success) !important;
  background: var(--dj-success) !important;
}

.store-state.status-button.closed,
.store-state.closed {
  color: var(--dj-danger) !important;
  border: 1px solid #ebbec3 !important;
  background: var(--dj-danger-soft) !important;
  box-shadow: none !important;
}

.metric-card,
.owner-recent-order,
.owner-order-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.metric-card:hover,
.owner-recent-order:hover,
.owner-order-card:hover {
  border-color: #d4b6bb !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.metric-card span,
.metric-card small,
.owner-recent-order span,
.owner-order-card p,
.owner-order-card small,
.owner-order-footer {
  color: var(--dj-text-secondary) !important;
}

.metric-card strong,
.owner-recent-order strong,
.owner-order-card strong {
  color: var(--dj-text) !important;
}

.owner-order-address,
.owner-order-items,
.order-notes-box,
.delivery-dispatch-status {
  color: var(--dj-text) !important;
  border-color: var(--dj-border) !important;
  background: var(--dj-surface-soft) !important;
}

.owner-order-items span,
.owner-order-address p,
.order-notes-box p,
.delivery-dispatch-status span {
  color: var(--dj-text-secondary) !important;
}

/* ----------------------------------------------------------------------
   06. Cardápio do estabelecimento
   ---------------------------------------------------------------------- */
.category-order-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.category-order-card > div:first-child {
  color: var(--dj-text) !important;
  border: 1px solid #ecd6da !important;
  background: linear-gradient(145deg, #fff9fa, var(--dj-primary-soft)) !important;
}

.category-order-card h3,
.category-order-list article > span {
  color: var(--dj-text) !important;
}

.category-order-card p {
  color: var(--dj-text-secondary) !important;
}

.category-order-list article {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.category-order-list article:hover {
  border-color: #cda7ae !important;
  background: var(--dj-primary-softer) !important;
}

.category-order-list article > span b,
.highlight-position,
.admin-banner-order strong {
  color: #ffffff !important;
  background: var(--dj-primary) !important;
  box-shadow: none !important;
}

.icon-action {
  color: var(--dj-text-secondary) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: none !important;
}

.icon-action:hover:not(:disabled) {
  color: var(--dj-primary) !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary-soft) !important;
}

.menu-admin-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.menu-admin-card:hover {
  border-color: #d0acb2 !important;
  background: #ffffff !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.menu-admin-card > img {
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-muted) !important;
}

.menu-admin-content h3,
.menu-admin-content strong {
  color: var(--dj-text) !important;
}

.menu-admin-content p,
.mini-switch {
  color: var(--dj-text-secondary) !important;
}

.menu-admin-content > strong {
  color: var(--dj-primary) !important;
}

.mini-switch input:checked + span {
  color: var(--dj-success) !important;
}

.menu-admin-actions {
  border-top-color: var(--dj-border) !important;
}

/* ----------------------------------------------------------------------
   07. Financeiro do estabelecimento
   ---------------------------------------------------------------------- */
.site-fee-chip {
  color: var(--dj-primary-dark) !important;
  border: 1px solid #e6cdd2 !important;
  background: var(--dj-primary-soft) !important;
  box-shadow: none !important;
}

.finance-explanation,
.partner-review-notice {
  color: var(--dj-text-secondary) !important;
  border: 1px solid #e7cfd4 !important;
  background: linear-gradient(145deg, #fff9fa, var(--dj-primary-soft)) !important;
  box-shadow: none !important;
}

.finance-explanation strong,
.partner-review-notice strong {
  color: var(--dj-primary-dark) !important;
}

.finance-explanation p,
.partner-review-notice p {
  color: var(--dj-text-secondary) !important;
}

.payment-method-management,
.payment-method-card,
.finance-delivery-card,
.invoice-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.payment-method-card:hover,
.finance-delivery-card:hover,
.invoice-card:hover {
  border-color: #d1adb4 !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.payment-method-card.inactive {
  opacity: 0.65 !important;
  background: var(--dj-surface-muted) !important;
}

.payment-method-icon {
  color: var(--dj-primary) !important;
  border: 1px solid #ebd7da !important;
  background: var(--dj-primary-soft) !important;
  box-shadow: none !important;
}

.payment-method-copy strong,
.finance-delivery-card strong,
.invoice-card strong {
  color: var(--dj-text) !important;
}

.payment-method-copy span,
.finance-delivery-card p,
.invoice-card p {
  color: var(--dj-text-secondary) !important;
}

.payment-method-copy small {
  color: var(--dj-success) !important;
}

/* ----------------------------------------------------------------------
   08. Painel do gestor — Queridinhos
   ---------------------------------------------------------------------- */
.highlight-manager-selected,
.highlight-manager-catalog {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.highlight-manager-selected h3,
.highlight-manager-catalog h3 {
  color: var(--dj-text) !important;
}

.highlight-manager-list article,
.highlight-manager-candidate {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-soft) !important;
  box-shadow: none !important;
}

.highlight-manager-list article:hover,
.highlight-manager-candidate:hover {
  border-color: #cfacb2 !important;
  background: var(--dj-primary-softer) !important;
}

.highlight-manager-list img,
.highlight-manager-candidate img {
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-muted) !important;
}

.highlight-manager-list strong,
.highlight-manager-candidate strong {
  color: var(--dj-text) !important;
}

.highlight-manager-list span,
.highlight-manager-candidate span {
  color: var(--dj-text-secondary) !important;
}

.highlight-manager-list b,
.highlight-manager-candidate b {
  color: var(--dj-primary) !important;
}

.highlight-unavailable {
  color: #8b5c13 !important;
  border: 1px solid #edd39d !important;
  background: var(--dj-warning-soft) !important;
}

.admin-highlight-search {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-soft) !important;
  box-shadow: none !important;
}

.admin-highlight-search:focus-within {
  border-color: var(--dj-primary) !important;
  background: var(--dj-surface) !important;
  box-shadow: 0 0 0 4px rgba(142, 31, 43, 0.10) !important;
}

.admin-highlight-search span {
  color: var(--dj-primary) !important;
}

.admin-highlight-search input {
  color: var(--dj-text) !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* ----------------------------------------------------------------------
   09. Painel do gestor — lista e editor de banners
   ---------------------------------------------------------------------- */
.admin-banner-row {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.admin-banner-row:hover {
  border-color: #ceaab1 !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.admin-banner-row > img,
.banner-image-preview {
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-muted) !important;
}

.admin-banner-copy h3 {
  color: var(--dj-text) !important;
}

.admin-banner-copy p {
  color: var(--dj-text-secondary) !important;
}

.admin-banner-copy span {
  color: var(--dj-primary) !important;
}

.admin-banner-order button {
  color: var(--dj-text-secondary) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
}

.admin-banner-order button:hover:not(:disabled) {
  color: var(--dj-primary) !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary-soft) !important;
}

.admin-banner-hint {
  color: #71565b !important;
  border: 1px solid #ead5d9 !important;
  background: var(--dj-primary-softer) !important;
  box-shadow: none !important;
}

.app-dialog::backdrop,
.banner-editor-dialog::backdrop {
  background: rgba(35, 25, 28, 0.58) !important;
  backdrop-filter: blur(6px) !important;
}

.banner-editor-dialog {
  width: min(940px, calc(100% - 24px)) !important;
  max-height: calc(100vh - 24px) !important;
  border-radius: var(--dj-radius-xl) !important;
}

.banner-editor-dialog .dialog-form {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 18px !important;
  max-height: calc(100vh - 28px) !important;
  overflow: auto !important;
  padding: 26px !important;
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  border-radius: var(--dj-radius-xl) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-lg) !important;
}

.banner-editor-dialog .dialog-heading,
.banner-editor-dialog .form-grid,
.banner-editor-dialog .image-upload-field,
.banner-editor-dialog .banner-image-preview,
.banner-editor-dialog .availability-check,
.banner-editor-dialog .primary-button.full {
  grid-column: 1 / -1 !important;
}

.banner-editor-dialog .dialog-heading {
  align-items: flex-start !important;
  padding-bottom: 16px !important;
  border-bottom: 1px solid var(--dj-border) !important;
}

.banner-editor-dialog .dialog-heading h2 {
  color: var(--dj-text) !important;
}

.banner-editor-dialog label {
  min-width: 0;
  color: var(--dj-text) !important;
  font-weight: 750 !important;
}

.banner-editor-dialog input,
.banner-editor-dialog textarea {
  width: 100% !important;
  min-width: 0 !important;
}

.banner-editor-dialog textarea {
  resize: vertical !important;
  min-height: 92px !important;
}

.banner-editor-dialog .image-upload-field {
  gap: 9px !important;
  padding: 16px !important;
  border: 1px dashed var(--dj-border-strong) !important;
  border-radius: var(--dj-radius-md) !important;
  background: var(--dj-surface-soft) !important;
}

.banner-editor-dialog input[type="file"] {
  padding: 8px !important;
  background: var(--dj-surface) !important;
}

.banner-editor-dialog input[type="file"]::file-selector-button {
  margin-right: 12px;
  padding: 10px 14px;
  color: var(--dj-primary-dark);
  border: 1px solid #e0c3c8;
  border-radius: 10px;
  background: var(--dj-primary-soft);
  cursor: pointer;
  font-weight: 750;
}

.banner-editor-dialog input[type="file"]::file-selector-button:hover {
  color: #ffffff;
  border-color: var(--dj-primary);
  background: var(--dj-primary);
}

.banner-editor-dialog .banner-image-preview {
  width: 100% !important;
  max-height: 340px !important;
  aspect-ratio: 5 / 2 !important;
  object-fit: cover !important;
  border-radius: var(--dj-radius-lg) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.banner-editor-dialog .availability-check {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 13px 15px !important;
  border: 1px solid #e9d7da !important;
  border-radius: 13px !important;
  background: var(--dj-primary-softer) !important;
}

.banner-editor-dialog .dialog-close {
  display: grid !important;
  place-items: center !important;
  width: 44px !important;
  height: 44px !important;
  color: var(--dj-primary) !important;
  border: 1px solid #e9d4d8 !important;
  border-radius: 14px !important;
  background: var(--dj-primary-soft) !important;
}

.banner-editor-dialog .dialog-close:hover {
  color: #ffffff !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary) !important;
}

/* ----------------------------------------------------------------------
   10. Painel do gestor — Faturas
   ---------------------------------------------------------------------- */
.admin-invoice-form {
  display: grid !important;
  grid-template-columns: minmax(230px, 1.35fr) minmax(155px, 0.72fr) minmax(155px, 0.72fr) minmax(220px, 1.15fr) auto !important;
  align-items: end !important;
  gap: 14px !important;
  padding: 22px !important;
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.admin-invoice-form label {
  color: var(--dj-text) !important;
}

.admin-invoice-form .primary-button {
  min-width: 164px !important;
}

.admin-invoice-feedback {
  grid-column: 1 / -1 !important;
}

.invoice-candidate-summary {
  display: grid !important;
  gap: 5px !important;
  margin: 14px 0 18px !important;
  padding: 16px 18px !important;
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  border-left: 4px solid var(--dj-primary) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.invoice-candidate-summary strong {
  color: var(--dj-text) !important;
}

.invoice-candidate-summary span {
  color: var(--dj-text-secondary) !important;
}

.admin-invoice-list,
.owner-invoice-list {
  color: var(--dj-text) !important;
}

.detailed-invoice-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.invoice-values {
  color: var(--dj-text-secondary) !important;
}

.invoice-values strong {
  color: var(--dj-text) !important;
}

/* ----------------------------------------------------------------------
   11. Cliente — segmentos, categorias e seleção de produtos
   ---------------------------------------------------------------------- */
.home-mode-tabs button {
  color: var(--dj-text-secondary) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.home-mode-tabs button:hover {
  color: var(--dj-primary) !important;
  border-color: #d7b4ba !important;
  background: var(--dj-primary-softer) !important;
}

.home-mode-tabs button.active {
  color: var(--dj-primary-dark) !important;
  border-color: #dfc0c6 !important;
  background: var(--dj-primary-soft) !important;
}

.segment-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: linear-gradient(115deg, #ffffff 0%, #fbf6f5 100%) !important;
  box-shadow: var(--dj-shadow-sm) !important;
}

.segment-card:hover,
.segment-card:focus-visible {
  color: var(--dj-text) !important;
  border-color: var(--dj-primary) !important;
  background: linear-gradient(115deg, #ffffff 0%, var(--dj-primary-soft) 100%) !important;
  box-shadow: var(--dj-shadow-md) !important;
  transform: translateY(-2px);
}

.segment-card img {
  background: var(--dj-surface-muted) !important;
}

.segment-card strong {
  color: var(--dj-text) !important;
}

.segment-card small {
  color: var(--dj-text-secondary) !important;
}

.segment-card b {
  color: #ffffff !important;
  background: var(--dj-primary) !important;
}

.menu-category-filter .chip,
#menu-filters .chip {
  color: var(--dj-primary-dark) !important;
  border: 1px solid #dec5ca !important;
  background: var(--dj-surface) !important;
  box-shadow: none !important;
  transform: none !important;
}

.menu-category-filter .chip:hover,
#menu-filters .chip:hover {
  color: var(--dj-primary) !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary-soft) !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

.menu-category-filter .chip.active,
.menu-category-filter .chip[aria-pressed="true"],
#menu-filters .chip.active,
#menu-filters .chip[aria-pressed="true"] {
  color: #ffffff !important;
  border-color: var(--dj-primary) !important;
  background: linear-gradient(135deg, var(--dj-primary), var(--dj-primary-strong)) !important;
  box-shadow: 0 8px 18px rgba(142, 31, 43, 0.18) !important;
}

.menu-category-filter .chip.active:hover,
.menu-category-filter .chip[aria-pressed="true"]:hover,
#menu-filters .chip.active:hover,
#menu-filters .chip[aria-pressed="true"]:hover {
  color: #ffffff !important;
  border-color: var(--dj-primary-dark) !important;
  background: linear-gradient(135deg, #9a2633, var(--dj-primary-dark)) !important;
}

.menu-category-filter .chip:focus-visible,
#menu-filters .chip:focus-visible {
  outline: 3px solid rgba(142, 31, 43, 0.20) !important;
  outline-offset: 2px !important;
}

.restaurant-tabs button {
  color: var(--dj-text-secondary) !important;
  background: transparent !important;
}

.restaurant-tabs button:hover {
  color: var(--dj-primary) !important;
  background: var(--dj-primary-softer) !important;
}

.restaurant-tabs button.active {
  color: var(--dj-primary) !important;
  border-bottom-color: var(--dj-primary) !important;
  background: transparent !important;
}

.consumer-menu-category h2 {
  color: var(--dj-text) !important;
  border-bottom: 1px solid var(--dj-border) !important;
  background: var(--dj-surface-soft) !important;
}

.consumer-menu-item {
  color: var(--dj-text) !important;
  border-color: var(--dj-border) !important;
  background: var(--dj-surface) !important;
}

.consumer-menu-item:hover,
.consumer-menu-item:focus-visible {
  color: var(--dj-text) !important;
  border-color: #d4b3b9 !important;
  background: var(--dj-primary-softer) !important;
  box-shadow: inset 4px 0 0 var(--dj-primary) !important;
}

.consumer-menu-item strong {
  color: var(--dj-text) !important;
}

.consumer-menu-item small {
  color: var(--dj-text-secondary) !important;
}

.consumer-menu-item b {
  color: var(--dj-primary) !important;
}

.product-detail-card {
  color: var(--dj-text) !important;
  border: 1px solid var(--dj-border) !important;
  background: var(--dj-surface) !important;
  box-shadow: var(--dj-shadow-md) !important;
}

.product-stepper button {
  color: var(--dj-primary) !important;
  border-color: #dfc3c8 !important;
  background: var(--dj-primary-soft) !important;
}

.product-stepper button:hover {
  color: #ffffff !important;
  border-color: var(--dj-primary) !important;
  background: var(--dj-primary) !important;
}

/* ----------------------------------------------------------------------
   12. Status e cores semânticas
   ---------------------------------------------------------------------- */
.manager-status.status-ativo,
.status.status-delivered,
.status-delivered,
.finance-state.finance-ok {
  color: #17683b !important;
  border-color: #acd8bd !important;
  background: var(--dj-success-soft) !important;
}

.manager-status.status-pendente,
.status.status-preparing,
.status-preparing,
.finance-state.finance-pending {
  color: #8c5a0d !important;
  border-color: #ebcf96 !important;
  background: var(--dj-warning-soft) !important;
}

.manager-status.status-rejeitado,
.manager-status.status-inativo {
  color: var(--dj-danger) !important;
  border-color: #e9bec3 !important;
  background: var(--dj-danger-soft) !important;
}

/* ----------------------------------------------------------------------
   13. Responsividade
   ---------------------------------------------------------------------- */
@media (max-width: 1100px) {
  .admin-invoice-form {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .admin-invoice-form .primary-button,
  .admin-invoice-feedback {
    grid-column: 1 / -1 !important;
  }
}

@media (max-width: 760px) {
  .banner-editor-dialog {
    width: min(calc(100% - 12px), 940px) !important;
  }

  .banner-editor-dialog .dialog-form {
    grid-template-columns: 1fr !important;
    gap: 14px !important;
    padding: 18px !important;
    border-radius: 20px !important;
  }

  .banner-editor-dialog .dialog-heading,
  .banner-editor-dialog .form-grid,
  .banner-editor-dialog .image-upload-field,
  .banner-editor-dialog .banner-image-preview,
  .banner-editor-dialog .availability-check,
  .banner-editor-dialog .primary-button.full,
  .banner-editor-dialog .dialog-form > label {
    grid-column: 1 !important;
  }

  .banner-editor-dialog .form-grid.two-columns {
    grid-template-columns: 1fr !important;
  }

  .admin-invoice-form {
    grid-template-columns: 1fr !important;
    padding: 16px !important;
  }

  .admin-invoice-form .primary-button,
  .admin-invoice-feedback {
    grid-column: 1 !important;
    width: 100% !important;
  }

  .owner-header-actions.operation-only {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  .owner-header-actions.operation-only > * {
    width: 100% !important;
    justify-content: center !important;
  }

  .highlight-manager-selected,
  .highlight-manager-catalog,
  .payment-method-management {
    padding: 15px !important;
  }

  .admin-banner-actions,
  .payment-method-actions {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
  }

  .segment-card:hover,
  .segment-card:focus-visible {
    transform: none !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    scroll-behavior: auto !important;
    transition-duration: 0.01ms !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
  }
}
/* =========================================================
   BANNER — CAIXA ATIVO / INATIVO
   ========================================================= */

.banner-editor-dialog .availability-check {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;

    width: 100% !important;
    min-height: 58px !important;
    padding: 14px 16px !important;

    color: var(--dj-text) !important;
    background: #fff8f9 !important;
    border: 1px solid #ead4d9 !important;
    border-radius: 14px !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;

    cursor: pointer !important;
    user-select: none !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease !important;
}

/* Corrige o width: 100% aplicado aos outros inputs */
.banner-editor-dialog .availability-check input[type="checkbox"] {
    appearance: none !important;
    -webkit-appearance: none !important;

    flex: 0 0 22px !important;
    width: 22px !important;
    min-width: 22px !important;
    max-width: 22px !important;
    height: 22px !important;

    margin: 0 !important;
    padding: 0 !important;

    display: grid !important;
    place-content: center !important;

    background: #ffffff !important;
    border: 2px solid #bd8d97 !important;
    border-radius: 6px !important;

    cursor: pointer !important;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease !important;
}

/* Símbolo de confirmação */
.banner-editor-dialog
.availability-check
input[type="checkbox"]::before {
    content: "✓";
    color: #ffffff;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;

    transform: scale(0);
    transition: transform 0.15s ease;
}

/* Checkbox marcado */
.banner-editor-dialog
.availability-check
input[type="checkbox"]:checked {
    background: var(--dj-primary) !important;
    border-color: var(--dj-primary) !important;
}

.banner-editor-dialog
.availability-check
input[type="checkbox"]:checked::before {
    transform: scale(1);
}

/* Toda a faixa fica destacada quando ativo */
.banner-editor-dialog
.availability-check:has(input[type="checkbox"]:checked) {
    background: var(--dj-primary-soft) !important;
    border-color: #dfb7c0 !important;
}

/* Hover */
.banner-editor-dialog .availability-check:hover {
    background: #fdf0f3 !important;
    border-color: #d7a7b2 !important;
}

/* Acessibilidade por teclado */
.banner-editor-dialog
.availability-check
input[type="checkbox"]:focus-visible {
    outline: none !important;
    box-shadow:
        0 0 0 3px #ffffff,
        0 0 0 6px rgba(155, 28, 49, 0.2) !important;
}

/* Celular */
@media (max-width: 600px) {
    .banner-editor-dialog .availability-check {
        min-height: 54px !important;
        padding: 12px 14px !important;
        font-size: 14px !important;
    }
}
/* =========================================================
   NOTIFICAÇÕES / TOASTS
   ========================================================= */

.toast,
.toast-message,
.app-toast,
.notification-toast {
    position: fixed !important;
    left: 50% !important;
    bottom: 28px !important;
    transform: translateX(-50%) !important;

    width: auto !important;
    max-width: min(520px, calc(100vw - 32px)) !important;
    min-height: 52px !important;
    padding: 14px 22px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    background: #86182a !important;
    color: #ffffff !important;
    border: 1px solid #721322 !important;
    border-radius: 14px !important;

    font-size: 15px !important;
    font-weight: 700 !important;
    line-height: 1.4 !important;
    text-align: center !important;

    box-shadow:
        0 14px 35px rgba(70, 16, 27, 0.28),
        0 4px 12px rgba(70, 16, 27, 0.18) !important;

    z-index: 99999 !important;
}

/* Aviso */
.toast.warning,
.toast-warning,
.notification-toast.warning {
    background: #fff4db !important;
    color: #754c00 !important;
    border-color: #e8c36c !important;
}

/* Sucesso */
.toast.success,
.toast-success,
.notification-toast.success {
    background: #e9f7ef !important;
    color: #17663c !important;
    border-color: #9fd5b7 !important;
}

/* Erro */
.toast.error,
.toast-danger,
.toast-error,
.notification-toast.error {
    background: #fff0f0 !important;
    color: #9d1f27 !important;
    border-color: #e5adb2 !important;
}

/* Animação */
.toast.show,
.toast.visible,
.notification-toast.show {
    animation: dj-toast-enter 0.25s ease-out !important;
}

@keyframes dj-toast-enter {
    from {
        opacity: 0;
        transform: translate(-50%, 16px);
    }

    to {
        opacity: 1;
        transform: translate(-50%, 0);
    }
}

@media (max-width: 600px) {
    .toast,
    .toast-message,
    .app-toast,
    .notification-toast {
        bottom: 18px !important;
        width: calc(100vw - 28px) !important;
        padding: 13px 16px !important;
        font-size: 14px !important;
    }
}
/* =========================================================
   CENTRAL — STATUS ONLINE
   ========================================================= */

.admin-online-status,
.central-online-status,
.online-status,
.status-online,
.connection-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    min-width: auto !important;
    height: 46px !important;
    padding: 0 18px !important;

    background: #ecf8f1 !important;
    color: #176b43 !important;

    border: 1px solid #b9dfca !important;
    border-radius: 999px !important;

    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1 !important;

    box-shadow: none !important;
    cursor: default !important;
}

/* Indicador verde */
.admin-online-status::before,
.central-online-status::before,
.online-status::before,
.status-online::before,
.connection-status::before {
    content: "" !important;

    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;

    background: #1fa766 !important;
    border-radius: 50% !important;

    box-shadow: 0 0 0 4px rgba(31, 167, 102, 0.12) !important;
}

/* Remove possíveis efeitos herdados de botão */
.admin-online-status:hover,
.central-online-status:hover,
.online-status:hover,
.status-online:hover,
.connection-status:hover {
    background: #ecf8f1 !important;
    color: #176b43 !important;
    transform: none !important;
    filter: none !important;
    box-shadow: none !important;
}
/* =========================================================
   PAINEL DO ESTABELECIMENTO — AÇÕES DO CABEÇALHO
   ========================================================= */

.dj-schedule-button {
    min-height: 52px !important;
    padding: 0 22px !important;

    background: #ffffff !important;
    color: #8f1d2c !important;

    border: 1px solid #d9b9c0 !important;
    border-radius: 14px !important;

    font-weight: 750 !important;
    box-shadow: none !important;

    transition:
        background-color 0.2s ease,
        border-color 0.2s ease,
        transform 0.2s ease !important;
}

.dj-schedule-button:hover {
    background: #fff3f5 !important;
    color: #7a1822 !important;
    border-color: #c98896 !important;
    transform: translateY(-1px) !important;
}

.dj-notification-button {
    min-height: 52px !important;
    padding: 0 22px !important;

    background: linear-gradient(
        135deg,
        #a32134,
        #861827
    ) !important;

    color: #ffffff !important;
    border: 1px solid #861827 !important;
    border-radius: 14px !important;

    font-weight: 750 !important;

    box-shadow:
        0 8px 20px rgba(134, 24, 39, 0.18) !important;
}

.dj-notification-button,
.dj-notification-button * {
    color: #ffffff !important;
}

.dj-notification-button:hover {
    background: #7a1822 !important;
    transform: translateY(-1px) !important;
}

/* =========================================================
   STATUS ABERTO / FECHADO
   ========================================================= */

.dj-status-open {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 104px !important;
    min-height: 46px !important;
    padding: 0 18px !important;

    background: #eaf8f0 !important;
    color: #14683f !important;

    border: 1px solid #abdcc1 !important;
    border-radius: 999px !important;

    font-weight: 850 !important;
    box-shadow: none !important;
}

.dj-status-closed {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-width: 104px !important;
    min-height: 46px !important;
    padding: 0 18px !important;

    background: #fff0f1 !important;
    color: #9b1c31 !important;

    border: 1px solid #e7b7be !important;
    border-radius: 999px !important;

    font-weight: 850 !important;
    box-shadow: none !important;
}

/* =========================================================
   CENTRAL — STATUS ONLINE
   ========================================================= */

.dj-online-status {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    min-height: 46px !important;
    padding: 0 18px !important;

    background: #eaf8f0 !important;
    color: #176b43 !important;

    border: 1px solid #addcc2 !important;
    border-radius: 999px !important;

    font-size: 15px !important;
    font-weight: 800 !important;

    box-shadow: none !important;
    cursor: default !important;
}

.dj-online-status::before {
    content: "" !important;

    width: 10px !important;
    height: 10px !important;
    flex: 0 0 10px !important;

    background: #1aa667 !important;
    border-radius: 50% !important;

    box-shadow:
        0 0 0 4px rgba(26, 166, 103, 0.13) !important;
}

/* =========================================================
   SELEÇÃO DE IMAGEM DO ESTABELECIMENTO
   ========================================================= */

.dj-image-upload-card {
    background: #fffdfd !important;
    color: #231f20 !important;

    border: 1px dashed #ddc6cb !important;
    border-radius: 16px !important;

    padding: 16px !important;
}

.dj-image-upload-card strong,
.dj-image-upload-card h2,
.dj-image-upload-card h3,
.dj-image-upload-card label {
    color: #231f20 !important;
}

.dj-image-upload-card p,
.dj-image-upload-card small,
.dj-image-upload-card span:not(.dj-image-select-button) {
    color: #75666b !important;
}

.dj-image-select-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    min-height: 48px !important;
    padding: 0 20px !important;

    background: linear-gradient(
        135deg,
        #a32134,
        #861827
    ) !important;

    color: #ffffff !important;
    border: 1px solid #861827 !important;
    border-radius: 14px !important;

    font-size: 15px !important;
    font-weight: 750 !important;

    box-shadow:
        0 7px 18px rgba(134, 24, 39, 0.17) !important;

    cursor: pointer !important;
}

.dj-image-select-button,
.dj-image-select-button * {
    color: #ffffff !important;
}

.dj-image-select-button:hover {
    background: #7a1822 !important;
    color: #ffffff !important;
    transform: translateY(-1px) !important;
}

/* =========================================================
   PERFIS — FORMAS DE PAGAMENTO EM BREVE
   ========================================================= */

.dj-payment-coming-soon {
    width: 100% !important;
    min-height: 70px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;

    padding: 0 20px !important;

    background: #f8f5f5 !important;
    color: #8b7c81 !important;

    border: 1px solid #e5dadd !important;
    border-radius: 14px !important;

    opacity: 1 !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
}

.dj-payment-coming-soon,
.dj-payment-coming-soon * {
    color: #8b7c81 !important;
}

.dj-payment-coming-soon:hover {
    background: #f8f5f5 !important;
    color: #8b7c81 !important;
    transform: none !important;
    box-shadow: none !important;
}

/* =========================================================
   RESPONSIVIDADE
   ========================================================= */

@media (max-width: 780px) {
    .dj-schedule-button,
    .dj-notification-button {
        width: 100% !important;
        min-height: 50px !important;
        padding: 0 16px !important;
    }

    .dj-status-open,
    .dj-status-closed {
        min-width: 96px !important;
        min-height: 42px !important;
    }

    .dj-image-upload-card {
        text-align: left !important;
    }

    .dj-image-select-button {
        width: 100% !important;
    }
}
/* =========================================================
   SELETOR DE ARQUIVOS — TEXTO SEMPRE BRANCO
   ========================================================= */

.file-picker-button,
.file-picker-button:link,
.file-picker-button:visited,
.file-picker-button:hover,
.file-picker-button:focus,
.file-picker-button:focus-visible,
.file-picker-button:active,
label.file-picker-button,
button.file-picker-button {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.file-picker-button *,
.file-picker-button:hover *,
.file-picker-button:focus *,
.file-picker-button:active * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Ícones dentro do botão */
.file-picker-button svg {
    color: #ffffff !important;
    fill: currentColor !important;
    stroke: currentColor !important;
}

/* Se alguma tela ainda utilizar o botão nativo */
input[type="file"]::file-selector-button {
    background: #981e31 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    border: 1px solid #861827 !important;
    border-radius: 12px !important;

    padding: 10px 16px !important;
    font-weight: 750 !important;
    cursor: pointer !important;
}

input[type="file"]:hover::file-selector-button {
    background: #7d1726 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* Compatibilidade com navegadores WebKit */
input[type="file"]::-webkit-file-upload-button {
    background: #981e31 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    border: 1px solid #861827 !important;
    border-radius: 12px !important;

    padding: 10px 16px !important;
    font-weight: 750 !important;
}

/* =========================================================
   PRÉVIAS DE IMAGEM
   ========================================================= */

img.dj-preview-ready {
    display: block !important;

    max-width: 100% !important;
    max-height: 100% !important;

    object-fit: cover !important;
    object-position: center !important;

    color: transparent !important;
    background: #f8f2f4 !important;

    border-radius: inherit !important;
}

/* Destaque discreto após selecionar uma imagem */
.dj-has-selected-image {
    border-color: #d8a7b1 !important;
    background: #fffafa !important;
}
/* =========================================================
   PAINEL DO ESTABELECIMENTO — CABEÇALHO ORGANIZADO
   ========================================================= */

/* Linha inferior do nome do estabelecimento */
.dj-merchant-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;

    margin-top: 8px !important;
}

.dj-merchant-meta p,
.dj-merchant-meta span,
.dj-merchant-meta small {
    margin: 0 !important;
}

/* Status mais compacto ao lado do subtítulo */
.dj-merchant-meta .dj-status-open,
.dj-merchant-meta .dj-status-closed {
    min-width: auto !important;
    min-height: 30px !important;
    height: 30px !important;

    padding: 0 12px !important;

    font-size: 11px !important;
    font-weight: 850 !important;
    letter-spacing: 0.04em !important;
}

/* Grupo das ações */
.dj-merchant-actions {
    display: grid !important;
    grid-template-columns:
        minmax(260px, 1fr)
        minmax(230px, 1fr) !important;

    align-items: stretch !important;
    gap: 12px !important;

    width: min(100%, 620px) !important;
}

/* Os dois botões passam a ter a mesma altura */
.dj-merchant-actions .dj-schedule-button,
.dj-merchant-actions .dj-notification-button {
    width: 100% !important;
    min-height: 54px !important;
    height: 54px !important;

    margin: 0 !important;
    padding: 0 20px !important;

    white-space: nowrap !important;
}

/* Horário: ação secundária */
.dj-merchant-actions .dj-schedule-button {
    background: #ffffff !important;
    color: #8f1d2c !important;

    border: 1px solid #d9b9c0 !important;
    box-shadow: none !important;
}

.dj-merchant-actions .dj-schedule-button:hover {
    background: #fff3f5 !important;
    color: #781522 !important;
    border-color: #ca8d99 !important;
}

/* Notificações: ação principal */
.dj-merchant-actions .dj-notification-button {
    background: #981e31 !important;
    color: #ffffff !important;

    border: 1px solid #981e31 !important;

    box-shadow:
        0 7px 18px rgba(152, 30, 49, 0.16) !important;
}

.dj-merchant-actions .dj-notification-button,
.dj-merchant-actions .dj-notification-button * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dj-merchant-actions .dj-notification-button:hover {
    background: #7d1726 !important;
    border-color: #7d1726 !important;
}

/* Tablet */
@media (max-width: 1050px) {
    .dj-merchant-actions {
        grid-template-columns: 1fr !important;
        width: min(100%, 340px) !important;
    }
}

/* Celular */
@media (max-width: 760px) {
    .dj-merchant-actions {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .dj-merchant-actions .dj-schedule-button,
    .dj-merchant-actions .dj-notification-button {
        width: 100% !important;
        min-height: 50px !important;
        height: auto !important;

        padding: 13px 16px !important;
        white-space: normal !important;
        text-align: center !important;
    }

    .dj-merchant-meta {
        gap: 8px !important;
    }
}
/* =========================================================
   CABEÇALHO DO ESTABELECIMENTO — NOVA ORGANIZAÇÃO
   ========================================================= */

.dj-merchant-actions-host {
    display: flex !important;
    align-items: flex-start !important;
    justify-content: flex-end !important;
}

.dj-merchant-actions-row {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(220px, 1fr)) !important;
    gap: 12px !important;

    width: min(100%, 590px) !important;
    margin: 0 !important;
}

/* Botões com mesma altura e proporção */
.dj-merchant-actions-row .dj-schedule-button,
.dj-merchant-actions-row .dj-notification-button {
    width: 100% !important;
    min-width: 0 !important;
    min-height: 52px !important;
    height: 52px !important;

    margin: 0 !important;
    padding: 0 18px !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 9px !important;

    border-radius: 14px !important;

    font-size: 14px !important;
    font-weight: 750 !important;
    line-height: 1.2 !important;
    text-align: center !important;

    white-space: nowrap !important;
}

/* Horário — ação secundária */
.dj-merchant-actions-row .dj-schedule-button {
    background: #ffffff !important;
    color: #8f1d2c !important;
    -webkit-text-fill-color: #8f1d2c !important;

    border: 1px solid #d9b9c0 !important;
    box-shadow: none !important;
}

.dj-merchant-actions-row .dj-schedule-button:hover {
    background: #fff3f5 !important;
    color: #781522 !important;
    -webkit-text-fill-color: #781522 !important;

    border-color: #c98c99 !important;
}

/* Notificações — ação principal */
.dj-merchant-actions-row .dj-notification-button {
    background: #981e31 !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    border: 1px solid #981e31 !important;

    box-shadow:
        0 7px 18px rgba(152, 30, 49, 0.16) !important;
}

.dj-merchant-actions-row .dj-notification-button,
.dj-merchant-actions-row .dj-notification-button * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dj-merchant-actions-row .dj-notification-button:hover {
    background: #7d1726 !important;
    border-color: #7d1726 !important;
}

/* Texto e status na mesma linha */
.dj-merchant-status-line {
    display: flex !important;
    align-items: center !important;
    flex-wrap: wrap !important;
    gap: 10px !important;

    margin-top: 8px !important;
}

.dj-merchant-status-line p,
.dj-merchant-status-line span,
.dj-merchant-status-line small {
    margin: 0 !important;
}

/* Status deixa de parecer um terceiro botão */
.dj-merchant-status-badge {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    width: auto !important;
    min-width: auto !important;
    height: 29px !important;
    min-height: 29px !important;

    padding: 0 11px !important;
    margin: 0 !important;

    background: #eaf8f0 !important;
    color: #176b43 !important;
    -webkit-text-fill-color: #176b43 !important;

    border: 1px solid #abdcc1 !important;
    border-radius: 999px !important;

    font-size: 10px !important;
    font-weight: 850 !important;
    letter-spacing: 0.05em !important;
    line-height: 1 !important;

    box-shadow: none !important;
}

/* Tablet */
@media (max-width: 1080px) {
    .dj-merchant-actions-row {
        grid-template-columns: 1fr !important;
        width: min(100%, 330px) !important;
    }
}

/* Celular */
@media (max-width: 760px) {
    .dj-merchant-actions-host {
        width: 100% !important;
        justify-content: stretch !important;
    }

    .dj-merchant-actions-row {
        width: 100% !important;
        grid-template-columns: 1fr !important;
        gap: 10px !important;
    }

    .dj-merchant-actions-row .dj-schedule-button,
    .dj-merchant-actions-row .dj-notification-button {
        width: 100% !important;
        height: auto !important;
        min-height: 50px !important;

        padding: 13px 16px !important;
        white-space: normal !important;
    }
}
/* =========================================================
   DELIVERY JURUTI — CABEÇALHO MODERNO ESTABELECIMENTO V4
   ========================================================= */

.dj-original-control-hidden {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

/* área nova */
.dj-modern-actions-host {
    position: relative !important;
}

.dj-modern-actions-bar {
    display: grid !important;
    grid-template-columns: minmax(280px, 1.15fr) minmax(260px, 1fr) minmax(190px, 0.7fr) !important;
    gap: 16px !important;
    align-items: center !important;
    justify-content: end !important;
    width: 100% !important;
    max-width: 980px !important;
    margin-left: auto !important;
}

/* card de status */
.dj-modern-status-card {
    display: flex !important;
    align-items: center !important;
    gap: 14px !important;

    min-height: 88px !important;
    padding: 0 24px !important;

    background: #ffffff !important;
    border: 1px solid #eadcdf !important;
    border-radius: 20px !important;

    box-shadow: 0 12px 28px rgba(67, 18, 25, 0.05) !important;
}

.dj-modern-status-icon {
    width: 42px !important;
    height: 42px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;
    background: #f8f1f3 !important;
    font-size: 20px !important;
}

.dj-modern-status-content {
    display: flex !important;
    flex-direction: column !important;
    gap: 4px !important;
}

.dj-modern-status-title {
    font-size: 16px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
}

.dj-modern-status-subtitle {
    font-size: 14px !important;
    color: #6f6670 !important;
    line-height: 1.2 !important;
}

.dj-modern-status-card.is-open .dj-modern-status-title {
    color: #176b43 !important;
}

.dj-modern-status-card.is-closed .dj-modern-status-title {
    color: #9a1d31 !important;
}

/* botão principal */
.dj-modern-primary-toggle {
    min-height: 88px !important;
    padding: 0 28px !important;

    border-radius: 20px !important;
    border: none !important;

    font-size: 17px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;

    cursor: pointer !important;
    transition: all 0.2s ease !important;
}

.dj-modern-primary-toggle.is-closed,
.dj-modern-primary-toggle.is-open {
    background: linear-gradient(135deg, #b22035, #8e1828) !important;
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    box-shadow: 0 14px 30px rgba(142, 24, 40, 0.20) !important;
}

.dj-modern-primary-toggle:hover {
    transform: translateY(-1px) !important;
    filter: brightness(0.98) !important;
}

/* mais opções */
.dj-modern-more-wrap {
    position: relative !important;
}

.dj-modern-more-btn {
    width: 100% !important;
    min-height: 88px !important;
    padding: 0 22px !important;

    background: #ffffff !important;
    color: #8f1d2c !important;
    -webkit-text-fill-color: #8f1d2c !important;

    border: 1px solid #eadcdf !important;
    border-radius: 20px !important;

    font-size: 16px !important;
    font-weight: 750 !important;

    box-shadow: 0 12px 28px rgba(67, 18, 25, 0.05) !important;
    cursor: pointer !important;
}

.dj-modern-more-btn:hover {
    background: #fff7f8 !important;
}

.dj-modern-more-menu {
    position: absolute !important;
    top: calc(100% + 10px) !important;
    right: 0 !important;

    min-width: 280px !important;
    padding: 10px !important;

    display: none !important;
    flex-direction: column !important;
    gap: 8px !important;

    background: #ffffff !important;
    border: 1px solid #eadcdf !important;
    border-radius: 18px !important;
    box-shadow: 0 18px 40px rgba(63, 19, 28, 0.12) !important;

    z-index: 9999 !important;
}

.dj-modern-more-wrap.open .dj-modern-more-menu {
    display: flex !important;
}

.dj-modern-menu-item {
    min-height: 48px !important;
    padding: 0 14px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;

    background: #fff8f9 !important;
    color: #8f1d2c !important;
    -webkit-text-fill-color: #8f1d2c !important;

    border: 1px solid #f0dde1 !important;
    border-radius: 12px !important;

    font-size: 14px !important;
    font-weight: 700 !important;
    cursor: pointer !important;
}

.dj-modern-menu-item:hover {
    background: #fdf0f3 !important;
}

/* responsivo */
@media (max-width: 1180px) {
    .dj-modern-actions-bar {
        grid-template-columns: 1fr !important;
        max-width: 420px !important;
    }

    .dj-modern-primary-toggle,
    .dj-modern-more-btn,
    .dj-modern-status-card {
        min-height: 72px !important;
    }
}

@media (max-width: 760px) {
    .dj-modern-actions-bar {
        max-width: 100% !important;
    }

    .dj-modern-status-card,
    .dj-modern-primary-toggle,
    .dj-modern-more-btn {
        min-height: 64px !important;
        border-radius: 16px !important;
    }

    .dj-modern-primary-toggle,
    .dj-modern-more-btn {
        font-size: 15px !important;
    }
}
/* =========================================================
   SOLICITAR ENTREGADOR — MODAL PADRONIZADO
   ========================================================= */

.dj-courier-request-dialog {
    background: #ffffff !important;
    color: #241f21 !important;

    border: 1px solid #e4d4d8 !important;
    border-radius: 24px !important;

    box-shadow:
        0 24px 60px rgba(55, 20, 29, 0.18) !important;
}

/* Título do modal */
.dj-courier-request-title {
    color: #951e31 !important;
    -webkit-text-fill-color: #951e31 !important;

    font-size: 14px !important;
    font-weight: 850 !important;
    letter-spacing: 0.11em !important;
    text-transform: uppercase !important;
}

/* Linha divisória do cabeçalho */
.dj-courier-request-dialog hr {
    border: 0 !important;
    border-top: 1px solid #eadde0 !important;
}

/* Todos os rótulos */
.dj-courier-request-dialog label {
    color: #342d30 !important;
    -webkit-text-fill-color: #342d30 !important;

    font-size: 13px !important;
    font-weight: 750 !important;
}

/* Campos do formulário */
.dj-courier-request-dialog input,
.dj-courier-request-dialog select,
.dj-courier-request-dialog textarea {
    width: 100% !important;

    background: #ffffff !important;
    color: #241f21 !important;
    -webkit-text-fill-color: #241f21 !important;

    border: 1px solid #decdd1 !important;
    border-radius: 14px !important;

    font-size: 15px !important;
    font-weight: 600 !important;

    box-shadow: none !important;
}

/* Inputs e selects */
.dj-courier-request-dialog input,
.dj-courier-request-dialog select {
    min-height: 54px !important;
    padding: 0 16px !important;
}

/* Descrição dos volumes */
.dj-courier-request-dialog textarea {
    min-height: 108px !important;
    padding: 15px 16px !important;

    line-height: 1.45 !important;
    resize: vertical !important;
}

/* Placeholder */
.dj-courier-request-dialog input::placeholder,
.dj-courier-request-dialog textarea::placeholder {
    color: #97888d !important;
    -webkit-text-fill-color: #97888d !important;
    opacity: 1 !important;
}

/* Foco */
.dj-courier-request-dialog input:focus,
.dj-courier-request-dialog select:focus,
.dj-courier-request-dialog textarea:focus {
    outline: none !important;

    border-color: #a52338 !important;

    box-shadow:
        0 0 0 4px rgba(165, 35, 56, 0.11) !important;
}

/* Opções internas do select */
.dj-courier-request-dialog select option {
    background: #ffffff !important;
    color: #241f21 !important;
}

/* =========================================================
   RESUMO DO PEDIDO
   ========================================================= */

.dj-courier-order-summary {
    background:
        linear-gradient(
            135deg,
            #fff8f9 0%,
            #f8ebee 100%
        ) !important;

    color: #241f21 !important;

    border: 1px solid #ead0d6 !important;
    border-radius: 18px !important;

    box-shadow: none !important;
}

.dj-courier-order-summary,
.dj-courier-order-summary * {
    color: #241f21 !important;
    -webkit-text-fill-color: #241f21 !important;
}

.dj-courier-order-summary strong {
    color: #7f1928 !important;
    -webkit-text-fill-color: #7f1928 !important;
}

.dj-courier-order-summary span,
.dj-courier-order-summary small {
    color: #75666b !important;
    -webkit-text-fill-color: #75666b !important;
}

/* Mantém o bloco do ícone em destaque */
.dj-courier-order-summary > div:first-child {
    background: #a42035 !important;
    color: #ffffff !important;
}

.dj-courier-order-summary > div:first-child * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

/* =========================================================
   AVISO SOBRE ENTREGADORES
   ========================================================= */

.dj-courier-info-card {
    background: #fff7f8 !important;
    color: #5d4b50 !important;

    border: 1px solid #ead0d6 !important;
    border-radius: 16px !important;

    box-shadow: none !important;
}

.dj-courier-info-card,
.dj-courier-info-card * {
    color: #5d4b50 !important;
    -webkit-text-fill-color: #5d4b50 !important;
}

/* Primeiro ícone ou marcador do aviso */
.dj-courier-info-card > :first-child {
    color: #a42035 !important;
    -webkit-text-fill-color: #a42035 !important;
}

/* =========================================================
   BOTÕES
   ========================================================= */

.dj-courier-cancel-button,
.dj-courier-submit-button {
    min-height: 54px !important;
    padding: 0 22px !important;

    border-radius: 14px !important;

    font-size: 15px !important;
    font-weight: 800 !important;
}

/* Cancelar */
.dj-courier-cancel-button {
    background: #ffffff !important;

    color: #8e1c2e !important;
    -webkit-text-fill-color: #8e1c2e !important;

    border: 1px solid #dcbfc5 !important;

    box-shadow: none !important;
}

.dj-courier-cancel-button:hover {
    background: #fff4f6 !important;
    border-color: #ca909c !important;
}

/* Despachar pedido */
.dj-courier-submit-button {
    background:
        linear-gradient(
            135deg,
            #a72136,
            #861827
        ) !important;

    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;

    border: 1px solid #861827 !important;

    box-shadow:
        0 9px 22px rgba(134, 24, 39, 0.19) !important;
}

.dj-courier-submit-button,
.dj-courier-submit-button * {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

.dj-courier-submit-button:hover {
    background: #781522 !important;
    transform: translateY(-1px) !important;
}

/* Fechar modal */
.dj-courier-close-button {
    width: 46px !important;
    height: 46px !important;
    min-width: 46px !important;
    min-height: 46px !important;
    padding: 0 !important;

    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #fff1f3 !important;

    color: #971e31 !important;
    -webkit-text-fill-color: #971e31 !important;

    border: 1px solid #ecd4d9 !important;
    border-radius: 14px !important;

    box-shadow: none !important;
}

.dj-courier-close-button:hover {
    background: #f9dfe4 !important;
    color: #7c1726 !important;
}

/* =========================================================
   RESPONSIVIDADE
   ========================================================= */

@media (max-width: 700px) {
    .dj-courier-request-dialog {
        border-radius: 20px !important;
    }

    .dj-courier-request-dialog input,
    .dj-courier-request-dialog select {
        min-height: 50px !important;
    }

    .dj-courier-cancel-button,
    .dj-courier-submit-button {
        width: 100% !important;
        min-height: 50px !important;
    }
}
/* =========================================================
   ADMIN NOTIFICATIONS V1
   ========================================================= */

.admin-notification-layout {
    display: grid;
    grid-template-columns:
        minmax(280px, 0.85fr)
        minmax(0, 1.35fr);
    gap: 24px;
    align-items: start;
}

.admin-notification-card {
    background: #ffffff !important;
    color: #271f21 !important;

    border: 1px solid #e4d7da !important;
    border-radius: 22px !important;

    padding: 24px !important;

    box-shadow:
        0 15px 38px rgba(67, 29, 37, 0.08) !important;
}

.admin-notification-card-heading {
    margin-bottom: 20px;
}

.admin-notification-card-heading h3 {
    margin: 5px 0 0;
    color: #271f21 !important;
    font-size: 22px;
}

.admin-notification-audiences {
    display: grid;
    gap: 12px;
}

.admin-notification-audience {
    position: relative;

    display: grid !important;
    grid-template-columns: 48px 1fr;
    gap: 14px;
    align-items: center;

    min-height: 88px;
    padding: 15px !important;

    background: #fffafa !important;
    color: #33292c !important;

    border: 1px solid #eadcdf !important;
    border-radius: 16px !important;

    cursor: pointer;

    transition:
        border-color 0.18s ease,
        background 0.18s ease,
        transform 0.18s ease,
        box-shadow 0.18s ease;
}

.admin-notification-audience:hover {
    background: #fff5f6 !important;
    border-color: #d9adb5 !important;
    transform: translateY(-1px);
}

.admin-notification-audience.selected {
    background: #fff1f3 !important;
    border-color: #a01f33 !important;

    box-shadow:
        0 0 0 3px rgba(160, 31, 51, 0.10) !important;
}

.admin-notification-audience input {
    position: absolute !important;
    opacity: 0 !important;
    pointer-events: none !important;
}

.admin-notification-audience-icon {
    width: 48px;
    height: 48px;

    display: inline-flex;
    align-items: center;
    justify-content: center;

    background: #f5e2e6 !important;
    color: #951e31 !important;

    border-radius: 14px;

    font-size: 20px;
    font-weight: 900;
}

.admin-notification-audience.selected
.admin-notification-audience-icon {
    background: #971d31 !important;
    color: #ffffff !important;
}

.admin-notification-audience strong {
    display: block;

    color: #2b2224 !important;
    font-size: 15px;
    font-weight: 800;
}

.admin-notification-audience small {
    display: block;
    margin-top: 4px;

    color: #7a6c70 !important;
    line-height: 1.35;
}

.admin-notification-city {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;

    margin-bottom: 18px;
    padding: 14px 16px;

    background: #f8f3f4 !important;

    border: 1px solid #e8dcdf !important;
    border-radius: 14px;
}

.admin-notification-city span {
    color: #75676b !important;
    font-size: 13px;
}

.admin-notification-city strong {
    color: #8e1d2f !important;
}

.admin-notification-field {
    display: block !important;
    margin-top: 16px;
}

.admin-notification-field > span {
    display: block;
    margin-bottom: 7px;

    color: #3a3033 !important;

    font-size: 13px;
    font-weight: 800;
}

.admin-notification-field input,
.admin-notification-field textarea {
    width: 100% !important;

    background: #ffffff !important;

    color: #282022 !important;
    -webkit-text-fill-color: #282022 !important;

    border: 1px solid #dbcdd0 !important;
    border-radius: 14px !important;

    box-shadow: none !important;

    font-size: 15px !important;
}

.admin-notification-field input {
    min-height: 52px;
    padding: 0 15px !important;
}

.admin-notification-field textarea {
    min-height: 142px;
    padding: 14px 15px !important;
    line-height: 1.48;
    resize: vertical;
}

.admin-notification-field input::placeholder,
.admin-notification-field textarea::placeholder {
    color: #9b8e92 !important;
    -webkit-text-fill-color: #9b8e92 !important;
    opacity: 1;
}

.admin-notification-field input:focus,
.admin-notification-field textarea:focus {
    outline: none !important;

    border-color: #a01f33 !important;

    box-shadow:
        0 0 0 4px rgba(160, 31, 51, 0.10) !important;
}

.admin-notification-field small {
    display: block;
    margin-top: 6px;

    color: #887a7e !important;
    text-align: right;
}

.admin-notification-preview {
    margin-top: 20px;
    padding: 18px;

    background:
        linear-gradient(
            135deg,
            #fff8f9 0%,
            #f8eaed 100%
        ) !important;

    border: 1px solid #e9ced4 !important;
    border-radius: 16px !important;
}

.admin-notification-preview strong {
    display: block;
    margin-top: 5px;

    color: #8b1b2d !important;
    font-size: 17px;
}

.admin-notification-preview p {
    margin: 7px 0 0;

    color: #5f5256 !important;
    line-height: 1.45;
}

.admin-notification-actions {
    display: flex;
    justify-content: flex-end;
    margin-top: 20px;
}

.admin-notification-actions .primary-button {
    min-height: 52px;
    min-width: 210px;

    border-radius: 14px !important;
}

.admin-notification-result {
    margin: 18px 0 0;
    padding: 13px 15px;

    border-radius: 13px;

    font-size: 14px;
    font-weight: 700;
}

.admin-notification-result.success {
    background: #eaf8f0 !important;
    color: #14683b !important;
    border: 1px solid #b7e2c8 !important;
}

.admin-notification-result.warning {
    background: #fff7e5 !important;
    color: #7a5510 !important;
    border: 1px solid #efd99e !important;
}

.admin-notification-result.error {
    background: #fff0f2 !important;
    color: #922038 !important;
    border: 1px solid #ebc2ca !important;
}

@media (max-width: 900px) {
    .admin-notification-layout {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    .admin-notification-card {
        padding: 18px !important;
        border-radius: 18px !important;
    }

    .admin-notification-actions {
        display: block;
    }

    .admin-notification-actions .primary-button {
        width: 100%;
    }

    .admin-notification-city {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
    }
}


/* =========================================================
   PHONE VERIFICATION SMS TOKEN V1
   ========================================================= */

.phone-verification-view {
    padding-top: 36px;
}

.phone-verification-card {
    max-width: 560px;
    margin: 0 auto;
    padding: 34px;

    background: #ffffff;
    color: #2b2224;

    border: 1px solid #e5d7da;
    border-radius: 24px;

    box-shadow:
        0 20px 52px rgba(70, 26, 36, 0.11);

    text-align: center;
}

.phone-verification-card h1 {
    margin: 8px 0 10px;
    color: #2d2325;
}

.phone-verification-card > p {
    color: #74666a;
    line-height: 1.5;
}

.phone-verification-icon {
    width: 66px;
    height: 66px;
    margin: 0 auto 18px;

    display: flex;
    align-items: center;
    justify-content: center;

    background: #f8e5e9;
    color: #981e32;

    border-radius: 20px;

    font-size: 30px;
    font-weight: 900;
}

.phone-verification-number {
    display: block;
    margin: 14px 0 24px;

    color: #8f1c2f;
    font-size: 20px;
}

#phone-verification-form {
    display: grid;
    gap: 16px;
}

#phone-verification-form label {
    display: grid;
    gap: 8px;

    color: #403538;
    font-size: 13px;
    font-weight: 800;
    text-align: left;
}

#phone-verification-form input {
    width: 100%;
    min-height: 60px;

    background: #ffffff;
    color: #261f21;
    -webkit-text-fill-color: #261f21;

    border: 1px solid #d9c9cd;
    border-radius: 15px;

    font-size: 25px;
    font-weight: 850;
    letter-spacing: 0.18em;
    text-align: center;
}

#phone-verification-form input:focus {
    outline: none;
    border-color: #9b1e32;

    box-shadow:
        0 0 0 4px rgba(155, 30, 50, 0.10);
}

#phone-verification-resend {
    margin-top: 12px;
}

.phone-verification-feedback {
    min-height: 22px;
    margin: 16px 0 0;

    font-size: 14px;
    font-weight: 700;
}

.phone-verification-feedback.success {
    color: #177044;
}

.phone-verification-feedback.error {
    color: #a01e35;
}

@media (max-width: 620px) {
    .phone-verification-card {
        padding: 24px 18px;
        border-radius: 20px;
    }
}


/* =========================================================
   REGISTRATION FIELD VALIDATION V2
   ========================================================= */

.registration-field-feedback {
    display: block;
    min-height: 18px;
    margin-top: 5px;

    font-size: 12px;
    font-weight: 700;
    line-height: 1.35;
}

.registration-field-feedback.success {
    color: #177044;
}

.registration-field-feedback.error {
    color: #a01e35;
}

.registration-field-feedback.checking {
    color: #74666a;
}

input.registration-valid,
select.registration-valid {
    border-color: #24935d !important;

    box-shadow:
        0 0 0 3px rgba(36, 147, 93, 0.10);
}

input.registration-invalid,
select.registration-invalid {
    border-color: #b3263e !important;

    box-shadow:
        0 0 0 3px rgba(179, 38, 62, 0.10);
}

input.registration-checking,
select.registration-checking {
    border-color: #b29b56 !important;

    box-shadow:
        0 0 0 3px rgba(178, 155, 86, 0.10);
}

/* DELIVERY JURUTI — TIPOGRAFIA MODERNA V1 */

:root {
    --font-interface:
        "Inter",
        "Segoe UI Variable",
        "Segoe UI",
        Roboto,
        Helvetica,
        Arial,
        sans-serif;
}

/* Base geral da aplicação */

html,
body,
button,
input,
select,
textarea,
option {
    font-family: var(--font-interface);
}

body {
    font-weight: 400;
    letter-spacing: -0.006em;

    text-rendering: optimizeLegibility;

    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}


/* Títulos principais */

h1,
.page-title,
.hero-title,
.admin-title,
.dashboard-title,
.panel-title {
    font-family: var(--font-interface);

    font-weight: 800;
    line-height: 1.08;
    letter-spacing: -0.042em;
}


/* Títulos secundários */

h2,
h3,
.card-title,
.section-title,
.modal-title {
    font-family: var(--font-interface);

    font-weight: 700;
    line-height: 1.2;
    letter-spacing: -0.026em;
}


/* Textos auxiliares dos títulos */

.subtitle,
.page-subtitle,
.hero-subtitle,
.panel-description,
.section-description {
    font-weight: 400;
    line-height: 1.55;
    letter-spacing: -0.012em;
}


/* Identidade e nome do aplicativo */

.brand,
.brand-name,
.logo-name,
.app-name {
    font-family: var(--font-interface);

    font-weight: 800;
    letter-spacing: -0.035em;
}


/* Menus principais e abas */

nav a,
.nav-link,
.menu-link,
.tab-button,
.tabs button,
[role="tab"] {
    font-family: var(--font-interface);

    font-weight: 600;
    letter-spacing: -0.016em;
}


/* Aba ativa */

.nav-link.active,
.menu-link.active,
.tab-button.active,
.tabs button.active,
[role="tab"][aria-selected="true"] {
    font-weight: 700;
}


/* Botões */

button,
.button,
.btn {
    font-family: var(--font-interface);

    font-weight: 600;
    letter-spacing: -0.012em;
}


/* Formulários */

label,
.form-label,
.field-label {
    font-family: var(--font-interface);

    font-weight: 500;
    letter-spacing: -0.008em;
}

input,
select,
textarea {
    font-weight: 500;
    letter-spacing: -0.008em;
}


/* Textos pequenos em destaque */

.eyebrow,
.kicker,
.overline,
.section-kicker,
.admin-eyebrow {
    font-family: var(--font-interface);

    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
}


/* Cards e painéis */

.card,
.panel,
.dashboard-card,
.admin-card,
.summary-card,
.metric-card {
    font-family: var(--font-interface);
}


/* Tabelas */

table,
.table {
    font-family: var(--font-interface);

    font-variant-numeric: tabular-nums;
}

th {
    font-weight: 700;
    letter-spacing: -0.012em;
}

td {
    font-weight: 450;
    letter-spacing: -0.008em;
}


/* Indicadores e valores numéricos */

.metric-value,
.summary-value,
.stat-value,
.dashboard-number,
.currency-value {
    font-weight: 700;
    letter-spacing: -0.028em;

    font-variant-numeric: tabular-nums;
}


/* Melhor leitura em telas pequenas */

@media (max-width: 768px) {
    h1,
    .page-title,
    .hero-title,
    .admin-title,
    .dashboard-title {
        letter-spacing: -0.034em;
    }

    nav a,
    .nav-link,
    .menu-link,
    .tab-button,
    .tabs button,
    [role="tab"] {
        letter-spacing: -0.012em;
    }
}

/* FIM — TIPOGRAFIA MODERNA V1 */


/* DELIVERY JURUTI — RECEBEDOR CHECKOUT V1 */

.checkout-receiver-section {
    display: grid;
    gap: 16px;

    padding: 20px;

    border: 1px solid #ded7d4;
    border-radius: 20px;

    background:
        linear-gradient(
            145deg,
            #ffffff,
            #faf7f5
        );

    box-shadow:
        0 12px 30px rgba(39, 26, 29, 0.07);
}

.checkout-receiver-heading h2 {
    margin: 4px 0 0;

    font-size: 22px;
    line-height: 1.15;
}

.checkout-receiver-options {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 12px;
}

.checkout-receiver-option {
    position: relative;

    display: grid;
    grid-template-columns: 22px 1fr;
    gap: 12px;
    align-items: flex-start;

    min-height: 112px;
    padding: 16px;

    border: 1px solid #ddd5d2;
    border-radius: 16px;

    background: #ffffff;

    cursor: pointer;

    transition:
        border-color 160ms ease,
        box-shadow 160ms ease,
        transform 160ms ease;
}

.checkout-receiver-option:hover {
    transform: translateY(-1px);
}

.checkout-receiver-option.selected {
    border-color: #9e2635;

    box-shadow:
        0 0 0 3px rgba(158, 38, 53, 0.10);
}

.checkout-receiver-option input {
    position: absolute;

    width: 1px;
    height: 1px;

    opacity: 0;
    pointer-events: none;
}

.checkout-receiver-radio {
    position: relative;

    display: block;

    width: 22px;
    height: 22px;

    border: 2px solid #b8abaa;
    border-radius: 50%;

    background: #ffffff;
}

.checkout-receiver-option.selected
.checkout-receiver-radio {
    border-color: #9e2635;
}

.checkout-receiver-option.selected
.checkout-receiver-radio::after {
    content: "";

    position: absolute;
    inset: 4px;

    border-radius: 50%;

    background: #9e2635;
}

.checkout-receiver-option > span:last-child {
    display: grid;
    gap: 6px;
}

.checkout-receiver-option strong {
    font-size: 16px;
    font-weight: 750;
}

.checkout-receiver-option small {
    color: #6f6567;

    font-size: 13px;
    line-height: 1.45;
}

.checkout-other-receiver {
    display: grid;
    grid-template-columns:
        repeat(2, minmax(0, 1fr));

    gap: 12px;
}

.checkout-other-receiver[hidden] {
    display: none !important;
}

.checkout-other-receiver label {
    display: grid;
    gap: 7px;

    font-weight: 650;
}

.checkout-other-receiver input {
    width: 100%;
    min-height: 48px;
    padding: 12px 14px;

    border: 1px solid #d5cdca;
    border-radius: 13px;

    background: #ffffff;

    font: inherit;
}

.checkout-current-location-card {
    display: flex;
    gap: 16px;
    align-items: center;
    justify-content: space-between;

    padding: 16px;

    border: 1px solid #ded6d3;
    border-radius: 16px;

    background: #ffffff;
}

.checkout-current-location-card[hidden] {
    display: none !important;
}

.checkout-current-location-card > div {
    display: grid;
    gap: 5px;
}

.checkout-current-location-card span {
    font-size: 14px;
    font-weight: 650;
}

.checkout-current-location-card small {
    color: #72686a;

    font-size: 12px;
    line-height: 1.4;
}

.checkout-current-location-card button {
    flex: 0 0 auto;

    min-height: 44px;
    padding: 10px 14px;

    border: 0;
    border-radius: 12px;

    background: #9e2635;
    color: #ffffff;

    font: inherit;
    font-weight: 700;

    cursor: pointer;
}

.checkout-current-location-card button:disabled {
    opacity: 0.65;
    cursor: wait;
}

.checkout-current-location-card[
    data-location-state="accurate"
] {
    border-color: #75b891;
    background: #f3fbf6;
}

.checkout-current-location-card[
    data-location-state="warning"
] {
    border-color: #d1aa59;
    background: #fffaf0;
}

.checkout-current-location-card[
    data-location-state="error"
] {
    border-color: #cf7a83;
    background: #fff5f6;
}

.checkout-current-location-card[
    data-location-state="checking"
] {
    border-color: #ad9b72;
}

.checkout-address-location-note {
    padding: 12px 14px;

    border-radius: 12px;

    background: rgba(158, 38, 53, 0.07);
    color: #63585a;

    font-size: 13px;
    line-height: 1.45;
}

@media (max-width: 640px) {
    .checkout-receiver-options,
    .checkout-other-receiver {
        grid-template-columns: 1fr;
    }

    .checkout-receiver-option {
        min-height: auto;
    }

    .checkout-current-location-card {
        align-items: stretch;
        flex-direction: column;
    }

    .checkout-current-location-card button {
        width: 100%;
    }
}

/* FIM — RECEBEDOR CHECKOUT V1 */

/* VISUAL CONSOLIDADO V8 START */

:root {
  --dj-v8-surface: #fcfbfb;
  --dj-v8-surface-soft: #f7f2f4;
  --dj-v8-border: #ead7dc;
  --dj-v8-text: #251f20;
  --dj-v8-text-2: #6f6467;
  --dj-v8-text-3: #94898b;
  --dj-v8-primary: #8e1f2b;
  --dj-v8-primary-strong: #a61f32;
  --dj-v8-primary-soft: #f6dde4;
  --dj-v8-primary-soft-2: #fbecef;
  --dj-v8-success: #157347;
  --dj-v8-success-soft: #e7f5ed;
  --dj-v8-warning: #8e1f2b;
  --dj-v8-warning-soft: #f8e9ed;
  --dj-v8-shadow: 0 8px 24px rgba(49, 27, 36, 0.06);
}

/* ------------------------------------------------------------
   1. Reset geral contra preto / laranja / gradiente indevido
   ------------------------------------------------------------ */
.saved-address-card,
.saved-address-card *,
.checkout-address-card,
.checkout-address-card *,
.order-card,
.order-card *,
.consumer-order-card,
.consumer-order-card *,
.payment-choice-row,
.payment-choice-row *,
.consumer-notes-field,
.consumer-notes-field *,
.store-detail-card,
.store-detail-card *,
.restaurant-card,
.restaurant-card * {
  text-shadow: none !important;
}

.saved-address-card,
.checkout-address-card,
.consumer-order-card,
.payment-choice-row,
.consumer-notes-field,
.order-status-card,
.store-detail-card,
.consumer-store-summary,
.restaurant-hero-card {
  background-image: none !important;
}

/* ------------------------------------------------------------
   2. Header / topo mobile e detalhes do restaurante
   ------------------------------------------------------------ */
.app-header,
.consumer-header,
.consumer-topbar,
.mobile-header,
.header-compact,
.store-topbar,
#view-restaurant .app-header,
#view-restaurant .consumer-header {
  background: var(--dj-v8-surface) !important;
  color: var(--dj-v8-text) !important;
  border-bottom: 1px solid var(--dj-v8-border) !important;
  box-shadow: none !important;
}

.app-header *,
.consumer-header *,
.consumer-topbar *,
.mobile-header *,
.header-compact *,
.store-topbar * {
  color: var(--dj-v8-text) !important;
}

#view-restaurant .consumer-store-summary,
#view-restaurant .store-detail-card,
#view-restaurant .restaurant-hero-card,
#view-restaurant .merchant-profile-card {
  background: #ffffff !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: var(--dj-v8-shadow) !important;
}

/* Fundo atrás da imagem do restaurante */
#view-home [data-restaurant-id] img,
#view-restaurant img,
.consumer-store-summary img,
.store-detail-card img,
.restaurant-card img {
  background: transparent !important;
}

#view-home [data-restaurant-id] .store-photo,
#view-home [data-restaurant-id] .restaurant-thumb,
#view-home [data-restaurant-id] .restaurant-cover,
#view-restaurant .store-photo,
#view-restaurant .restaurant-avatar,
#view-restaurant .restaurant-cover,
#view-restaurant .restaurant-thumb,
.consumer-store-summary .store-photo,
.consumer-store-summary .restaurant-avatar,
.consumer-store-summary .restaurant-cover,
.store-detail-card .store-photo,
.store-detail-card .restaurant-avatar {
  background: var(--dj-v8-surface-soft) !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: none !important;
}

/* Selo "ABERTO" sem verde forte atrás da foto */
.open-badge,
.status-open,
.store-open-pill,
.store-open-chip {
  background: var(--dj-v8-success-soft) !important;
  color: var(--dj-v8-success) !important;
  border: 1px solid #b9dfc9 !important;
}

/* ------------------------------------------------------------
   3. Endereços — remover gradiente escuro / letras brancas
   ------------------------------------------------------------ */
.saved-address-card,
.address-card,
.profile-address-card,
.checkout-address-card,
#checkout-saved-addresses .checkout-address-card {
  background: #ffffff !important;
  color: var(--dj-v8-text) !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: var(--dj-v8-shadow) !important;
}

.saved-address-card *,
.address-card *,
.profile-address-card *,
.checkout-address-card *,
#checkout-saved-addresses .checkout-address-card * {
  color: inherit !important;
}

.saved-address-card .address-subtitle,
.saved-address-card .address-secondary,
.saved-address-card small,
.saved-address-card em,
.address-card small,
.profile-address-card small,
.checkout-address-card small,
.checkout-address-card em {
  color: var(--dj-v8-text-2) !important;
}

.saved-address-card .primary-badge,
.address-card .primary-badge,
.profile-address-card .primary-badge,
.checkout-address-card.default em,
.checkout-address-card .is-default {
  background: var(--dj-v8-primary-soft) !important;
  color: var(--dj-v8-primary) !important;
  border: 1px solid #e6b8c3 !important;
  border-radius: 999px !important;
  padding: 2px 8px !important;
  font-style: normal !important;
  font-weight: 700 !important;
}

.checkout-address-card.selected,
.checkout-address-card[aria-checked="true"],
.saved-address-card.selected,
.address-card.selected {
  background: var(--dj-v8-primary-soft-2) !important;
  border-color: #d896a4 !important;
}

.checkout-address-row,
.checkout-address-row *,
.checkout-selected-address,
.checkout-selected-address * {
  color: var(--dj-v8-text) !important;
}

.checkout-address-row small,
.checkout-address-row .muted,
.checkout-selected-address small,
.checkout-selected-address .muted {
  color: var(--dj-v8-text-2) !important;
}

/* ------------------------------------------------------------
   4. Checkout — receptor / endereço / pagamento / observações
   ------------------------------------------------------------ */
#view-checkout h1,
#view-checkout h2,
#view-checkout h3,
#view-checkout strong,
#view-checkout b,
#view-checkout label {
  color: var(--dj-v8-text) !important;
}



/* Não deixar descrições do bloco cinzas ficarem brancas */
#view-checkout .checkout-section * {
  color: inherit;
}

#view-checkout [role="radio"],
#view-checkout .receiver-choice-card,
#view-checkout .selection-card,
#view-checkout .choice-card {
  background: #ffffff !important;
  color: var(--dj-v8-text) !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: none !important;
}

#view-checkout [role="radio"][aria-checked="true"],
#view-checkout .receiver-choice-card.selected,
#view-checkout .selection-card.selected,
#view-checkout .choice-card.selected {
  background: var(--dj-v8-primary-soft-2) !important;
  border-color: #d896a4 !important;
}

#view-checkout .payment-choice-row,
#view-checkout .consumer-notes-field,
#view-checkout .consumer-checkout-summary,
#view-checkout .coupon-compact {
  background: #ffffff !important;
  color: var(--dj-v8-text) !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: none !important;
}

#view-checkout .payment-choice-row > button,
#view-checkout #payment-method-button {
  background: #ffffff !important;
  color: var(--dj-v8-text) !important;
  border: 0 !important;
  box-shadow: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
}

#view-checkout #payment-method-label,
#view-checkout .payment-choice-row strong,
#view-checkout .payment-choice-row b {
  color: var(--dj-v8-text) !important;
}

#view-checkout .payment-choice-row .change-payment,
#view-checkout .payment-choice-row .action-link,
#view-checkout .payment-choice-row > button strong:last-child {
  color: var(--dj-v8-primary) !important;
}

#view-checkout .payment-choice-row select,
#view-checkout .payment-choice-row select option {
  color: var(--dj-v8-text) !important;
  background: #ffffff !important;
}

#view-checkout .consumer-notes-field > span,
#view-checkout .consumer-notes-field label,
#view-checkout .consumer-notes-field strong {
  color: var(--dj-v8-text) !important;
}

#view-checkout textarea,
#view-checkout input,
#view-checkout select {
  background: #ffffff !important;
  color: var(--dj-v8-text) !important;
  border-color: var(--dj-v8-border) !important;
}

#view-checkout textarea::placeholder,
#view-checkout input::placeholder {
  color: var(--dj-v8-text-2) !important;
  opacity: 1 !important;
}

#view-checkout .consumer-checkout-summary .summary-row {
  color: var(--dj-v8-text-2) !important;
}

#view-checkout .consumer-checkout-summary .summary-row strong {
  color: var(--dj-v8-text) !important;
}

#view-checkout .consumer-checkout-summary .summary-row.total,
#view-checkout .consumer-checkout-summary .summary-row.total strong,
#view-checkout .consumer-checkout-summary .summary-row:last-child strong {
  color: var(--dj-v8-primary) !important;
}

/* Botões padrão */
#view-checkout .primary-button,
#view-checkout .consumer-sticky-action,
#view-checkout button[type="submit"] {
  background: var(--dj-v8-primary) !important;
  color: #ffffff !important;
  border-color: var(--dj-v8-primary) !important;
}

#view-checkout .primary-button:hover,
#view-checkout .consumer-sticky-action:hover,
#view-checkout button[type="submit"]:hover {
  background: var(--dj-v8-primary-strong) !important;
  border-color: var(--dj-v8-primary-strong) !important;
}

#view-checkout .secondary-button,
#view-checkout .outline-button,
#view-checkout button:not([type="submit"]).secondary {
  background: #ffffff !important;
  color: var(--dj-v8-primary) !important;
  border-color: var(--dj-v8-border) !important;
}

#view-checkout .secondary-button:hover,
#view-checkout .outline-button:hover,
#view-checkout button:not([type="submit"]).secondary:hover {
  background: var(--dj-v8-primary-soft) !important;
  color: var(--dj-v8-primary-strong) !important;
  border-color: #d896a4 !important;
}

/* ------------------------------------------------------------
   5. Lista de pedidos / detalhes — status limpos
   ------------------------------------------------------------ */
#view-orders .consumer-order-card,
#view-orders .order-card,
#view-order-details .consumer-order-card,
#view-order-details .order-card {
  background: #ffffff !important;
  border: 1px solid var(--dj-v8-border) !important;
  box-shadow: var(--dj-v8-shadow) !important;
}

#view-orders .consumer-order-card h3,
#view-orders .consumer-order-card strong,
#view-order-details .consumer-order-card h3,
#view-order-details .consumer-order-card strong {
  color: var(--dj-v8-text) !important;
}

#view-orders .consumer-order-card small,
#view-orders .consumer-order-card span,
#view-order-details .consumer-order-card small,
#view-order-details .consumer-order-card span {
  color: var(--dj-v8-text-2) !important;
}

#view-orders .consumer-order-card .dj-order-status,
#view-order-details .dj-order-status,
#view-order-success .dj-order-status {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 7px 14px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  border: 1px solid transparent !important;
  box-shadow: none !important;
  background-image: none !important;
}

#view-orders .consumer-order-card .dj-order-status.is-received,
#view-order-details .dj-order-status.is-received,
#view-order-success .dj-order-status.is-received {
  background: var(--dj-v8-warning-soft) !important;
  color: var(--dj-v8-warning) !important;
  border-color: #e5b8c4 !important;
}

#view-orders .consumer-order-card .dj-order-status.is-delivered,
#view-order-details .dj-order-status.is-delivered,
#view-order-success .dj-order-status.is-delivered {
  background: var(--dj-v8-success-soft) !important;
  color: var(--dj-v8-success) !important;
  border-color: #b9dfc9 !important;
}

#view-orders .consumer-order-card .dj-order-status.is-default,
#view-order-details .dj-order-status.is-default,
#view-order-success .dj-order-status.is-default {
  background: var(--dj-v8-surface-soft) !important;
  color: var(--dj-v8-text) !important;
  border-color: var(--dj-v8-border) !important;
}

/* timeline */
#view-order-details .tracking-stage,
#view-order-success .tracking-stage {
  color: var(--dj-v8-text) !important;
}

#view-order-details .tracking-stage small,
#view-order-success .tracking-stage small {
  color: var(--dj-v8-text-2) !important;
}

#view-order-details .tracking-stage.active .tracking-icon,
#view-order-success .tracking-stage.active .tracking-icon,
#view-order-details .tracking-stage.done .tracking-icon,
#view-order-success .tracking-stage.done .tracking-icon {
  background: var(--dj-v8-success-soft) !important;
  color: var(--dj-v8-success) !important;
  border-color: #b9dfc9 !important;
}

/* ------------------------------------------------------------
   6. Hover / foco sempre em tons de vermelho
   ------------------------------------------------------------ */
button:hover,
a:hover,
[role="button"]:hover {
  filter: none !important;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 2px solid rgba(142, 31, 43, 0.28) !important;
  outline-offset: 2px !important;
}

/* VISUAL CONSOLIDADO V8 END */

/* VISUAL MOBILE RESIDUAL V9 START */

:root {
  --dj-v9-surface: #fcfbfb;
  --dj-v9-surface-soft: #f8edef;
  --dj-v9-border: #ead7dc;
  --dj-v9-text: #251f20;
  --dj-v9-text-2: #6f6467;
  --dj-v9-text-3: #94898b;
  --dj-v9-primary: #8e1f2b;
  --dj-v9-primary-strong: #a41f31;
  --dj-v9-primary-soft: #f6dde4;
  --dj-v9-success: #157347;
  --dj-v9-success-soft: #e7f5ed;
}

/* ------------------------------------------------------------
   1. MOBILE HOME / TOPO
   ------------------------------------------------------------ */
@media (max-width: 768px) {
  #view-home .consumer-header,
  #view-home .app-header,
  #view-home .consumer-topbar,
  #view-home .home-topbar,
  #view-home .city-bar,
  #view-home .hero-header,
  #view-home .header-compact {
    background: var(--dj-v9-surface) !important;
    color: var(--dj-v9-text) !important;
    border-bottom: 1px solid var(--dj-v9-border) !important;
    box-shadow: none !important;
  }

  #view-home .consumer-header *,
  #view-home .app-header *,
  #view-home .consumer-topbar *,
  #view-home .home-topbar *,
  #view-home .city-bar *,
  #view-home .hero-header *,
  #view-home .header-compact * {
    color: var(--dj-v9-text) !important;
  }

  #view-home .consumer-header .muted,
  #view-home .app-header .muted,
  #view-home .city-bar .muted,
  #view-home .hero-header .muted {
    color: var(--dj-v9-text-2) !important;
  }

  #view-home .search-box,
  #view-home .search-input-wrap,
  #view-home .search-field {
    background: #ffffff !important;
    border: 1px solid var(--dj-v9-border) !important;
    box-shadow: none !important;
  }

  #view-home .search-box *,
  #view-home .search-input-wrap *,
  #view-home .search-field * {
    color: var(--dj-v9-text) !important;
  }

  #view-home .search-box svg,
  #view-home .search-input-wrap svg,
  #view-home .search-field svg,
  #view-home .search-box i,
  #view-home .search-input-wrap i,
  #view-home .search-field i {
    color: var(--dj-v9-primary) !important;
    fill: currentColor !important;
  }
}

/* ------------------------------------------------------------
   2. ENDEREÇO / BLOCO DE ENTREGA / BOTÃO TROCAR
   ------------------------------------------------------------ */
#view-checkout .checkout-selected-address,
#view-checkout .checkout-address-row,
#view-checkout .delivery-address-card,
#view-checkout .selected-address-card,
#view-checkout .checkout-address-inline {
  background: #ffffff !important;
  color: var(--dj-v9-text) !important;
  border: 1px solid var(--dj-v9-border) !important;
  box-shadow: none !important;
}

#view-checkout .checkout-selected-address *,
#view-checkout .checkout-address-row *,
#view-checkout .delivery-address-card *,
#view-checkout .selected-address-card *,
#view-checkout .checkout-address-inline * {
  color: inherit !important;
}

#view-checkout .checkout-selected-address small,
#view-checkout .checkout-address-row small,
#view-checkout .delivery-address-card small,
#view-checkout .selected-address-card small,
#view-checkout .checkout-address-inline small {
  color: var(--dj-v9-text-2) !important;
}

#view-checkout .checkout-selected-address svg,
#view-checkout .checkout-address-row svg,
#view-checkout .delivery-address-card svg,
#view-checkout .selected-address-card svg,
#view-checkout .checkout-address-inline svg,
#view-checkout .checkout-selected-address i,
#view-checkout .checkout-address-row i,
#view-checkout .delivery-address-card i,
#view-checkout .selected-address-card i,
#view-checkout .checkout-address-inline i {
  color: var(--dj-v9-primary) !important;
  fill: currentColor !important;
}

/* Botões "Trocar" sem fundo escuro/roxo */
#view-checkout .change-address-button,
#view-checkout .change-payment-button,
#view-checkout .payment-choice-row .change-payment,
#view-checkout .checkout-address-row .change-address,
#view-checkout .checkout-selected-address .change-address,
#view-checkout button.trocar,
#view-checkout .btn-change,
#view-checkout .action-change {
  background: #ffffff !important;
  color: var(--dj-v9-primary) !important;
  border: 1px solid var(--dj-v9-border) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
}

#view-checkout .change-address-button:hover,
#view-checkout .change-payment-button:hover,
#view-checkout .payment-choice-row .change-payment:hover,
#view-checkout .checkout-address-row .change-address:hover,
#view-checkout .checkout-selected-address .change-address:hover,
#view-checkout button.trocar:hover,
#view-checkout .btn-change:hover,
#view-checkout .action-change:hover {
  background: var(--dj-v9-primary-soft) !important;
  color: var(--dj-v9-primary-strong) !important;
  border-color: #d59aaa !important;
}

/* ------------------------------------------------------------
   3. PAGAMENTO / OBSERVAÇÕES / CUPOM
   ------------------------------------------------------------ */
#view-checkout .payment-choice-row,
#view-checkout .payment-choice-row > button,
#view-checkout #payment-method-button,
#view-checkout .consumer-notes-field,
#view-checkout .coupon-compact {
  background: #ffffff !important;
  color: var(--dj-v9-text) !important;
  border-color: var(--dj-v9-border) !important;
  box-shadow: none !important;
}

#view-checkout .payment-choice-row *,
#view-checkout .consumer-notes-field *,
#view-checkout .coupon-compact * {
  color: inherit !important;
}

#view-checkout .payment-choice-row svg,
#view-checkout .payment-choice-row i,
#view-checkout .consumer-notes-field svg,
#view-checkout .consumer-notes-field i {
  color: var(--dj-v9-primary) !important;
  fill: currentColor !important;
}

#view-checkout .consumer-notes-field textarea,
#view-checkout .coupon-compact input {
  color: var(--dj-v9-text) !important;
  background: #ffffff !important;
}

#view-checkout .consumer-notes-field textarea::placeholder,
#view-checkout .coupon-compact input::placeholder {
  color: var(--dj-v9-text-2) !important;
  opacity: 1 !important;
}

/* ------------------------------------------------------------
   4. STATUS DOS PEDIDOS / ACOMPANHAMENTO
   ------------------------------------------------------------ */
#view-orders .status-chip,
#view-orders .order-status,
#view-orders .dj-order-status,
#view-order-details .status-chip,
#view-order-details .order-status,
#view-order-details .dj-order-status,
#view-order-success .status-chip,
#view-order-success .order-status,
#view-order-success .dj-order-status {
  background: var(--dj-v9-primary-soft) !important;
  color: var(--dj-v9-primary) !important;
  border: 1px solid #d59aaa !important;
  box-shadow: none !important;
}

#view-orders .status-chip.delivered,
#view-orders .order-status.delivered,
#view-orders .dj-order-status.is-delivered,
#view-order-details .status-chip.delivered,
#view-order-details .order-status.delivered,
#view-order-details .dj-order-status.is-delivered,
#view-order-success .status-chip.delivered,
#view-order-success .order-status.delivered,
#view-order-success .dj-order-status.is-delivered {
  background: var(--dj-v9-success-soft) !important;
  color: var(--dj-v9-success) !important;
  border-color: #b8dfc8 !important;
}

#view-order-details .tracking-stage,
#view-order-success .tracking-stage {
  color: var(--dj-v9-text) !important;
}

#view-order-details .tracking-stage *,
#view-order-success .tracking-stage * {
  color: inherit;
}

#view-order-details .tracking-stage small,
#view-order-success .tracking-stage small {
  color: var(--dj-v9-text-2) !important;
}

/* remove laranja dos ícones da timeline */
#view-order-details .tracking-icon,
#view-order-success .tracking-icon,
#view-order-details .tracking-stage.done .tracking-icon,
#view-order-success .tracking-stage.done .tracking-icon {
  background: var(--dj-v9-success-soft) !important;
  color: var(--dj-v9-success) !important;
  border: 1px solid #b8dfc8 !important;
}

#view-order-details .tracking-stage.current .tracking-icon,
#view-order-success .tracking-stage.current .tracking-icon {
  background: var(--dj-v9-primary-soft) !important;
  color: var(--dj-v9-primary) !important;
  border-color: #d59aaa !important;
}

#view-order-details .tracking-stage:not(:last-child)::after,
#view-order-success .tracking-stage:not(:last-child)::after {
  background: #d9d4d6 !important;
}

#view-order-details .tracking-stage.done:not(:last-child)::after,
#view-order-success .tracking-stage.done:not(:last-child)::after {
  background: #cfe6d8 !important;
}

/* card de status atual sem preto */
#view-order-details .tracking-current-status,
#view-order-success .tracking-current-status,
#view-order-details .current-status-card,
#view-order-success .current-status-card {
  background: var(--dj-v9-primary-soft) !important;
  color: var(--dj-v9-primary) !important;
  border: 1px solid #d59aaa !important;
  box-shadow: none !important;
}

#view-order-details .tracking-current-status *,
#view-order-success .tracking-current-status *,
#view-order-details .current-status-card *,
#view-order-success .current-status-card * {
  color: inherit !important;
}

/* ------------------------------------------------------------
   5. Loja / card do restaurante / resíduos verdes ou cinzas
   ------------------------------------------------------------ */
#view-home .restaurant-card,
#view-home .consumer-restaurant-card,
#view-home [data-restaurant-id],
#view-restaurant .consumer-store-summary,
#view-restaurant .store-detail-card {
  background: #ffffff !important;
  border: 1px solid var(--dj-v9-border) !important;
  box-shadow: 0 8px 24px rgba(49, 27, 36, 0.06) !important;
}

#view-home .restaurant-card *,
#view-home .consumer-restaurant-card *,
#view-home [data-restaurant-id] *,
#view-restaurant .consumer-store-summary *,
#view-restaurant .store-detail-card * {
  color: inherit;
}

#view-home .restaurant-card h3,
#view-home .consumer-restaurant-card h3,
#view-home [data-restaurant-id] h3,
#view-restaurant .consumer-store-summary h1,
#view-restaurant .store-detail-card h1 {
  color: var(--dj-v9-text) !important;
}

#view-home .restaurant-card p,
#view-home .consumer-restaurant-card p,
#view-home [data-restaurant-id] p,
#view-restaurant .consumer-store-summary p,
#view-restaurant .store-detail-card p {
  color: var(--dj-v9-text-2) !important;
}

#view-home .restaurant-card .store-photo,
#view-home .consumer-restaurant-card .store-photo,
#view-home [data-restaurant-id] .store-photo,
#view-home .restaurant-card .restaurant-thumb,
#view-home .consumer-restaurant-card .restaurant-thumb,
#view-home [data-restaurant-id] .restaurant-thumb,
#view-restaurant .consumer-store-summary .store-photo,
#view-restaurant .store-detail-card .store-photo,
#view-restaurant .consumer-store-summary .restaurant-thumb,
#view-restaurant .store-detail-card .restaurant-thumb {
  background: var(--dj-v9-surface-soft) !important;
  border: 1px solid var(--dj-v9-border) !important;
}

#view-home .restaurant-card .store-photo *,
#view-home .consumer-restaurant-card .store-photo *,
#view-home [data-restaurant-id] .store-photo *,
#view-home .restaurant-card .restaurant-thumb *,
#view-home .consumer-restaurant-card .restaurant-thumb *,
#view-home [data-restaurant-id] .restaurant-thumb *,
#view-restaurant .consumer-store-summary .store-photo *,
#view-restaurant .store-detail-card .store-photo *,
#view-restaurant .consumer-store-summary .restaurant-thumb *,
#view-restaurant .store-detail-card .restaurant-thumb * {
  background: transparent !important;
}

/* Vencer ícones laranja do card */
#view-home .restaurant-card svg,
#view-home .consumer-restaurant-card svg,
#view-home [data-restaurant-id] svg,
#view-restaurant .consumer-store-summary svg,
#view-restaurant .store-detail-card svg,
#view-home .restaurant-card i,
#view-home .consumer-restaurant-card i,
#view-home [data-restaurant-id] i,
#view-restaurant .consumer-store-summary i,
#view-restaurant .store-detail-card i {
  color: var(--dj-v9-primary) !important;
  fill: currentColor !important;
}

/* ------------------------------------------------------------
   6. Fallback agressivo somente no mobile para texto branco/laranja residual
   ------------------------------------------------------------ */
@media (max-width: 768px) {
  #view-home [style*="color: white"],
  #view-home [style*="color:#fff"],
  #view-home [style*="color: #fff"],
  #view-checkout [style*="color: white"],
  #view-checkout [style*="color:#fff"],
  #view-checkout [style*="color: #fff"],
  #view-order-details [style*="color: white"],
  #view-order-details [style*="color:#fff"],
  #view-order-success [style*="color: white"],
  #view-order-success [style*="color:#fff"] {
    color: var(--dj-v9-text) !important;
  }
}

/* VISUAL MOBILE RESIDUAL V9 END */

/* CHECKOUT EXACT SELECTORS V10 START */

/*
 * Regra de arquitetura:
 * - carvão = títulos/conteúdo principal
 * - cinza = informação secundária
 * - vinho = ações, seleção e total
 * - branco/rosa muito suave = superfícies
 * - sem preto, roxo ou laranja no checkout
 */

#view-checkout {
  --checkout-v10-text: var(--dj-text, #251f20);
  --checkout-v10-muted: var(--dj-text-secondary, #6f6467);
  --checkout-v10-muted-light: var(--dj-text-muted, #94898b);
  --checkout-v10-red: var(--dj-primary, #8e1f2b);
  --checkout-v10-red-strong: var(--dj-primary-strong, #761823);
  --checkout-v10-red-soft: var(--dj-primary-soft, #f8edef);
  --checkout-v10-red-softer: var(--dj-primary-softer, #fff7f8);
  --checkout-v10-border: var(--dj-border, #ead7dc);
  --checkout-v10-surface: var(--dj-surface, #ffffff);
}

/* ============================================================
   ENDEREÇO SELECIONADO
   ============================================================ */

#view-checkout .checkout-address-row {
  position: relative !important;
  background: var(--checkout-v10-surface) !important;
  background-image: none !important;
  color: var(--checkout-v10-text) !important;
  border: 1px solid var(--checkout-v10-border) !important;
  border-radius: 20px !important;
  box-shadow: 0 8px 22px rgba(70, 36, 45, .06) !important;
}

#view-checkout .checkout-address-row::before {
  color: var(--checkout-v10-red) !important;
  filter: none !important;
}

#view-checkout .checkout-address-row > div {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .checkout-address-row strong,
#view-checkout #checkout-address-preview {
  color: var(--checkout-v10-text) !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

#view-checkout .checkout-address-row span,
#view-checkout #checkout-time-preview {
  color: var(--checkout-v10-muted) !important;
  opacity: 1 !important;
}

/* Selector exato solicitado: botão Trocar do endereço */
#view-checkout #checkout-change-address {
  min-height: 42px !important;
  padding: 9px 16px !important;
  color: var(--checkout-v10-red) !important;
  background: var(--checkout-v10-surface) !important;
  background-image: none !important;
  border: 1px solid var(--checkout-v10-red) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

#view-checkout #checkout-change-address:hover,
#view-checkout #checkout-change-address:focus-visible {
  color: var(--checkout-v10-red-strong) !important;
  background: var(--checkout-v10-red-soft) !important;
  border-color: var(--checkout-v10-red-strong) !important;
}

/* ============================================================
   LISTA / CADASTRO DE ENDEREÇOS
   Corrige regras antigas que forçavam branco.
   ============================================================ */

#view-checkout .checkout-hidden-fields {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border-color: var(--checkout-v10-border) !important;
  box-shadow: none !important;
}

#view-checkout .checkout-address-picker-heading strong,
#view-checkout .checkout-manual-address label,
#view-checkout .checkout-save-address-row {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .checkout-address-picker-heading small,
#view-checkout .checkout-address-card-copy small,
#view-checkout .checkout-address-empty small {
  color: var(--checkout-v10-muted) !important;
}

#view-checkout .checkout-address-card {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  background-image: none !important;
  border-color: var(--checkout-v10-border) !important;
  box-shadow: none !important;
}

#view-checkout .checkout-address-card:hover {
  background: var(--checkout-v10-red-softer) !important;
  border-color: var(--checkout-v10-red) !important;
}

#view-checkout .checkout-address-card.selected,
#view-checkout .checkout-address-card[aria-checked="true"] {
  background: var(--checkout-v10-red-soft) !important;
  border-color: var(--checkout-v10-red) !important;
}

#view-checkout .checkout-address-card-copy strong,
#view-checkout .checkout-address-card-copy b {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .checkout-address-card-copy em {
  color: var(--checkout-v10-red) !important;
  background: var(--checkout-v10-red-soft) !important;
}

#view-checkout .checkout-address-card.selected .checkout-address-radio,
#view-checkout .checkout-address-card[aria-checked="true"] .checkout-address-radio {
  background: var(--checkout-v10-red) !important;
  border-color: var(--checkout-v10-red) !important;
  box-shadow: inset 0 0 0 4px #ffffff !important;
}

#view-checkout .checkout-address-empty {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-red-softer) !important;
  border-color: var(--checkout-v10-border) !important;
}

#view-checkout .checkout-address-empty > span {
  color: var(--checkout-v10-red) !important;
}

#view-checkout .checkout-address-empty strong {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .checkout-new-address-button {
  color: var(--checkout-v10-red) !important;
  background: var(--checkout-v10-surface) !important;
  border-color: var(--checkout-v10-red) !important;
}

#view-checkout .checkout-new-address-button:hover {
  color: var(--checkout-v10-red-strong) !important;
  background: var(--checkout-v10-red-soft) !important;
}

/* ============================================================
   RESUMO DE VALORES
   ============================================================ */

#view-checkout .consumer-checkout-summary {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border: 1px solid var(--checkout-v10-border) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

#view-checkout .consumer-checkout-summary h2 {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .consumer-checkout-summary .summary-row {
  color: var(--checkout-v10-muted) !important;
}

#view-checkout .consumer-checkout-summary .summary-row span {
  color: var(--checkout-v10-muted) !important;
}

#view-checkout .consumer-checkout-summary .summary-row strong {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .consumer-checkout-summary .summary-row.total,
#view-checkout .consumer-checkout-summary .summary-row.total span {
  color: var(--checkout-v10-muted) !important;
}

#view-checkout .consumer-checkout-summary .summary-row.total strong {
  color: var(--checkout-v10-red) !important;
}

/* ============================================================
   PAGAMENTO
   Usa os IDs reais do template.
   ============================================================ */

#view-checkout .payment-choice-row {
  position: relative !important;
  overflow: hidden !important;
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  background-image: none !important;
  border: 1px solid var(--checkout-v10-border) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

/* O botão inteiro NÃO deve ficar vermelho/escuro. */
#view-checkout #payment-method-button {
  width: 100% !important;
  min-height: 66px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  padding: 16px 18px 16px 54px !important;
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 17px !important;
  text-align: left !important;
}

/* Ícone que o app.css cria via ::before. */
#view-checkout #payment-method-button::before {
  color: var(--checkout-v10-red) !important;
  background: transparent !important;
  border-color: var(--checkout-v10-red) !important;
  text-shadow: none !important;
  filter: none !important;
}

/* Selector exato solicitado: texto da forma de pagamento. */
#view-checkout #payment-method-label {
  color: var(--checkout-v10-text) !important;
  background: transparent !important;
  font-weight: 800 !important;
  opacity: 1 !important;
}

/* "Trocar" é texto de ação, não card preto. */
#view-checkout #payment-method-button > strong {
  min-height: 38px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 7px 13px !important;
  color: var(--checkout-v10-red) !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid var(--checkout-v10-red) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  font-weight: 800 !important;
}

#view-checkout #payment-method-button:hover {
  background: var(--checkout-v10-red-softer) !important;
}

#view-checkout #payment-method-button:hover > strong,
#view-checkout #payment-method-button:focus-visible > strong {
  color: var(--checkout-v10-red-strong) !important;
  background: var(--checkout-v10-red-soft) !important;
  border-color: var(--checkout-v10-red-strong) !important;
}

/* Select nativo: preserva funcionamento, muda apenas aparência. */
#view-checkout #payment-method-select {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
}

#view-checkout #payment-method-select.select-visible {
  width: 100% !important;
  height: auto !important;
  padding: 12px 16px !important;
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border: 0 !important;
  border-top: 1px solid var(--checkout-v10-border) !important;
  box-shadow: none !important;
}

#view-checkout #payment-method-select option {
  color: var(--checkout-v10-text) !important;
  background: #ffffff !important;
}

/* ============================================================
   OBSERVAÇÕES / CUPOM
   ============================================================ */

#view-checkout .consumer-notes-field {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border: 1px solid var(--checkout-v10-border) !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

#view-checkout .consumer-notes-field > span {
  color: var(--checkout-v10-text) !important;
  font-weight: 800 !important;
}

#view-checkout .consumer-notes-field textarea {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border-top-color: var(--checkout-v10-border) !important;
}

#view-checkout .consumer-notes-field textarea::placeholder {
  color: var(--checkout-v10-muted) !important;
  opacity: 1 !important;
}

#view-checkout .coupon-compact {
  color: var(--checkout-v10-text) !important;
}

#view-checkout .coupon-compact input {
  color: var(--checkout-v10-text) !important;
  background: var(--checkout-v10-surface) !important;
  border-color: var(--checkout-v10-border) !important;
}

#view-checkout .coupon-compact input::placeholder {
  color: var(--checkout-v10-muted) !important;
  opacity: 1 !important;
}

#view-checkout .checkout-back-items {
  color: var(--checkout-v10-muted) !important;
}

#view-checkout .checkout-back-items:hover {
  color: var(--checkout-v10-red) !important;
}

/* ============================================================
   MOBILE
   ============================================================ */

@media (max-width: 640px) {
  #view-checkout .checkout-address-row {
    padding: 14px 12px 14px 52px !important;
    gap: 10px !important;
  }

  #view-checkout #checkout-change-address {
    padding-inline: 11px !important;
  }

  #view-checkout #payment-method-button {
    padding-left: 52px !important;
  }

  #view-checkout #payment-method-button::before {
    left: 16px !important;
  }
}

/* CHECKOUT EXACT SELECTORS V10 END */

/* CONTEXTO VISUAL V11 START */

:root {
  --dj-context-text: var(--dj-text, #251f20);
  --dj-context-muted: var(--dj-text-secondary, #6f6467);
  --dj-context-muted-light: var(--dj-text-muted, #94898b);
  --dj-context-red: var(--dj-primary, #8e1f2b);
  --dj-context-red-strong: var(--dj-primary-strong, #761823);
  --dj-context-red-soft: var(--dj-primary-soft, #f8edef);
  --dj-context-red-softer: var(--dj-primary-softer, #fff7f8);
  --dj-context-border: var(--dj-border, #ead7dc);
  --dj-context-surface: var(--dj-surface, #ffffff);
  --dj-context-success: var(--dj-success, #1f9d61);
  --dj-context-success-soft: var(--dj-success-soft, #eaf8f0);
}

/* ============================================================
   CHECKOUT — TEXTO POR CONTEXTO
   Não aplicar cor genérica em div/span.
   ============================================================ */

#view-checkout p,
#view-checkout small,
#view-checkout .muted,
#view-checkout .helper-text,
#view-checkout .caption,
#view-checkout .option-subtitle {
  color: var(--dj-context-muted) !important;
}

/* Spans que são explicitamente informação secundária. */
#view-checkout .summary-row > span,
#view-checkout #checkout-time-preview,
#view-checkout .checkout-address-card-copy small,
#view-checkout .checkout-address-picker-heading small {
  color: var(--dj-context-muted) !important;
}

/* Cabeçalhos e conteúdo primário. */
#view-checkout h1,
#view-checkout h2,
#view-checkout h3,
#view-checkout h4,
#view-checkout label,
#view-checkout strong,
#view-checkout b,
#view-checkout #checkout-address-preview,
#view-checkout #payment-method-label {
  color: var(--dj-context-text) !important;
}

/* ============================================================
   BOTÃO ENVIAR PEDIDO
   O ➤ deve permanecer branco.
   ============================================================ */

#view-checkout .consumer-sticky-action,
#view-checkout .consumer-sticky-action *,
#view-checkout .consumer-sticky-action span,
#view-checkout button[type="submit"],
#view-checkout button[type="submit"] * {
  color: #ffffff !important;
}

#view-checkout .consumer-sticky-action {
  background: var(--dj-context-red) !important;
  background-image: none !important;
  border-color: var(--dj-context-red) !important;
  box-shadow: none !important;
}

#view-checkout .consumer-sticky-action:hover,
#view-checkout .consumer-sticky-action:focus-visible {
  background: var(--dj-context-red-strong) !important;
  border-color: var(--dj-context-red-strong) !important;
}

/* ============================================================
   ENDEREÇO — seletores reais
   ============================================================ */

#view-checkout .checkout-address-row {
  background: var(--dj-context-surface) !important;
  background-image: none !important;
  border-color: var(--dj-context-border) !important;
  color: var(--dj-context-text) !important;
}

#view-checkout .checkout-address-row::before {
  color: var(--dj-context-red) !important;
}

#view-checkout #checkout-address-preview {
  color: var(--dj-context-text) !important;
}

#view-checkout #checkout-time-preview {
  color: var(--dj-context-muted) !important;
}

#view-checkout #checkout-change-address {
  color: var(--dj-context-red) !important;
  background: var(--dj-context-surface) !important;
  background-image: none !important;
  border: 1px solid var(--dj-context-red) !important;
  box-shadow: none !important;
}

#view-checkout #checkout-change-address:hover,
#view-checkout #checkout-change-address:focus-visible {
  color: var(--dj-context-red-strong) !important;
  background: var(--dj-context-red-soft) !important;
  border-color: var(--dj-context-red-strong) !important;
}

/* ============================================================
   PAGAMENTO — seletores reais
   ============================================================ */

#view-checkout .payment-choice-row {
  color: var(--dj-context-text) !important;
  background: var(--dj-context-surface) !important;
  background-image: none !important;
  border-color: var(--dj-context-border) !important;
}

#view-checkout #payment-method-button {
  color: var(--dj-context-text) !important;
  background: var(--dj-context-surface) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

#view-checkout #payment-method-label {
  color: var(--dj-context-text) !important;
}

#view-checkout #payment-method-button::before {
  color: var(--dj-context-red) !important;
  background: transparent !important;
  border-color: var(--dj-context-red) !important;
}

#view-checkout #payment-method-button > strong {
  color: var(--dj-context-red) !important;
  background: var(--dj-context-surface) !important;
  background-image: none !important;
  border: 1px solid var(--dj-context-red) !important;
  box-shadow: none !important;
}

#view-checkout #payment-method-button > strong:hover {
  color: var(--dj-context-red-strong) !important;
  background: var(--dj-context-red-soft) !important;
}

/* ============================================================
   REMOVE O CARD "ATUALIZAÇÃO EM TEMPO REAL"
   A conexão realtime continua funcionando; apenas o card é
   retirado da interface do histórico de pedidos.
   ============================================================ */

#view-orders .realtime-notice {
  display: none !important;
}

/* ============================================================
   HISTÓRICO DE PEDIDOS
   Remove fundos pretos dos cards e dos status.
   ============================================================ */

#view-orders .customer-orders-list,
#view-orders .order-card {
  background: transparent !important;
  background-image: none !important;
}

#view-orders .order-card {
  color: var(--dj-context-text) !important;
  background: var(--dj-context-surface) !important;
  border: 1px solid var(--dj-context-border) !important;
  box-shadow: 0 8px 22px rgba(70, 36, 45, .06) !important;
}

#view-orders .order-card h3 {
  color: var(--dj-context-text) !important;
}

#view-orders .order-card p,
#view-orders .order-card small {
  color: var(--dj-context-muted) !important;
}

#view-orders .order-value > strong {
  color: var(--dj-context-red) !important;
}

/* Status padrão, inclusive Recebido: rosa claro + vinho. */
#view-orders .order-card .status {
  color: var(--dj-context-red) !important;
  background: var(--dj-context-red-soft) !important;
  background-image: none !important;
  border: 1px solid #dfb3bd !important;
  box-shadow: none !important;
}

/* Em trânsito/retirada: mesma família visual, sem preto/laranja. */
#view-orders .order-card .status.shipping {
  color: var(--dj-context-red-strong) !important;
  background: var(--dj-context-red-softer) !important;
  border-color: #d79ba8 !important;
}

/* Entregue pode continuar verde por significado semântico. */
#view-orders .order-card .status.delivered {
  color: #17683b !important;
  background: #e9f6ee !important;
  border-color: #b9dfc9 !important;
}

/* Cancelado: vermelho suave, sem fundo preto. */
#view-orders .order-card .status.cancelled {
  color: #a11d32 !important;
  background: #fae9ed !important;
  border-color: #e6b7c1 !important;
}

/* ============================================================
   ACOMPANHAMENTO DO PEDIDO
   Remove o card preto do "Status atual".
   ============================================================ */

#view-order-success .tracking-current-status,
#view-order-details .tracking-current-status,
.tracking-current-status {
  color: var(--dj-context-red) !important;
  background: var(--dj-context-red-soft) !important;
  background-image: none !important;
  border: 1px solid #dfb3bd !important;
  box-shadow: none !important;
}

#view-order-success .tracking-current-status *,
#view-order-details .tracking-current-status *,
.tracking-current-status * {
  color: var(--dj-context-red) !important;
}

/* Etapa atual: vinho, sem laranja. */
#view-order-success .tracking-stage.current .tracking-marker,
#view-order-details .tracking-stage.current .tracking-marker,
.tracking-stage.current .tracking-marker {
  color: #ffffff !important;
  background: var(--dj-context-red) !important;
  border-color: var(--dj-context-red) !important;
  box-shadow: 0 0 0 5px rgba(142,31,43,.10) !important;
}

#view-order-success .tracking-stage.current strong,
#view-order-details .tracking-stage.current strong,
.tracking-stage.current strong {
  color: var(--dj-context-red) !important;
}

/* CONTEXTO VISUAL V11 END */

/* VISUAL RESIDUAL V12 START */

:root {
  --dj-v12-red: var(--dj-primary, #8e1f2b);
  --dj-v12-red-strong: var(--dj-primary-strong, #761823);
  --dj-v12-red-soft: var(--dj-primary-soft, #f8edef);
  --dj-v12-surface: var(--dj-surface, #ffffff);
  --dj-v12-border: var(--dj-border, #ead7dc);
  --dj-v12-text: var(--dj-text, #241f20);
  --dj-v12-muted: var(--dj-text-secondary, #6f6467);
  --dj-v12-green: #17683b;
  --dj-v12-green-soft: #e9f6ee;
  --dj-v12-green-border: #b9dfc9;
}

/* 1) ADD MORE ITEMS */
#view-cart .add-more-items,
.add-more-items {
  color: #ffffff !important;
  background: var(--dj-v12-red) !important;
  background-image: none !important;
  border: 1px solid var(--dj-v12-red) !important;
  box-shadow: none !important;
}

#view-cart .add-more-items:hover,
#view-cart .add-more-items:focus-visible,
.add-more-items:hover,
.add-more-items:focus-visible {
  color: #ffffff !important;
  background: var(--dj-v12-red-strong) !important;
  background-image: none !important;
  border-color: var(--dj-v12-red-strong) !important;
  box-shadow: none !important;
}

/* 2) PAYMENT METHOD BUTTON */
#view-checkout #payment-method-button::before,
#payment-method-button::before {
  content: '💵' !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  margin-right: 10px !important;
  color: var(--dj-v12-red) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

#view-checkout #payment-method-button,
#payment-method-button {
  color: var(--dj-v12-text) !important;
  background: var(--dj-v12-surface) !important;
  background-image: none !important;
  box-shadow: none !important;
}

#view-checkout #payment-method-button:hover,
#view-checkout #payment-method-button:focus-visible,
#payment-method-button:hover,
#payment-method-button:focus-visible {
  background: #fff7f8 !important;
  background-image: none !important;
}

#view-checkout #payment-method-button > strong,
#payment-method-button > strong {
  color: var(--dj-v12-red) !important;
  background: var(--dj-v12-surface) !important;
  background-image: none !important;
  border: 1px solid var(--dj-v12-red) !important;
  box-shadow: none !important;
}

#view-checkout #payment-method-button > strong:hover,
#payment-method-button > strong:hover {
  color: #ffffff !important;
  background: var(--dj-v12-red) !important;
  border-color: var(--dj-v12-red) !important;
}

/* 3) CART COUNT */
#cart-count,
.cart-count,
button#header-cart .cart-count,
button[data-route="cart"] .cart-count {
  color: #ffffff !important;
  -webkit-text-fill-color: #ffffff !important;
}

/* 4) BADGES / STATUS / CARDS escuros residuais */
#view-profile .saved-address-card,
#view-profile .customer-address-card,
#view-profile .saved-address-card-header,
#view-profile .saved-addresses-grid article,
#view-orders .order-card,
#view-order-success .success-card,
#view-order-success .tracking-current-status,
#view-order-details .tracking-current-status,
.status,
.badge,
.tracking-current-status {
  background-image: none !important;
}

#view-orders .order-card .status,
#view-order-success .tracking-current-status,
#view-order-details .tracking-current-status,
.status.delivery-status-pending,
.status.received,
.status.accepted,
.status.preparing,
.status.shipping,
.badge.received,
.badge.accepted,
.badge.preparing,
.badge.shipping,
.tracking-current-status {
  color: var(--dj-v12-red) !important;
  background: var(--dj-v12-red-soft) !important;
  border: 1px solid #dfb3bd !important;
  box-shadow: none !important;
}

#view-orders .order-card .status.delivered,
#view-profile .saved-address-card .status.delivered,
#view-profile .saved-address-card .status.principal,
#view-profile .saved-address-card .status.primary,
.status.delivered,
.status.completed,
.status.primary,
.status.principal,
.badge.delivered,
.badge.primary,
.badge.principal {
  color: var(--dj-v12-green) !important;
  background: var(--dj-v12-green-soft) !important;
  border: 1px solid var(--dj-v12-green-border) !important;
  box-shadow: none !important;
}

.status.cancelled,
.badge.cancelled {
  color: #a11d32 !important;
  background: #fae9ed !important;
  border: 1px solid #e6b7c1 !important;
  box-shadow: none !important;
}

#view-profile .saved-address-card,
#view-profile .customer-address-card,
#view-profile .saved-addresses-grid article {
  color: var(--dj-v12-text) !important;
  background: var(--dj-v12-surface) !important;
  border-color: var(--dj-v12-border) !important;
  box-shadow: 0 8px 20px rgba(70, 36, 45, .05) !important;
}

#view-profile .saved-address-card p,
#view-profile .saved-address-card small,
#view-profile .customer-address-card p,
#view-profile .customer-address-card small {
  color: var(--dj-v12-muted) !important;
}

#view-orders .order-card:hover,
#view-profile .saved-address-card:hover,
#view-profile .customer-address-card:hover {
  border-color: #dfb3bd !important;
  box-shadow: 0 10px 24px rgba(142, 31, 43, .08) !important;
}

/* VISUAL RESIDUAL V12 END */

/* FUNDO IMAGEM RESTAURANTE V13 START */

:root {
  --dj-v13-card-image-bg: #f1f2f4;
  --dj-v13-card-image-border: #dde2e7;
}

/* Home / lista de estabelecimentos */
#view-home .consumer-restaurant-image,
#view-home .restaurant-card .consumer-restaurant-image,
#view-home [data-route="restaurant"] .consumer-restaurant-image,
#home-open-panel .consumer-restaurant-image,
#home-segment-panel .consumer-restaurant-image {
  background: var(--dj-v13-card-image-bg) !important;
  background-image: none !important;
  border-color: var(--dj-v13-card-image-border) !important;
  box-shadow: none !important;
}

#view-home .consumer-restaurant-image::before,
#view-home .consumer-restaurant-image::after,
#view-home .restaurant-card .consumer-restaurant-image::before,
#view-home .restaurant-card .consumer-restaurant-image::after,
#home-open-panel .consumer-restaurant-image::before,
#home-open-panel .consumer-restaurant-image::after,
#home-segment-panel .consumer-restaurant-image::before,
#home-segment-panel .consumer-restaurant-image::after {
  background: var(--dj-v13-card-image-bg) !important;
  background-image: none !important;
  border-color: var(--dj-v13-card-image-border) !important;
  box-shadow: none !important;
}

/* Se o estado aberto estiver aplicando a cor verde no mesmo contêiner */
#view-home .consumer-restaurant-image.dj-status-open,
#view-home .dj-status-open .consumer-restaurant-image,
#home-open-panel .consumer-restaurant-image.dj-status-open,
#home-segment-panel .consumer-restaurant-image.dj-status-open,
#view-home .restaurant-card .dj-status-open,
#home-open-panel .restaurant-card .dj-status-open,
#home-segment-panel .restaurant-card .dj-status-open {
  background: var(--dj-v13-card-image-bg) !important;
  background-image: none !important;
  border-color: var(--dj-v13-card-image-border) !important;
}

/* Garantir que apenas o fundo da imagem mude; a foto permanece normal */
#view-home .consumer-restaurant-image img,
#home-open-panel .consumer-restaurant-image img,
#home-segment-panel .consumer-restaurant-image img {
  background: transparent !important;
}

/* VISÃO MOBILE */
@media (max-width: 768px) {
  #view-home .consumer-restaurant-image,
  #view-home .restaurant-card .consumer-restaurant-image,
  #home-open-panel .consumer-restaurant-image,
  #home-segment-panel .consumer-restaurant-image {
    background: var(--dj-v13-card-image-bg) !important;
    background-image: none !important;
    border-color: var(--dj-v13-card-image-border) !important;
  }

  #view-home .consumer-restaurant-image::before,
  #view-home .consumer-restaurant-image::after,
  #home-open-panel .consumer-restaurant-image::before,
  #home-open-panel .consumer-restaurant-image::after,
  #home-segment-panel .consumer-restaurant-image::before,
  #home-segment-panel .consumer-restaurant-image::after {
    background: var(--dj-v13-card-image-bg) !important;
    background-image: none !important;
  }
}

/* FUNDO IMAGEM RESTAURANTE V13 END */

/* OWNER VISUAL V14 START */

:root {
  --dj-owner-surface: var(--dj-surface, #ffffff);
  --dj-owner-surface-soft: var(--dj-surface-soft, #fbf8f7);
  --dj-owner-surface-muted: var(--dj-surface-muted, #f4efed);
  --dj-owner-text: var(--dj-text, #251f20);
  --dj-owner-muted: var(--dj-text-secondary, #6f6467);
  --dj-owner-muted-light: var(--dj-text-muted, #94898b);
  --dj-owner-red: var(--dj-primary, #8e1f2b);
  --dj-owner-red-strong: var(--dj-primary-strong, #761823);
  --dj-owner-red-soft: var(--dj-primary-soft, #f8edef);
  --dj-owner-red-softer: var(--dj-primary-softer, #fff7f8);
  --dj-owner-border: var(--dj-border, #ead7dc);
  --dj-owner-success: #17683b;
  --dj-owner-success-soft: #e9f6ee;
  --dj-owner-success-border: #b9dfc9;
}

/* ============================================================
   1. MODAL SOLICITAR ENTREGADOR
   ============================================================ */

#dispatch-dialog .dialog-card {
  color: var(--dj-owner-text) !important;
  background: var(--dj-owner-surface) !important;
  background-image: none !important;
  border: 1px solid var(--dj-owner-border) !important;
  box-shadow: 0 24px 64px rgba(45, 25, 32, .18) !important;
}

#dispatch-dialog .dialog-heading {
  color: var(--dj-owner-text) !important;
  border-bottom-color: var(--dj-owner-border) !important;
}

#dispatch-dialog .dialog-heading .eyebrow {
  color: var(--dj-owner-red) !important;
}

#dispatch-dialog .dialog-heading h2 {
  color: var(--dj-owner-text) !important;
}

/* Fechar: sem laranja */
#dispatch-dialog .dialog-close {
  color: var(--dj-owner-red) !important;
  background: var(--dj-owner-red-soft) !important;
  border: 1px solid var(--dj-owner-border) !important;
  box-shadow: none !important;
}

#dispatch-dialog .dialog-close:hover,
#dispatch-dialog .dialog-close:focus-visible {
  color: #ffffff !important;
  background: var(--dj-owner-red) !important;
  border-color: var(--dj-owner-red) !important;
}

/* Resumo do pedido: remove card preto/roxo */
#dispatch-dialog .dispatch-order-summary,
#dispatch-dialog #dispatch-order-summary {
  color: var(--dj-owner-text) !important;
  background: var(--dj-owner-red-softer) !important;
  background-image: none !important;
  border: 1px solid #e7c5cc !important;
  box-shadow: none !important;
}

#dispatch-dialog .dispatch-order-summary *,
#dispatch-dialog #dispatch-order-summary * {
  color: inherit !important;
}

#dispatch-dialog .dispatch-order-summary strong,
#dispatch-dialog .dispatch-order-summary b,
#dispatch-dialog #dispatch-order-summary strong,
#dispatch-dialog #dispatch-order-summary b {
  color: var(--dj-owner-text) !important;
}

#dispatch-dialog .dispatch-order-summary small,
#dispatch-dialog .dispatch-order-summary span,
#dispatch-dialog .dispatch-order-summary p,
#dispatch-dialog #dispatch-order-summary small,
#dispatch-dialog #dispatch-order-summary span,
#dispatch-dialog #dispatch-order-summary p {
  color: var(--dj-owner-muted) !important;
}

/* Formulário: labels e campos claros */
#dispatch-dialog label {
  color: var(--dj-owner-text) !important;
  font-weight: 700 !important;
}

#dispatch-dialog input,
#dispatch-dialog textarea,
#dispatch-dialog select,
#dispatch-dialog #dispatch-courier-select {
  color: var(--dj-owner-text) !important;
  background: #ffffff !important;
  background-image: none !important;
  border: 1px solid var(--dj-owner-border) !important;
  box-shadow: none !important;
}

#dispatch-dialog input::placeholder,
#dispatch-dialog textarea::placeholder {
  color: var(--dj-owner-muted) !important;
  opacity: 1 !important;
}

#dispatch-dialog select option,
#dispatch-dialog #dispatch-courier-select option {
  color: var(--dj-owner-text) !important;
  background: #ffffff !important;
}

#dispatch-dialog input:focus,
#dispatch-dialog textarea:focus,
#dispatch-dialog select:focus {
  border-color: var(--dj-owner-red) !important;
  box-shadow: 0 0 0 3px rgba(142, 31, 43, .12) !important;
  outline: none !important;
}

/* Aviso: sai do roxo/preto */
#dispatch-dialog .dispatch-info,
#dispatch-dialog #dispatch-courier-info {
  color: var(--dj-owner-muted) !important;
  background: var(--dj-owner-surface-muted) !important;
  background-image: none !important;
  border: 1px solid var(--dj-owner-border) !important;
  box-shadow: none !important;
}

#dispatch-dialog .dispatch-info::before,
#dispatch-dialog #dispatch-courier-info::before {
  color: #ffffff !important;
  background: var(--dj-owner-red) !important;
  border-color: var(--dj-owner-red) !important;
}

#dispatch-dialog .dialog-actions {
  border-top-color: var(--dj-owner-border) !important;
}

#dispatch-dialog .secondary-button {
  color: var(--dj-owner-red) !important;
  background: #ffffff !important;
  border-color: #d9b7be !important;
}

#dispatch-dialog .secondary-button:hover {
  color: var(--dj-owner-red-strong) !important;
  background: var(--dj-owner-red-soft) !important;
  border-color: var(--dj-owner-red) !important;
}

#dispatch-dialog .primary-button {
  color: #ffffff !important;
  background: var(--dj-owner-red) !important;
  border-color: var(--dj-owner-red) !important;
}

#dispatch-dialog .primary-button:hover {
  background: var(--dj-owner-red-strong) !important;
  border-color: var(--dj-owner-red-strong) !important;
}

/* ============================================================
   2. PEDIDOS — STATUS OPERACIONAL
   Em preparo passa a rosa/vinho, não amarelo/verde/azul.
   ============================================================ */

#view-owner .owner-order-card .status,
.owner-panel .owner-order-card .status {
  border-radius: 999px !important;
  box-shadow: none !important;
  background-image: none !important;
}

#view-owner .owner-order-card .status.status-preparing,
#view-owner .owner-order-card .status-preparing,
#view-owner .owner-order-card .status:not(.status-delivered):not(.status-cancelled),
.owner-panel .owner-order-card .status.status-preparing,
.owner-panel .owner-order-card .status-preparing {
  color: var(--dj-owner-red) !important;
  background: var(--dj-owner-red-soft) !important;
  border: 1px solid #dfb3bd !important;
}

#view-owner .owner-order-card .status.status-delivered,
.owner-panel .owner-order-card .status.status-delivered {
  color: var(--dj-owner-success) !important;
  background: var(--dj-owner-success-soft) !important;
  border: 1px solid var(--dj-owner-success-border) !important;
}

#view-owner .owner-order-card .status.status-cancelled,
.owner-panel .owner-order-card .status.status-cancelled {
  color: #a11d32 !important;
  background: #fae9ed !important;
  border: 1px solid #e6b7c1 !important;
}

/* ============================================================
   3. FINANCEIRO — CHIPS DE ESTADO
   ============================================================ */

.finance-state {
  border-radius: 999px !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* Pago continua verde por semântica */
.finance-state.finance-ok {
  color: var(--dj-owner-success) !important;
  background: var(--dj-owner-success-soft) !important;
  border: 1px solid var(--dj-owner-success-border) !important;
}

/* Neutro: cinza claro, jamais preto/azul */
.finance-state.finance-neutral {
  color: var(--dj-owner-muted) !important;
  background: var(--dj-owner-surface-muted) !important;
  border: 1px solid var(--dj-owner-border) !important;
}

/* Pendente: rosa/vinho, remove o amarelo */
.finance-state.finance-pending {
  color: var(--dj-owner-red) !important;
  background: var(--dj-owner-red-soft) !important;
  border: 1px solid #dfb3bd !important;
}

/* Cards financeiros permanecem claros */
.finance-delivery-card,
.finance-delivery-card .finance-delivery-values,
.finance-delivery-card .finance-state-row {
  color: var(--dj-owner-text) !important;
  background-image: none !important;
}

.finance-delivery-card {
  background: var(--dj-owner-surface) !important;
  border-color: var(--dj-owner-border) !important;
  box-shadow: 0 8px 20px rgba(70, 36, 45, .05) !important;
}

.finance-delivery-card p,
.finance-delivery-card small,
.finance-delivery-card .finance-delivery-values span {
  color: var(--dj-owner-muted) !important;
}

.finance-delivery-card strong,
.finance-delivery-card .finance-delivery-values strong {
  color: var(--dj-owner-text) !important;
}

/* OWNER VISUAL V14 END */

/* OWNER VISUAL V15 START */

:root {
  --dj-owner-text: var(--dj-text, #251f20);
  --dj-owner-muted: var(--dj-text-secondary, #6f6467);
  --dj-owner-muted-light: var(--dj-text-muted, #94898b);
  --dj-owner-red: var(--dj-primary, #8e1f2b);
  --dj-owner-red-strong: var(--dj-primary-strong, #761823);
}

/* Modal de despacho: textos nunca brancos */
#dispatch-dialog,
#dispatch-dialog .dialog-card,
#dispatch-dialog .dialog-card * {
  text-shadow: none !important;
}

#dispatch-dialog .dialog-card,
#dispatch-dialog .dialog-body,
#dispatch-dialog .dispatch-order-summary,
#dispatch-dialog .dispatch-info,
#dispatch-dialog .dialog-section,
#dispatch-dialog .form-row,
#dispatch-dialog .form-group,
#dispatch-dialog .dialog-card div,
#dispatch-dialog .dialog-card p,
#dispatch-dialog .dialog-card span,
#dispatch-dialog .dialog-card small,
#dispatch-dialog .dialog-card strong,
#dispatch-dialog .dialog-card b,
#dispatch-dialog .dialog-card label,
#dispatch-dialog .dialog-card legend {
  color: var(--dj-owner-text) !important;
}

#dispatch-dialog .dialog-card p,
#dispatch-dialog .dialog-card small,
#dispatch-dialog .dialog-card .muted,
#dispatch-dialog .dialog-card .helper-text,
#dispatch-dialog .dialog-card .dispatch-subtitle,
#dispatch-dialog .dialog-card .dispatch-hint,
#dispatch-dialog .dialog-card .dispatch-meta,
#dispatch-dialog .dispatch-order-summary p,
#dispatch-dialog .dispatch-order-summary small,
#dispatch-dialog .dispatch-order-summary span:not(.eyebrow):not(.badge):not(.status),
#dispatch-dialog .dispatch-info p,
#dispatch-dialog .dispatch-info small,
#dispatch-dialog .dispatch-info span {
  color: var(--dj-owner-muted) !important;
}

#dispatch-dialog .dialog-heading .eyebrow,
#dispatch-dialog .dialog-section .eyebrow,
#dispatch-dialog .dialog-card .section-kicker,
#dispatch-dialog .dialog-card .field-kicker {
  color: var(--dj-owner-red) !important;
}

#dispatch-dialog .dialog-heading h2,
#dispatch-dialog .dispatch-order-summary strong,
#dispatch-dialog .dispatch-order-summary b,
#dispatch-dialog .dialog-card h3,
#dispatch-dialog .dialog-card h4,
#dispatch-dialog .dialog-card label,
#dispatch-dialog .dialog-card legend {
  color: var(--dj-owner-text) !important;
}

#dispatch-dialog input,
#dispatch-dialog textarea,
#dispatch-dialog select {
  color: var(--dj-owner-text) !important;
  caret-color: var(--dj-owner-red) !important;
}

#dispatch-dialog input::placeholder,
#dispatch-dialog textarea::placeholder {
  color: var(--dj-owner-muted-light) !important;
  opacity: 1 !important;
}

#dispatch-dialog select,
#dispatch-dialog option {
  color: var(--dj-owner-text) !important;
}

#dispatch-dialog .dispatch-info,
#dispatch-dialog #dispatch-courier-info,
#dispatch-dialog .dispatch-info *,
#dispatch-dialog #dispatch-courier-info * {
  color: var(--dj-owner-muted) !important;
}

#dispatch-dialog .dispatch-info::before,
#dispatch-dialog #dispatch-courier-info::before {
  color: #ffffff !important;
}

/* Botões preservados */
#dispatch-dialog .primary-button,
#dispatch-dialog .primary-button * {
  color: #ffffff !important;
}

#dispatch-dialog .secondary-button,
#dispatch-dialog .secondary-button * {
  color: var(--dj-owner-red) !important;
}

#dispatch-dialog .dialog-close {
  color: var(--dj-owner-red) !important;
}

#dispatch-dialog .dialog-close:hover,
#dispatch-dialog .dialog-close:focus-visible {
  color: #ffffff !important;
}

/* OWNER VISUAL V15 END */

/* OWNER VISUAL V16 START */
:root {
  --dj-owner-text: var(--dj-text, #251f20);
  --dj-owner-muted: var(--dj-text-secondary, #6f6467);
  --dj-owner-placeholder: var(--dj-text-muted, #94898b);
  --dj-owner-surface: #ffffff;
}

/* Corrige select + options do modal de despacho */
#dispatch-dialog select,
#dispatch-dialog select:focus,
#dispatch-dialog select:hover,
#dispatch-dialog select:active,
#dispatch-dialog input,
#dispatch-dialog textarea {
  color: var(--dj-owner-text) !important;
  -webkit-text-fill-color: var(--dj-owner-text) !important;
  background: var(--dj-owner-surface) !important;
  background-color: var(--dj-owner-surface) !important;
  opacity: 1 !important;
}

#dispatch-dialog select option,
#dispatch-dialog select optgroup,
#dispatch-dialog datalist option,
#dispatch-dialog option {
  color: var(--dj-owner-text) !important;
  -webkit-text-fill-color: var(--dj-owner-text) !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

#dispatch-dialog select:invalid,
#dispatch-dialog option[value=''],
#dispatch-dialog option:disabled {
  color: var(--dj-owner-muted) !important;
  -webkit-text-fill-color: var(--dj-owner-muted) !important;
}

#dispatch-dialog input::placeholder,
#dispatch-dialog textarea::placeholder {
  color: var(--dj-owner-placeholder) !important;
  -webkit-text-fill-color: var(--dj-owner-placeholder) !important;
  opacity: 1 !important;
}

/* Campo de escolha do entregador */
#dispatch-dialog #dispatch-courier-select,
#dispatch-dialog #dispatch-courier-select option,
#dispatch-dialog #dispatch-courier-select optgroup {
  color: var(--dj-owner-text) !important;
  -webkit-text-fill-color: var(--dj-owner-text) !important;
  background: #ffffff !important;
  background-color: #ffffff !important;
}

/* Tipo principal do pacote */
#dispatch-dialog select[name='package_type'],
#dispatch-dialog select[name='package_type'] option {
  color: var(--dj-owner-text) !important;
  -webkit-text-fill-color: var(--dj-owner-text) !important;
  background: #ffffff !important;
}

/* OWNER VISUAL V16 END */

/* HOME ANDROID V18 START */

/* ======================================================================
   DELIVERY JURUTI — HOME PWA BASEADA NA TELA INICIAL DO ANDROID

   ESCOPO: somente #view-home.
   Nenhuma outra tela deve herdar essas regras.
   ====================================================================== */

#view-home {
  --home-android-primary: #A71930;
  --home-android-primary-dark: #761020;
  --home-android-selected: #F5D8DD;
  --home-android-bg: #EEEDEA;
  --home-android-surface: #F9F8F6;
  --home-android-surface-white: #FFFFFF;
  --home-android-muted: #E5E4E1;
  --home-android-border: #CBC9C5;
  --home-android-border-soft: #DDDAD6;
  --home-android-text: #202124;
  --home-android-text-secondary: #5F6062;
  --home-android-success: #0F783B;
  --home-android-success-soft: #E6F4EC;

  color: var(--home-android-text) !important;
  background: var(--home-android-bg) !important;
}

/* ----------------------------------------------------------------------
   Cabeçalho interno da Home / mobile
   ---------------------------------------------------------------------- */
#view-home .mobile-home-heading,
#view-home .home-heading,
#view-home .home-mobile-header {
  color: var(--home-android-text) !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

#view-home .mobile-brand,
#view-home .mobile-profile-button {
  color: var(--home-android-text) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#view-home .mobile-profile-button:hover,
#view-home .mobile-brand:hover {
  color: var(--home-android-primary) !important;
  background: transparent !important;
}

/* ----------------------------------------------------------------------
   Busca
   ---------------------------------------------------------------------- */
#view-home .search-panel,
#view-home .mobile-search-panel {
  background: transparent !important;
}

#view-home .search-box {
  min-height: 54px !important;
  color: var(--home-android-text) !important;
  background: var(--home-android-surface) !important;
  background-image: none !important;
  border: 1px solid var(--home-android-border) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

#view-home .search-box .search-icon {
  color: var(--home-android-primary) !important;
}

#view-home .search-box input {
  color: var(--home-android-text) !important;
  background: transparent !important;
}

#view-home .search-box input::placeholder {
  color: var(--home-android-text-secondary) !important;
  opacity: 1 !important;
}

#view-home .location-search-button {
  color: var(--home-android-primary) !important;
  background: var(--home-android-surface) !important;
  border-color: var(--home-android-border) !important;
}

#view-home .location-search-button:hover {
  color: var(--home-android-primary-dark) !important;
  background: var(--home-android-selected) !important;
  border-color: var(--home-android-primary) !important;
}

/* ----------------------------------------------------------------------
   Banner e Queridinhos
   ---------------------------------------------------------------------- */
#view-home .home-banner-carousel,
#view-home .home-banner-track {
  background: transparent !important;
}

/* Não usar shorthand background aqui: a imagem é inline no app.js. */
#view-home .home-banner-slide {
  background-color: transparent !important;
}

#view-home .home-banner-slide,
#view-home .home-banner-slide img {
  border-radius: 20px !important;
}

#view-home .consumer-section-title h2,
#view-home .section-heading h2,
#view-home .compact-heading h2 {
  color: var(--home-android-text) !important;
}

#view-home .consumer-section-title > span {
  color: var(--home-android-primary) !important;
}

#view-home .muted,
#view-home #restaurant-counter {
  color: var(--home-android-text-secondary) !important;
}

/* ----------------------------------------------------------------------
   Abas Abertos agora / Segmentos — aparência do Android
   ---------------------------------------------------------------------- */
#view-home .home-mode-tabs {
  gap: 12px !important;
  background: transparent !important;
}

#view-home .home-mode-tabs button {
  min-height: 48px !important;
  color: var(--home-android-text-secondary) !important;
  background: var(--home-android-surface) !important;
  background-image: none !important;
  border: 1px solid var(--home-android-border) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  font-weight: 700 !important;
}

#view-home .home-mode-tabs button > span {
  color: inherit !important;
}

#view-home .home-mode-tabs button:hover {
  color: var(--home-android-primary) !important;
  background: #FBECEF !important;
  border-color: #D7A4AD !important;
}

#view-home .home-mode-tabs button.active,
#view-home .home-mode-tabs button[aria-pressed='true'] {
  color: var(--home-android-primary) !important;
  background: var(--home-android-selected) !important;
  border-color: transparent !important;
}

/* ----------------------------------------------------------------------
   Card do estabelecimento
   ---------------------------------------------------------------------- */
#view-home .consumer-restaurant-card,
#view-home .restaurant-card,
#view-home #restaurant-grid > article,
#view-home #search-restaurants-grid > article,
#view-home [data-restaurant-id] {
  color: var(--home-android-text) !important;
  background: var(--home-android-surface) !important;
  background-image: none !important;
  border: 1px solid var(--home-android-border-soft) !important;
  border-radius: 22px !important;
  box-shadow: 0 4px 12px rgba(32, 33, 36, .06) !important;
  transform: none !important;
}

#view-home .consumer-restaurant-card:hover,
#view-home .restaurant-card:hover,
#view-home #restaurant-grid > article:hover,
#view-home #search-restaurants-grid > article:hover,
#view-home [data-restaurant-id]:hover {
  background: var(--home-android-surface-white) !important;
  border-color: var(--home-android-border) !important;
  box-shadow: 0 7px 18px rgba(32, 33, 36, .09) !important;
  transform: none !important;
}

/* ----------------------------------------------------------------------
   Imagem do estabelecimento — fundo CINZA CLARO, nunca verde
   ---------------------------------------------------------------------- */
#view-home .consumer-restaurant-image,
#view-home .consumer-restaurant-image.dj-status-open,
#view-home .dj-status-open.consumer-restaurant-image,
#view-home .restaurant-card .consumer-restaurant-image,
#view-home [data-restaurant-id] .consumer-restaurant-image,
#view-home #home-open-panel .consumer-restaurant-image,
#view-home #home-segments-panel .consumer-restaurant-image {
  background: var(--home-android-muted) !important;
  background-color: var(--home-android-muted) !important;
  background-image: none !important;
  border: 1px solid var(--home-android-border-soft) !important;
  box-shadow: none !important;
}

#view-home .consumer-restaurant-image::before,
#view-home .consumer-restaurant-image::after {
  background: var(--home-android-muted) !important;
  background-color: var(--home-android-muted) !important;
  background-image: none !important;
  border-color: var(--home-android-border-soft) !important;
}

#view-home .consumer-restaurant-image img {
  background: transparent !important;
  border-radius: 16px !important;
}

/* ----------------------------------------------------------------------
   Conteúdo do card
   ---------------------------------------------------------------------- */
#view-home .consumer-restaurant-body,
#view-home .consumer-restaurant-body * {
  text-shadow: none !important;
}

#view-home .consumer-restaurant-body h3,
#view-home .consumer-restaurant-title,
#view-home .consumer-restaurant-title h3,
#view-home .restaurant-card h3 {
  color: var(--home-android-text) !important;
  font-weight: 800 !important;
}

#view-home .consumer-restaurant-body p,
#view-home .consumer-restaurant-meta,
#view-home .consumer-restaurant-meta span,
#view-home .restaurant-card p,
#view-home .restaurant-card small {
  color: var(--home-android-text-secondary) !important;
}

#view-home .consumer-restaurant-meta strong,
#view-home .consumer-restaurant-meta b {
  color: var(--home-android-text) !important;
}

/* Avaliação */
#view-home .rating-badge {
  color: var(--home-android-primary) !important;
  background: var(--home-android-selected) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Aberto permanece verde somente por semântica */
#view-home .open-badge,
#view-home .status-open,
#view-home .store-open-pill,
#view-home .store-open-chip,
#view-home .store-state.open,
#view-home .store-state.status-button.open {
  color: var(--home-android-success) !important;
  background: var(--home-android-success-soft) !important;
  background-image: none !important;
  border-color: #B8DCC8 !important;
  box-shadow: none !important;
}

/* Favorito */
#view-home .favorite-store-button {
  color: var(--home-android-text-secondary) !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

#view-home .favorite-store-button:hover,
#view-home .favorite-store-button[aria-pressed='true'] {
  color: var(--home-android-primary) !important;
  background: var(--home-android-selected) !important;
}

/* ----------------------------------------------------------------------
   Segmentos
   ---------------------------------------------------------------------- */
#view-home .segment-card {
  color: var(--home-android-text) !important;
  background: var(--home-android-surface) !important;
  background-image: none !important;
  border: 1px solid var(--home-android-border-soft) !important;
  border-radius: 18px !important;
  box-shadow: none !important;
}

#view-home .segment-card:hover {
  color: var(--home-android-primary) !important;
  background: #FBECEF !important;
  border-color: #D7A4AD !important;
}

/* ----------------------------------------------------------------------
   Mobile — aproxima a densidade visual da Home nativa
   ---------------------------------------------------------------------- */
@media (max-width: 640px) {
  #view-home {
    padding-bottom: 96px !important;
  }

  #view-home .search-box {
    min-height: 52px !important;
    border-radius: 18px !important;
  }

  #view-home .home-mode-tabs {
    gap: 10px !important;
  }

  #view-home .home-mode-tabs button {
    min-height: 46px !important;
    border-radius: 15px !important;
  }

  #view-home .consumer-restaurant-card,
  #view-home .restaurant-card,
  #view-home #restaurant-grid > article,
  #view-home [data-restaurant-id] {
    border-radius: 20px !important;
  }

  #view-home .consumer-restaurant-image {
    background: var(--home-android-muted) !important;
    background-color: var(--home-android-muted) !important;
  }
}

/* HOME ANDROID V18 END */

/* BANNER HOME V20 START */
#view-home .home-banner-track {
  border-radius: 20px !important;
  overflow: hidden !important;
}

#view-home .home-banner-slide {
  border-radius: 20px !important;
  background-color: transparent !important;
}

/* IMPORTANTE: não usar "background: ... !important" em .home-banner-slide.
   O app.js usa background-image:url(...) no style inline de cada slide. */

#view-home .home-banner-dots button {
  background-color: #CBC9C5 !important;
}

#view-home .home-banner-dots button.active {
  background-color: #A71930 !important;
}

@media (max-width: 768px) {
  #view-home .home-banner-track,
  #view-home .home-banner-slide {
    border-radius: 16px !important;
  }
}
/* BANNER HOME V20 END */

/* HOME MOBILE ANDROID V21 START */

/* Remove o card de instalação da Home. */
#view-home #install-promo,
#view-home .install-promo,
#view-home .install-promo-compact {
  display: none !important;
}

/* Corrige a cidade, que era herdada como branca no mobile. */
#view-home #mobile-location-heading,
#view-home #mobile-location-label {
  color: #5F6062 !important;
  -webkit-text-fill-color: #5F6062 !important;
  text-shadow: none !important;
}

#view-home #mobile-location-heading > b {
  color: #A71930 !important;
  -webkit-text-fill-color: #A71930 !important;
}

@media (max-width: 640px) {

  /* Remove apenas a cesta/logo central da primeira tela. */
  #view-home .mobile-home-heading > .mobile-brand {
    display: none !important;
  }

  /* Cidade à esquerda e perfil à direita. */
  #view-home .mobile-home-heading {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    min-height: 48px !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 0 2mm !important;
    gap: 2mm !important;
  }

  #view-home .mobile-location-button,
  #view-home .mobile-profile-button {
    min-height: 44px !important;
    margin: 0 !important;
  }

  /* Cidade -> pesquisa: máximo 2 mm. */
  #view-home .mobile-search-panel,
  #view-home .search-panel.mobile-search-panel {
    margin: 0 0 2mm !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  #view-home .search-box {
    margin: 0 !important;
  }

  #view-home #home-search-results[hidden] {
    display: none !important;
  }

  /* Pesquisa -> banner: máximo 2 mm. */
  #view-home #home-banner-carousel,
  #view-home .home-banner-carousel {
    margin: 0 !important;
    padding: 0 !important;
  }

  /* 1200x480 = 40vw de altura natural.
     Redução de 30% => 28vw. */
  #view-home #home-banner-track,
  #view-home .home-banner-track {
    height: 28vw !important;
    min-height: 92px !important;
    max-height: 154px !important;
    margin: 0 !important;
    border-radius: 16px !important;
    overflow: hidden !important;
  }

  #view-home .home-banner-slide {
    height: 100% !important;
    min-height: 0 !important;
    border-radius: 16px !important;

    /* Não usar shorthand background:
       o app.js injeta background-image inline. */
    background-color: transparent !important;
    background-size: cover !important;
    background-position: center !important;
  }

  /* Dots compactos para não criar área vazia. */
  #view-home #home-banner-dots,
  #view-home .home-banner-dots {
    min-height: 0 !important;
    height: auto !important;
    margin: 1mm 0 1mm !important;
    padding: 0 !important;
    gap: 1.2mm !important;
  }

  #view-home .home-banner-dots button {
    width: 7px !important;
    height: 7px !important;
    min-width: 7px !important;
    min-height: 7px !important;
    padding: 0 !important;
  }

  #view-home .home-banner-dots button.active {
    width: 18px !important;
  }

  /* Banner -> Queridinhos: máximo 2 mm. */
  #view-home .favorites-section {
    margin-top: 0 !important;
    padding-top: 0 !important;
  }

  #view-home .favorites-section > .consumer-section-title,
  #view-home .consumer-section-title {
    margin-top: 0 !important;
  }
}

/* HOME MOBILE ANDROID V21 END */

/* HOME MOBILE ANDROID V25 START */

@media (max-width: 640px) {

  /* =========================================================
     1. BUSCA — aproximadamente 20% mais baixa
     ========================================================= */
  #view-home .mobile-search-panel,
  #view-home .search-panel.mobile-search-panel {
    margin: 0 0 2mm !important;
    padding: 0 !important;
    gap: 0 !important;
  }

  #view-home .search-box,
  #view-home .search-box-large,
  #view-home .mobile-search-panel .search-box {
    min-height: 34px !important;
    height: 34px !important;
    max-height: 34px !important;
    padding: 0 8px !important;
    margin: 0 !important;
    border-radius: 14px !important;
    display: flex !important;
    align-items: center !important;
  }

  #view-home .search-box input,
  #view-home .search-box-large input,
  #view-home #restaurant-search,
  #view-home input[type="search"] {
    min-height: 28px !important;
    height: 28px !important;
    max-height: 28px !important;
    padding: 0 6px !important;
    font-size: 14px !important;
    line-height: 28px !important;
  }

  #view-home .search-icon {
    font-size: 18px !important;
    line-height: 1 !important;
  }

  /* =========================================================
     2. CORES TIPOGRÁFICAS
     ========================================================= */
  #view-home .favorites-section .consumer-section-title,
  #view-home .favorites-section .consumer-section-title h2,
  #view-home .consumer-section-title h2 {
    color: #3F4143 !important;
    -webkit-text-fill-color: #3F4143 !important;
  }

  #view-home .mobile-profile-button,
  #view-home .mobile-profile-button span,
  #view-home .mobile-profile-button strong,
  #view-home .mobile-profile-button em {
    color: #5F6062 !important;
    -webkit-text-fill-color: #5F6062 !important;
  }

  #view-home .mobile-profile-button b {
    color: #A71930 !important;
    -webkit-text-fill-color: #A71930 !important;
  }

  /* =========================================================
     3. QUERIDINHOS — mantém o tamanho aprovado da V24
     22.5mm x 22.5mm
     ========================================================= */
  #view-home #highlight-list,
  #view-home .highlight-list {
    display: flex !important;
    align-items: flex-start !important;
    gap: 2mm !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
  }

  #view-home .highlight-card {
    position: relative !important;
    flex: 0 0 22.5mm !important;
    width: 22.5mm !important;
    min-width: 22.5mm !important;
    max-width: 22.5mm !important;
    height: 22.5mm !important;
    min-height: 22.5mm !important;
    max-height: 22.5mm !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 3.5mm !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  #view-home .highlight-card > img {
    display: block !important;
    width: 22.5mm !important;
    min-width: 22.5mm !important;
    max-width: 22.5mm !important;
    height: 22.5mm !important;
    min-height: 22.5mm !important;
    max-height: 22.5mm !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    border-radius: 3.5mm !important;
  }

  #view-home .highlight-card .highlight-name {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0 0 0 0) !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
  }

  #view-home .highlight-card .highlight-price {
    position: absolute !important;
    left: 1mm !important;
    right: 1mm !important;
    bottom: 1mm !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    min-height: 4.8mm !important;
    height: 4.8mm !important;
    padding: 0 .8mm !important;
    margin: 0 !important;
    border-radius: 2.2mm !important;
    color: #fff !important;
    background: rgba(167,25,48,.96) !important;
    box-shadow: none !important;
  }

  #view-home .highlight-card .highlight-price > span {
    display: none !important;
  }

  #view-home .highlight-card .highlight-price strong {
    color: #fff !important;
    font-size: 9px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    font-weight: 800 !important;
  }

  /* =========================================================
     4. ESTABELECIMENTO — layout semelhante ao Android
     Sem sobreposição de avaliação/favorito/textos.
     ========================================================= */
  #view-home .consumer-restaurant-card,
  #view-home .restaurant-card,
  #view-home #restaurant-grid > article {
    position: relative !important;
    display: grid !important;
    grid-template-columns: 22.5mm minmax(0,1fr) !important;
    align-items: center !important;
    min-height: 108px !important;
    height: 108px !important;
    max-height: 108px !important;
    padding: 2mm !important;
    gap: 2.2mm !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
  }

  #view-home .consumer-restaurant-image {
    position: relative !important;
    width: 22.5mm !important;
    min-width: 22.5mm !important;
    max-width: 22.5mm !important;
    height: 22.5mm !important;
    min-height: 22.5mm !important;
    max-height: 22.5mm !important;
    padding: 0 !important;
    margin: 0 !important;
    border-radius: 3.5mm !important;
    overflow: hidden !important;
    align-self: center !important;
    justify-self: start !important;
  }

  #view-home .consumer-restaurant-image img {
    display: block !important;
    width: 22.5mm !important;
    min-width: 22.5mm !important;
    max-width: 22.5mm !important;
    height: 22.5mm !important;
    min-height: 22.5mm !important;
    max-height: 22.5mm !important;
    padding: 0 !important;
    margin: 0 !important;
    object-fit: cover !important;
    border-radius: 3.5mm !important;
  }

  /* ABERTO: pequeno, proporcional e preso ao rodapé da imagem */
  #view-home .consumer-restaurant-image .open-badge,
  #view-home .consumer-restaurant-image .status-open,
  #view-home .consumer-restaurant-image .open-status {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: .8mm !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    min-width: 11mm !important;
    max-width: 18mm !important;
    height: 4.2mm !important;
    min-height: 4.2mm !important;
    padding: 0 1.2mm !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 6.5px !important;
    line-height: 1 !important;
    border-radius: 2.1mm !important;
    text-align: center !important;
    white-space: nowrap !important;
    color: #0F783B !important;
    background: rgba(249,248,246,.96) !important;
    border: 1px solid rgba(15,120,59,.16) !important;
    box-shadow: none !important;
  }

  /* Corpo reserva espaço à direita para avaliação e coração */
  #view-home .consumer-restaurant-body {
    min-width: 0 !important;
    padding: 0 13mm 0 0 !important;
    margin: 0 !important;
    align-self: center !important;
  }

  #view-home .consumer-restaurant-title {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  #view-home .consumer-restaurant-title h3 {
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 13.5px !important;
    line-height: 1.1 !important;
    display: -webkit-box !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
    overflow: hidden !important;
  }

  /* Avaliação deixa de disputar espaço com o nome */
  #view-home .consumer-restaurant-title .rating-badge {
    position: absolute !important;
    top: 2mm !important;
    right: 2mm !important;
    width: auto !important;
    min-width: 10mm !important;
    max-width: 12mm !important;
    padding: 1mm 1.2mm !important;
    margin: 0 !important;
    font-size: 9px !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  #view-home .consumer-restaurant-body > p {
    max-width: 100% !important;
    margin: 1.4mm 0 0 !important;
    padding: 0 !important;
    color: #5F6062 !important;
    font-size: 10.5px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
  }

  /* Prazo / distância / taxa: maiores e sem sobreposição */
  #view-home .consumer-restaurant-meta {
    display: flex !important;
    align-items: center !important;
    flex-wrap: nowrap !important;
    gap: 1.8mm !important;
    max-width: 100% !important;
    margin: 2mm 0 0 !important;
    padding: 0 !important;
    color: #5F6062 !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    overflow: hidden !important;
  }

  #view-home .consumer-restaurant-meta span,
  #view-home .consumer-restaurant-meta small,
  #view-home .consumer-restaurant-meta strong {
    flex: 0 0 auto !important;
    color: #5F6062 !important;
    font-size: 10px !important;
    line-height: 1 !important;
    white-space: nowrap !important;
  }

  /* Coração isolado no canto inferior direito */
  #view-home .favorite-store-button {
    position: absolute !important;
    right: 2mm !important;
    bottom: 2mm !important;
    width: 8mm !important;
    min-width: 8mm !important;
    max-width: 8mm !important;
    height: 8mm !important;
    min-height: 8mm !important;
    max-height: 8mm !important;
    padding: 0 !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    font-size: 17px !important;
    line-height: 1 !important;
  }
}

/* HOME MOBILE ANDROID V25 END */

/* MOBILE ANDROID V29 START */

@media (max-width: 640px) {

  /* =========================================================
     0. ROLAGEM MOBILE / PWA
     Corrige o carrinho que ficava travado sem rolagem.
     ========================================================= */
  html,
  body {
    height: auto !important;
    min-height: 100% !important;
    max-height: none !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: auto !important;
    touch-action: pan-y !important;
  }

  .app-shell {
    height: auto !important;
    min-height: 100dvh !important;
    max-height: none !important;
    overflow: visible !important;
  }

  #view-product,
  #view-cart,
  #view-checkout,
  #view-product.active,
  #view-cart.active,
  #view-checkout.active,
  #cart-content {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    touch-action: pan-y !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* =========================================================
     1. REMOVE LOGO/CENTRO DAS BARRAS DO FLUXO
     restaurante, produto, carrinho e checkout.
     ========================================================= */
  #view-restaurant .store-topbar .store-brand,
  #view-restaurant .store-topbar .mobile-brand,
  #view-restaurant .store-topbar .mobile-brand-logo,
  #view-product .store-topbar .store-brand,
  #view-product .store-topbar .mobile-brand,
  #view-product .store-topbar .mobile-brand-logo,
  #view-cart .store-topbar .store-brand,
  #view-cart .store-topbar .mobile-brand,
  #view-cart .store-topbar .mobile-brand-logo,
  #view-checkout .store-topbar .store-brand,
  #view-checkout .store-topbar .mobile-brand,
  #view-checkout .store-topbar .mobile-brand-logo {
    display: none !important;
  }

  #view-restaurant .store-topbar,
  #view-product .store-topbar,
  #view-cart .store-topbar,
  #view-checkout .store-topbar {
    grid-template-columns: auto 1fr auto !important;
    min-height: 62px !important;
    padding: 0 20px !important;
  }

  /* =========================================================
     2. PRODUTO — menos espaços e conteúdo rolável
     ========================================================= */
  #view-product .product-detail-card {
    min-height: 0 !important;
    height: auto !important;
    padding: 12px 20px calc(118px + env(safe-area-inset-bottom)) !important;
  }

  #view-product .product-detail-heading {
    gap: 12px !important;
    grid-template-columns: minmax(0, 1fr) 120px !important;
  }

  #view-product .product-detail-heading h1 {
    margin: 10px 0 6px !important;
  }

  #view-product .product-detail-heading p {
    margin: 0 !important;
    line-height: 1.3 !important;
  }

  #view-product .product-detail-heading img {
    width: 118px !important;
    height: 118px !important;
  }

  #view-product .product-price-row {
    margin: 14px 0 10px !important;
  }

  #view-product .product-notes {
    gap: 6px !important;
    padding: 10px !important;
  }

  #view-product .product-notes textarea {
    min-height: 92px !important;
    max-height: 140px !important;
    padding: 8px 0 !important;
  }

  #view-product .consumer-sticky-action {
    min-height: 52px !important;
    margin: 12px 0 0 !important;
  }

  /* =========================================================
     3. CARRINHO — rolagem + compactação
     ========================================================= */
  #view-cart {
    padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
  }

  #view-cart #cart-content {
    padding-bottom: 0 !important;
  }

  #view-cart .consumer-cart {
    min-height: 0 !important;
    height: auto !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    padding: 8px 20px 18px !important;
    overflow: visible !important;
  }

  #view-cart .consumer-cart h1 {
    margin: 4px 0 12px !important;
    gap: 8px !important;
  }

  #view-cart .consumer-cart-items {
    margin: 0 !important;
    padding: 0 !important;
  }

  #view-cart .consumer-cart-item {
    grid-template-columns: 64px minmax(0, 1fr) auto !important;
    gap: 10px !important;
    padding: 10px 0 !important;
    min-height: 86px !important;
  }

  #view-cart .consumer-cart-item img {
    width: 58px !important;
    height: 58px !important;
    border-radius: 10px !important;
  }

  #view-cart .consumer-cart-item > div:nth-child(2) {
    gap: 3px !important;
  }

  #view-cart .consumer-cart-item strong {
    font-size: 15px !important;
    line-height: 1.12 !important;
  }

  #view-cart .consumer-cart-item b {
    font-size: 17px !important;
  }

  #view-cart .consumer-cart-item .stepper {
    padding: 4px 6px !important;
    gap: 4px !important;
  }

  #view-cart .consumer-cart-item .stepper button {
    min-width: 34px !important;
    width: 34px !important;
    height: 38px !important;
    padding: 0 !important;
  }

  #view-cart .consumer-cart-item .stepper span,
  #view-cart .consumer-cart-item .stepper strong,
  #view-cart .consumer-cart-item .stepper b,
  #view-cart .consumer-cart-item .stepper div {
    color: #A71930 !important;
    -webkit-text-fill-color: #A71930 !important;
    opacity: 1 !important;
    font-weight: 800 !important;
  }

  #view-cart .add-more-items {
    min-height: 50px !important;
    margin: 10px 0 6px !important;
    padding: 8px 14px !important;
  }

  #view-cart .consumer-total-row {
    padding: 10px 0 !important;
    margin: 0 !important;
  }

  #view-cart .consumer-cart .consumer-sticky-action {
    min-height: 52px !important;
    margin: 8px 0 0 !important;
  }

  /* impede margin-top:auto de empurrar o botão para muito longe */
  #view-cart .consumer-sticky-action {
    margin-top: 8px !important;
  }

  /* =========================================================
     4. CHECKOUT — sem logo + espaços menores
     ========================================================= */
  #view-checkout {
    padding-bottom: calc(112px + env(safe-area-inset-bottom)) !important;
  }

  #view-checkout .checkout-consumer-heading {
    padding: 0 20px !important;
  }

  #view-checkout .checkout-consumer-heading h1 {
    margin: 10px 0 12px !important;
    font-size: 23px !important;
  }

  #view-checkout .consumer-checkout-form {
    min-height: 0 !important;
    height: auto !important;
    gap: 10px !important;
    padding: 0 20px 18px !important;
    overflow: visible !important;
  }

  #view-checkout .checkout-address-row {
    gap: 12px !important;
    padding: 12px 14px !important;
    border-radius: 16px !important;
  }

  #view-checkout .checkout-hidden-fields {
    gap: 8px !important;
    padding: 12px !important;
  }

  #view-checkout .checkout-address-picker,
  #view-checkout .checkout-manual-address,
  #view-checkout .consumer-checkout-summary,
  #view-checkout .payment-choice-row,
  #view-checkout .consumer-notes-field,
  #view-checkout .coupon-compact {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
  }

  #view-checkout .checkout-address-card,
  #view-checkout .selection-card,
  #view-checkout .receiver-card,
  #view-checkout .radio-card,
  #view-checkout .consumer-checkout-summary {
    padding-top: 12px !important;
    padding-bottom: 12px !important;
  }

  #view-checkout .consumer-sticky-action {
    min-height: 52px !important;
    margin: 8px 0 0 !important;
  }

  /* =========================================================
     5. RESTAURANTE — sem halo verde e ABERTO alinhado
     ========================================================= */
  #view-restaurant .consumer-store-logo {
    position: relative !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  #view-restaurant .consumer-store-logo::before,
  #view-restaurant .consumer-store-logo::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  #view-restaurant .consumer-store-logo img {
    background: #F3F1EF !important;
    background-image: none !important;
    border: 1px solid #E5E1DE !important;
    outline: 0 !important;
    box-shadow: none !important;
  }

  #view-restaurant .consumer-store-logo > span,
  #view-restaurant .consumer-store-logo .open-badge {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 4px !important;
    transform: translateX(-50%) !important;
    width: auto !important;
    min-width: 72px !important;
    max-width: 88px !important;
    height: 24px !important;
    min-height: 24px !important;
    padding: 0 10px !important;
    margin: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 12px !important;
    color: #0F783B !important;
    background: rgba(249,248,246,.98) !important;
    border: 1px solid #D8E5DD !important;
    outline: 0 !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    text-align: center !important;
    white-space: nowrap !important;
  }

  /* =========================================================
     6. HOME — fontes auxiliares +15%, sem alterar o nome
     ========================================================= */
  #view-home .consumer-restaurant-body > p {
    font-size: 13.8px !important;
    line-height: 1.18 !important;
  }

  #view-home .consumer-restaurant-meta,
  #view-home .consumer-restaurant-meta span,
  #view-home .consumer-restaurant-meta small,
  #view-home .consumer-restaurant-meta strong {
    font-size: 13.1px !important;
    line-height: 1.08 !important;
  }

  #view-home .consumer-restaurant-title .rating-badge {
    font-size: 11.5px !important;
    line-height: 1 !important;
  }

  #view-home .consumer-restaurant-image .open-badge,
  #home-open-panel .consumer-restaurant-image .open-badge,
  #home-segment-panel .consumer-restaurant-image .open-badge {
    font-size: 7.8px !important;
    font-weight: 800 !important;
  }
}

/* MOBILE ANDROID V29 END */

/* DELIVERY JURUTI MOBILE V35 START */

@media (max-width: 640px) {

  /* 1) CARRINHO: opção textual, sem card */
  html body #view-cart section.consumer-cart > button.add-more-items,
  html body #view-cart button.add-more-items {
    display: inline-flex !important;
    flex: 0 0 auto !important;
    align-self: flex-start !important;
    justify-self: start !important;
    align-items: center !important;
    justify-content: flex-start !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: max-content !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    margin: 6px 0 8px !important;
    padding: 3px 0 !important;
    color: #A71930 !important;
    -webkit-text-fill-color: #A71930 !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 15px !important;
    font-weight: 800 !important;
    line-height: 1.2 !important;
    text-align: left !important;
    white-space: nowrap !important;
    transform: none !important;
  }

  html body #view-cart button.add-more-items::before {
    content: "+ " !important;
    display: inline !important;
    margin-right: 3px !important;
    color: #A71930 !important;
    font-weight: 900 !important;
  }

  html body #view-cart button.add-more-items:hover,
  html body #view-cart button.add-more-items:focus-visible {
    color: #761823 !important;
    -webkit-text-fill-color: #761823 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    text-decoration: underline !important;
  }

  /* 2) CHECKOUT: endereço sem sobreposição */
  html body #view-checkout section.checkout-address-row {
    position: relative !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    column-gap: 10px !important;
    row-gap: 0 !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 10px 12px !important;
    background: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #E7DEDB !important;
    border-radius: 16px !important;
    box-shadow: none !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  html body #view-checkout section.checkout-address-row::before,
  html body #view-checkout #checkout-address-preview::before {
    content: none !important;
    display: none !important;
  }

  html body #view-checkout section.checkout-address-row > div {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 3px !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    overflow: visible !important;
  }

  html body #view-checkout strong#checkout-address-preview {
    display: -webkit-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #251F20 !important;
    -webkit-text-fill-color: #251F20 !important;
    font-size: 14px !important;
    font-weight: 800 !important;
    line-height: 1.22 !important;
    white-space: normal !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
    overflow: hidden !important;
    text-overflow: clip !important;
    -webkit-line-clamp: 2 !important;
    -webkit-box-orient: vertical !important;
  }

  html body #view-checkout span#checkout-time-preview {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    color: #6F6467 !important;
    -webkit-text-fill-color: #6F6467 !important;
    font-size: 12px !important;
    line-height: 1.2 !important;
    white-space: normal !important;
    overflow: visible !important;
  }

  html body #view-checkout button#checkout-change-address {
    grid-column: 2 !important;
    align-self: center !important;
    justify-self: end !important;
    flex: none !important;
    width: auto !important;
    min-width: 64px !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    color: #A71930 !important;
    -webkit-text-fill-color: #A71930 !important;
    background: #FFFFFF !important;
    background-image: none !important;
    border: 1px solid #CFAEB3 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
  }

  /* 3) PERFIL DO ESTABELECIMENTO: imagem 1:1, sem flex-shrink */
  html body #view-restaurant section.consumer-store-summary {
    display: grid !important;
    grid-template-columns: 138px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 10px 12px !important;
    box-sizing: border-box !important;
  }

  html body #view-restaurant div.consumer-store-logo,
  html body #view-restaurant div.consumer-store-logo.dj-status-open {
    position: relative !important;
    display: block !important;
    width: 138px !important;
    min-width: 138px !important;
    max-width: 138px !important;
    height: 138px !important;
    min-height: 138px !important;
    max-height: 138px !important;
    aspect-ratio: 1 / 1 !important;
    flex: 0 0 138px !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    background: #F7F5F3 !important;
    background-image: none !important;
    border: 1px solid #E7DEDB !important;
    border-radius: 22px !important;
    outline: 0 !important;
    box-shadow: none !important;
    overflow: hidden !important;
    box-sizing: border-box !important;
  }

  html body #view-restaurant div.consumer-store-logo > img,
  html body #view-restaurant div.consumer-store-logo.dj-status-open > img {
    display: block !important;
    width: 100% !important;
    min-width: 100% !important;
    max-width: 100% !important;
    height: 100% !important;
    min-height: 100% !important;
    max-height: 100% !important;
    aspect-ratio: 1 / 1 !important;
    flex: 0 0 100% !important;
    flex-shrink: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    object-fit: cover !important;
    object-position: center center !important;
    background: #F7F5F3 !important;
    border: 0 !important;
    border-radius: 21px !important;
    outline: 0 !important;
    box-shadow: none !important;
    transform: none !important;
  }

  html body #view-restaurant div.consumer-store-logo > span.dj-status-open,
  html body #view-restaurant div.consumer-store-logo > span[class*="status"] {
    position: absolute !important;
    left: 50% !important;
    right: auto !important;
    bottom: 5px !important;
    transform: translateX(-50%) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: auto !important;
    min-width: 72px !important;
    max-width: calc(100% - 14px) !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    color: #0F783B !important;
    background: rgba(255,255,255,.97) !important;
    border: 1px solid #D8E5DD !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    z-index: 4 !important;
  }

  /* 4) BARRA INFERIOR: 52px */
  html body nav.bottom-nav.consumer-bottom-nav {
    position: fixed !important;
    left: 8px !important;
    right: 8px !important;
    bottom: max(4px, env(safe-area-inset-bottom)) !important;
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    height: 52px !important;
    min-height: 52px !important;
    max-height: 52px !important;
    margin: 0 !important;
    padding: 4px 6px !important;
    background: rgba(255,255,255,.97) !important;
    border: 1px solid #E7DEDB !important;
    border-radius: 15px !important;
    box-shadow: 0 -2px 10px rgba(32,33,36,.06) !important;
    backdrop-filter: blur(14px) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    z-index: 50 !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button {
    display: grid !important;
    grid-template-rows: 18px 12px !important;
    place-items: center !important;
    gap: 1px !important;
    min-width: 0 !important;
    min-height: 0 !important;
    height: 42px !important;
    margin: 0 !important;
    padding: 2px 4px !important;
    color: #6F6467 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 10px !important;
    font-size: 9px !important;
    line-height: 1 !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button > span {
    font-size: 16px !important;
    line-height: 16px !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button > small {
    display: inline !important;
    margin: 0 !important;
    font-size: 6px !important;
    line-height: 6px !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button.active,
  html body nav.bottom-nav.consumer-bottom-nav > button[aria-current="page"] {
    color: #A71930 !important;
    background: #F8EDEF !important;
  }

  html body #view-cart,
  html body #view-checkout,
  html body #view-product,
  html body #view-restaurant,
  html body #view-orders,
  html body #view-home {
    padding-bottom: calc(66px + env(safe-area-inset-bottom)) !important;
  }
}

/* DELIVERY JURUTI MOBILE V35 END */

/* DELIVERY JURUTI MOBILE V36 START */
@media (max-width: 640px) {
  html body nav.bottom-nav.consumer-bottom-nav {
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-width: none !important;
    height: calc(68px + env(safe-area-inset-bottom)) !important;
    min-height: calc(68px + env(safe-area-inset-bottom)) !important;
    max-height: calc(68px + env(safe-area-inset-bottom)) !important;
    margin: 0 !important;
    padding: 5px 8px max(5px, env(safe-area-inset-bottom)) 8px !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    align-items: start !important;
    background: #FFFFFF !important;
    background-image: none !important;
    border-top: 1px solid #E7DEDB !important;
    border-left: 0 !important;
    border-right: 0 !important;
    border-bottom: 0 !important;
    border-radius: 18px 18px 0 0 !important;
    box-shadow: 0 -3px 14px rgba(32,33,36,.08) !important;
    backdrop-filter: blur(14px) !important;
    box-sizing: border-box !important;
    overflow: hidden !important;
    z-index: 100 !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button {
    display: grid !important;
    grid-template-rows: 23px auto !important;
    place-items: center !important;
    align-self: start !important;
    gap: 2px !important;
    width: 100% !important;
    min-width: 0 !important;
    height: 55px !important;
    min-height: 55px !important;
    max-height: 55px !important;
    margin: 0 !important;
    padding: 4px 5px !important;
    color: #6F6467 !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 12px !important;
    box-shadow: none !important;
    font-size: 12px !important;
    line-height: 1 !important;
    box-sizing: border-box !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button > span {
    font-size: 21px !important;
    line-height: 21px !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button > small {
    display: inline !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 8px !important;
    line-height: 8px !important;
  }

  html body nav.bottom-nav.consumer-bottom-nav > button.active,
  html body nav.bottom-nav.consumer-bottom-nav > button[aria-current="page"] {
    color: #A71930 !important;
    background: #F8EDEF !important;
    box-shadow: none !important;
  }

  html body #view-cart,
  html body #view-checkout,
  html body #view-product,
  html body #view-restaurant,
  html body #view-orders,
  html body #view-home,
  html body #view-profile {
    padding-bottom: calc(80px + env(safe-area-inset-bottom)) !important;
  }
}
/* DELIVERY JURUTI MOBILE V36 END */

/* CHECKOUT PAYMENT REQUIRED V37 CSS START */
#view-checkout .consumer-sticky-action:disabled,
#view-checkout .consumer-sticky-action[aria-disabled="true"] {
  color: #A79EA0 !important;
  -webkit-text-fill-color: #A79EA0 !important;
  background: #E9E3E1 !important;
  background-image: none !important;
  border-color: #E2DAD8 !important;
  box-shadow: none !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  transform: none !important;
}

#view-checkout .consumer-sticky-action:not(:disabled) {
  cursor: pointer !important;
}
/* CHECKOUT PAYMENT REQUIRED V37 CSS END */

/* BRANDING DELIVERY JURUTI V39 START */
.footer-brand > div > span {
  display: block !important;
  color: var(--dj-text-secondary, #6f6467) !important;
}

.brand-wordmark small {
  display: block !important;
  color: var(--dj-text-secondary, #6f6467) !important;
}
/* BRANDING DELIVERY JURUTI V39 END */

/* Queridinhos - número da posição branco */
.highlight-position {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}


/* ==================================================
   LOGIN GERENCIADOR - TEXTOS BRANCOS
   ================================================== */

#view-admin-login .admin-login-presentation h1,
#view-admin-login .admin-login-presentation p,
#view-admin-login .admin-login-presentation strong,
#view-admin-login .admin-login-presentation small,
#view-admin-login .admin-login-presentation span {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
}

#view-admin-login .admin-login-presentation .eyebrow {
    color: #ffffff !important;
    -webkit-text-fill-color: #ffffff !important;
    opacity: 1 !important;
}


/* Botão Voltar - padrão Delivery Juruti */
.back-button {
    color: #8e1f2b !important;
    -webkit-text-fill-color: #8e1f2b !important;
}

.back-button:hover {
    color: #701722 !important;
    -webkit-text-fill-color: #701722 !important;
}



/* NOTIFICATION SEGMENTS UI V1 */
.admin-notification-segment-box {
  margin-top: 18px;
  padding: 16px;
  border: 1px solid rgba(142, 31, 43, 0.16);
  border-radius: 16px;
  background: rgba(142, 31, 43, 0.035);
}
.admin-notification-segment-field {
  display: grid;
  gap: 8px;
}
.admin-notification-segment-field > span {
  font-size: .9rem;
  font-weight: 800;
  color: var(--dj-primary, #8e1f2b);
}
.admin-notification-segment-field select {
  width: 100%;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid rgba(142, 31, 43, 0.24);
  border-radius: 12px;
  background: #fff;
  color: #20191b;
  font: inherit;
  font-weight: 650;
  outline: none;
}
.admin-notification-segment-field select:focus {
  border-color: var(--dj-primary, #8e1f2b);
  box-shadow: 0 0 0 3px rgba(142, 31, 43, 0.10);
}
.admin-notification-segment-help {
  display: block;
  margin-top: 8px;
  color: #756a6d;
  line-height: 1.45;
}
.admin-notification-recipient-preview {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 4px 16px;
  align-items: center;
  margin-top: 18px;
  padding: 16px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid rgba(142, 31, 43, 0.16);
}
.admin-notification-recipient-preview > span {
  font-size: .82rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: #756a6d;
}
.admin-notification-recipient-preview > strong {
  grid-row: 1 / span 2;
  grid-column: 2;
  min-width: 44px;
  text-align: right;
  font-size: 1.7rem;
  line-height: 1;
  color: var(--dj-primary, #8e1f2b);
}
.admin-notification-recipient-preview > small {
  grid-column: 1;
  color: #756a6d;
  line-height: 1.4;
}
@media (max-width: 640px) {
  .admin-notification-segment-box,
  .admin-notification-recipient-preview {
    padding: 14px;
  }
}
