/* NowDev UI v1.3.1 — revisão sistêmica ND133: hierarquia visual, contenção e PDV. */
:root {
  --nd-card-bg: linear-gradient(155deg, #fafdff 0%, #f2f7fe 58%, #eaf2fc 100%);
  --nd-card-bg-strong: linear-gradient(155deg, #f2f8ff 0%, #e7f1fc 100%);
  --nd-field-bg: #ffffff;
  --nd-inset-bg: #eaf2fb;
  --nd-card-line: #dce7f3;
  --nd-card-shadow: 0 14px 38px rgba(25, 56, 104, .075);
  --nd-card-shadow-hover: 0 20px 48px rgba(25, 56, 104, .11);
}

html[data-theme="dark"] {
  --nd-card-bg: linear-gradient(155deg, #142137 0%, #111c2e 62%, #101a2b 100%);
  --nd-card-bg-strong: linear-gradient(155deg, #182942 0%, #13223a 100%);
  --nd-field-bg: #0e192b;
  --nd-inset-bg: #0d1829;
  --nd-card-line: #293a55;
  --nd-card-shadow: 0 16px 42px rgba(0, 0, 0, .24);
  --nd-card-shadow-hover: 0 22px 56px rgba(0, 0, 0, .32);
}

.register-brand-inline { gap: 10px; }
.register-brand-inline img,
.register-brand-inline--hero img { width: 68px !important; height: 60px !important; object-fit: contain; }
.register-brand-inline::after {
  content: "NowBusiness";
  color: var(--nd-ink);
  font: 800 clamp(20px, 2.4vw, 28px)/1 Montserrat,system-ui,sans-serif;
  letter-spacing: -.7px;
}

/* Contenção universal: nenhum filho pode alargar cards, grades ou formulários. */
.nf-redesign :where(
  .content,.page-stack,.grid,.grid-2,.grid-3,.grid-4,.nb-split,.card,.panel,
  .metric-card,.card-header,.card-head,.module-hero,.dashboard-hero,.page-header,
  form,fieldset,label,.form-stack,.form-grid-2,.form-grid-3,.form-grid-4,.button-row,
  .table-wrap,.list-row,.nb-list-row,.nb-row-actions,.commerce-admin,.commerce-editor-grid
) { min-width: 0 !important; max-width: 100%; }

.nf-redesign :where(h1,h2,h3,h4,p,small,strong,span,a,button,label,legend,td,th,code) {
  overflow-wrap: anywhere;
}

.nf-redesign :where(img,svg,video,canvas,iframe) {
  max-width: 100% !important;
}

.nf-redesign :where(input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),select,textarea) {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.nf-redesign pre {
  max-width: 100%;
  overflow: auto;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* O cabeçalho de página segue a base oficial: título sobre o fundo, sem card vazio. */
.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) {
  min-height: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  justify-content: space-between !important;
  flex-wrap: wrap;
  gap: 18px !important;
  margin: 0 0 2px !important;
  padding: 4px 0 12px !important;
  overflow: visible !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: var(--nd-text) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header)::before,
.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header)::after {
  display: none !important;
}

.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) > div:first-child {
  flex: 1 1 540px;
  max-width: 900px !important;
}

.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) :where(h1,h2) {
  margin: 0 !important;
  color: var(--nd-ink) !important;
  font-size: clamp(27px, 2.35vw, 36px) !important;
  font-weight: 780 !important;
  line-height: 1.12 !important;
  letter-spacing: -.85px !important;
  text-shadow: none !important;
  -webkit-text-stroke: 0 !important;
  opacity: 1 !important;
}

.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) :where(.muted,p:not(.page-kicker)) {
  margin: 8px 0 0 !important;
  color: var(--nd-muted) !important;
  line-height: 1.65 !important;
}

.nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) .page-kicker {
  color: var(--nd-cyan) !important;
}

.nf-redesign .intelligent-hero .hero-metric-stack {
  flex: 0 1 360px;
  width: min(100%, 360px);
  min-width: 0 !important;
}

.nf-redesign .intelligent-hero :where(.smart-highlight-card,.business-health-gauge) {
  color: var(--nd-text) !important;
  border: 1px solid var(--nd-card-line) !important;
  background: var(--nd-card-bg-strong) !important;
  box-shadow: var(--nd-card-shadow) !important;
}

.nf-redesign .intelligent-hero :where(.smart-highlight-card,.business-health-gauge) :where(span,small) { color: var(--nd-muted) !important; }
.nf-redesign .intelligent-hero :where(.smart-highlight-card,.business-health-gauge) strong { color: var(--nd-ink) !important; }

/* Cards têm profundidade e função visual; superfícies internas são distintas. */
.nf-redesign :where(.card,.panel,.metric-card,.account-card,.taxonomy-card,.goal-tile,.notification-card,.plan-card,.module-tile) {
  position: relative;
  max-width: 100% !important;
  overflow: hidden;
  border: 1px solid var(--nd-card-line) !important;
  border-radius: 22px !important;
  color: var(--nd-text) !important;
  background: var(--nd-card-bg) !important;
  box-shadow: var(--nd-card-shadow) !important;
}

.nf-redesign :where(.card,.panel,.metric-card)::before {
  display: none !important;
}

.nf-redesign :where(.card,.panel,.metric-card) :where(.card,.panel) {
  background: var(--nd-card-bg-strong) !important;
  box-shadow: none !important;
}

.nf-redesign .metric-card {
  min-height: 124px;
  background:
    radial-gradient(circle at 95% 8%, color-mix(in srgb, var(--nd-primary) 10%, transparent), transparent 38%),
    var(--nd-card-bg) !important;
}

.nf-redesign .metric-card.accent-blue { box-shadow: inset 0 3px 0 var(--nd-primary), var(--nd-card-shadow) !important; }
.nf-redesign .metric-card.accent-green { box-shadow: inset 0 3px 0 var(--nd-success), var(--nd-card-shadow) !important; }
.nf-redesign .metric-card.accent-red { box-shadow: inset 0 3px 0 var(--nd-danger), var(--nd-card-shadow) !important; }
.nf-redesign .metric-card.accent-violet { box-shadow: inset 0 3px 0 var(--nd-violet), var(--nd-card-shadow) !important; }
.nf-redesign .metric-card.accent-yellow { box-shadow: inset 0 3px 0 var(--nd-warning), var(--nd-card-shadow) !important; }

@media (hover:hover) {
  .nf-redesign :where(.card,.panel,.metric-card):hover {
    border-color: color-mix(in srgb, var(--nd-primary) 24%, var(--nd-card-line)) !important;
    box-shadow: var(--nd-card-shadow-hover) !important;
  }
}

.nf-redesign :where(.card-header,.card-head,.panel-head) {
  display: flex;
  align-items: flex-start !important;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px !important;
}

.nf-redesign :where(.card-header,.card-head,.panel-head) > div { min-width: 0; }

.nf-redesign :where(.empty-state,.empty-mini,.commerce-empty,.pdv-cart-empty) {
  border-color: var(--nd-card-line) !important;
  background: var(--nd-inset-bg) !important;
}

/* Campos e ações seguem o componente oficial e permanecem dentro do card. */
.nf-redesign input:not([type="checkbox"]):not([type="radio"]):not([type="color"]),
.nf-redesign select,
.nf-redesign textarea {
  border: 1px solid var(--nd-card-line) !important;
  color: var(--nd-text) !important;
  background: var(--nd-field-bg) !important;
}

.nf-redesign input::placeholder,
.nf-redesign textarea::placeholder { color: color-mix(in srgb, var(--nd-muted) 76%, transparent); }

.nf-redesign .input-prefix {
  max-width: 100%;
  background: var(--nd-field-bg) !important;
}

.nf-redesign .input-prefix > span {
  flex: 0 1 auto;
  min-width: 0;
  max-width: 46%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.nf-redesign :where(.button-row,.hero-actions,.commerce-head-actions,.nb-row-actions,.filter-actions,.crm-toolbar) {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 9px;
  min-width: 0;
}

.nf-redesign :where(.button-row,.hero-actions,.commerce-head-actions,.nb-row-actions,.filter-actions,.crm-toolbar) > * {
  min-width: 0;
  max-width: 100%;
}

.nf-redesign .btn {
  max-width: 100%;
  white-space: normal !important;
}

.nf-redesign .btn-outline,
.nf-redesign .btn.ghost,
.nf-redesign .btn-ghost {
  background: var(--nd-field-bg) !important;
}

.nf-redesign .table-wrap {
  width: 100%;
  max-width: 100%;
  overflow-x: auto !important;
  border-radius: 15px;
  scrollbar-width: thin;
}

.nf-redesign .nb-split {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 16px !important;
  align-items: start;
}

.nf-redesign .nb-order-item {
  display: grid;
  grid-template-columns: minmax(180px, 1.35fr) minmax(160px, 1fr) minmax(90px, .42fr) minmax(120px, .58fr) 42px !important;
  gap: 10px;
  align-items: end;
}

.nf-redesign .nb-list-row,
.nf-redesign .list-row {
  max-width: 100%;
  gap: 12px;
}

.nf-redesign .nb-list-row > div:first-child,
.nf-redesign .list-row > div:first-child { min-width: 0; }

.nf-redesign .filter-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)) !important;
  align-items: end;
}

.nf-redesign :where(.commerce-tabs,.business-tabs,.modern-tabs) {
  max-width: 100%;
  overflow-x: auto !important;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

.nf-redesign :where(.commerce-tabs,.business-tabs,.modern-tabs) a { flex: 0 0 auto; white-space: nowrap; }

.nf-redesign .commerce-channel-bar {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
}

.nf-redesign .commerce-channel-bar > label { flex: 1 1 300px; }

.nf-redesign .commerce-popover {
  max-width: min(420px, calc(100vw - 32px)) !important;
}

/* Administração e operação do PDV. */
.pdv-terminal-body {
  min-width: 320px;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 10% 0%, color-mix(in srgb, var(--nd-primary) 7%, transparent), transparent 28%),
    var(--nd-bg) !important;
}

.pdv-workstation > * { min-width: 0; max-width: 100%; }

.pdv-workstation-header,
.pdv-product-panel,
.pdv-cart-panel {
  border-color: var(--nd-card-line) !important;
  background: var(--nd-card-bg) !important;
  box-shadow: var(--nd-card-shadow) !important;
}

.pdv-workstation-grid { align-items: stretch; }

.pdv-workstation--market .pdv-workstation-grid {
  grid-template-columns: minmax(0, 1.3fr) minmax(390px, .7fr);
}

.pdv-scanner-shell {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr) auto;
  align-items: center;
  gap: 13px;
  margin-bottom: 16px;
  padding: 14px;
  border: 1px solid color-mix(in srgb, var(--nd-primary) 32%, var(--nd-card-line));
  border-radius: 19px;
  background: var(--nd-card-bg-strong);
  box-shadow: 0 0 0 5px color-mix(in srgb, var(--nd-primary) 6%, transparent);
}

.pdv-scanner-icon {
  width: 58px;
  height: 58px;
  display: grid;
  place-items: center;
  border-radius: 17px;
  color: #fff;
  background: var(--nd-gradient);
  font-size: 23px;
  font-weight: 850;
}

.pdv-scanner-shell label { display: grid; gap: 6px; min-width: 0; }
.pdv-scanner-shell label > span { color: var(--nd-ink); font-size: 12px; font-weight: 780; }
.pdv-scanner-shell input {
  min-height: 58px;
  padding: 0 16px;
  border: 1px solid var(--nd-card-line);
  border-radius: 14px;
  color: var(--nd-text);
  background: var(--nd-field-bg);
  font: 650 17px Montserrat,system-ui,sans-serif;
  outline: 0;
}
.pdv-scanner-shell input:focus { border-color: #79a5ff; box-shadow: 0 0 0 4px rgba(24,97,241,.11); }
.pdv-scan-feedback { min-width: 126px; color: var(--nd-muted); font-size: 11px; text-align: right; }
.pdv-scan-feedback.is-success { color: var(--nd-success); }
.pdv-scan-feedback.is-error { color: var(--nd-danger); }

.pdv-market-manual-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin: 4px 0 10px;
  color: var(--nd-muted);
  font-size: 11px;
}

.pdv-product-button,
.pdv-cart-row,
.pdv-cart-empty { background: var(--nd-inset-bg) !important; }

.pdv-cart-summary {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 9px;
  margin-top: 12px;
}

.pdv-cart-summary > div {
  padding: 12px;
  border: 1px solid var(--nd-card-line);
  border-radius: 14px;
  background: var(--nd-inset-bg);
}

.pdv-cart-summary span,
.pdv-cart-summary small { display: block; color: var(--nd-muted); font-size: 10px; }
.pdv-cart-summary strong { display: block; margin-top: 4px; color: var(--nd-ink); font-size: 17px; }

.pdv-payment-dialog {
  width: min(560px, calc(100% - 24px));
  max-width: 560px;
  max-height: calc(100dvh - 28px);
  padding: 0;
  overflow: auto;
  border: 1px solid var(--nd-card-line);
  border-radius: 24px;
  color: var(--nd-text);
  background: var(--nd-card-bg);
  box-shadow: 0 28px 90px rgba(5, 18, 38, .32);
}

.pdv-payment-dialog::backdrop { background: rgba(5, 18, 38, .62); backdrop-filter: blur(5px); }
.pdv-payment-dialog > section { padding: 23px; }
.pdv-payment-dialog header { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; }
.pdv-payment-dialog h2 { margin: 2px 0 0; color: var(--nd-ink); font-size: 23px; }
.pdv-payment-total { margin: 18px 0; padding: 16px; border-radius: 17px; color: #fff; background: var(--nd-gradient); }
.pdv-payment-total span { display: block; font-size: 10px; opacity: .82; }
.pdv-payment-total strong { display: block; margin-top: 4px; font-size: 28px; }
.pdv-payment-fields { display: grid; gap: 13px; }
.pdv-payment-fields label { display: grid; gap: 7px; color: var(--nd-text); font-size: 11px; font-weight: 700; }
.pdv-payment-fields :where(input,select) { min-height: 48px; padding: 0 13px; border: 1px solid var(--nd-card-line); border-radius: 13px; color: var(--nd-text); background: var(--nd-field-bg); font: inherit; }
.pdv-payment-actions { display: grid; grid-template-columns: .7fr 1.3fr; gap: 10px; margin-top: 18px; }
.pdv-change-box { padding: 12px; border: 1px solid var(--nd-card-line); border-radius: 13px; background: var(--nd-inset-bg); }
.pdv-change-box span { color: var(--nd-muted); font-size: 10px; }
.pdv-change-box strong { display: block; margin-top: 3px; color: var(--nd-ink); }

/* Cupom do terminal. */
.pdv-receipt-shell { width: min(440px, 100%); margin: 22px auto; }
.pdv-receipt-actions { display: flex; gap: 9px; margin-bottom: 13px; }
.pdv-receipt-actions > * { flex: 1 1 0; }
.pdv-receipt-paper {
  padding: 26px 22px;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  color: #111827;
  background: #fff;
  box-shadow: 0 18px 55px rgba(15, 23, 42, .14);
  font-family: "Courier New",monospace;
}
.pdv-receipt-brand { display: grid; justify-items: center; gap: 7px; text-align: center; }
.pdv-receipt-brand img { width: 58px; height: 58px; object-fit: contain; }
.pdv-receipt-brand h1 { margin: 0; font: 800 18px Montserrat,system-ui,sans-serif; }
.pdv-receipt-brand p { margin: 0; font-size: 11px; }
.pdv-receipt-warning { margin: 16px 0; padding: 10px; border: 2px solid #111827; text-align: center; font-weight: 800; }
.pdv-receipt-meta { display: grid; gap: 4px; font-size: 11px; }
.pdv-receipt-items { width: 100%; min-width: 0; margin: 14px 0; border-collapse: collapse; font-size: 10px; }
.pdv-receipt-items th,.pdv-receipt-items td { padding: 6px 3px; border-bottom: 1px dashed #9ca3af; text-align: left; }
.pdv-receipt-items th:last-child,.pdv-receipt-items td:last-child { text-align: right; }
.pdv-receipt-totals { display: grid; gap: 5px; font-size: 11px; }
.pdv-receipt-totals > div { display: flex; justify-content: space-between; gap: 12px; }
.pdv-receipt-totals .grand { margin-top: 4px; padding-top: 7px; border-top: 2px solid #111827; font-size: 14px; font-weight: 800; }
.pdv-receipt-footer { margin-top: 17px; text-align: center; font-size: 9px; line-height: 1.55; }

@media (max-width: 1240px) {
  .nf-redesign .nb-split,
  .nf-redesign :where(.roles-workspace,.support-layout,.profile-edit-layout) { grid-template-columns: 1fr !important; }
  .pdv-workstation--market .pdv-workstation-grid { grid-template-columns: minmax(0, 1fr) minmax(360px, .8fr); }
}

@media (max-width: 1040px) {
  .nf-redesign .nb-order-item { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .nf-redesign .nb-order-item > .icon-btn { justify-self: end; }
  .pdv-workstation--market .pdv-workstation-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) {
    display: block !important;
    padding: 0 0 8px !important;
  }
  .nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) .hero-actions { margin-top: 15px; }
  .nf-redesign :where(.module-hero,.dashboard-hero,.suite-hero,.support-hero,.intelligent-hero,.page-header) .hero-actions > * { flex: 1 1 100%; }
  .nf-redesign :where(.form-grid-2,.form-grid-3,.form-grid-4) { grid-template-columns: 1fr !important; }
  .nf-redesign .nb-order-item { grid-template-columns: 1fr !important; }
  .nf-redesign :where(.nb-list-row,.list-row) { align-items: flex-start; flex-direction: column; }
  .nf-redesign :where(.nb-list-row,.list-row) > :last-child { align-self: flex-start; }
  .pdv-scanner-shell { grid-template-columns: 46px minmax(0, 1fr); padding: 11px; }
  .pdv-scanner-icon { width: 46px; height: 46px; border-radius: 14px; font-size: 19px; }
  .pdv-scan-feedback { grid-column: 1 / -1; min-width: 0; text-align: left; }
  .pdv-payment-dialog > section { padding: 18px; }
  .pdv-payment-actions { grid-template-columns: 1fr; }
}

@media (max-width: 460px) {
  .pdv-workstation-actions .pdv-help-menu { display: none; }
  .pdv-cart-summary { grid-template-columns: 1fr; }
  .pdv-receipt-actions { flex-direction: column; }
}

@media print {
  @page { size: 80mm auto; margin: 4mm; }
  .pdv-terminal-body { min-width: 0; background: #fff !important; }
  .pdv-receipt-shell { width: 72mm; margin: 0; }
  .pdv-receipt-actions,.pdv-terminal-body > .flash { display: none !important; }
  .pdv-receipt-paper { padding: 0; border: 0; border-radius: 0; box-shadow: none; }
}