/* Cazamba primitives — token-only, mode-aware. Marketing visuals == styleguide. */
.cz-btn{font-family:var(--cz-font-display);font-weight:600;font-size:var(--cz-fs-sm);letter-spacing:.12em;
  text-transform:uppercase;border-radius:var(--cz-rounded-pill);padding:14px 28px;border:1px solid transparent;
  cursor:pointer;display:inline-flex;align-items:center;gap:8px;
  transition:all var(--cz-mode-duration) var(--cz-mode-ease)}
.cz-btn--primary{background:var(--cz-orange);color:var(--cz-on-primary)}
.cz-btn--primary:hover{background:var(--cz-orange-600);box-shadow:var(--cz-mode-cta-glow)}
.cz-btn--secondary{background:transparent;color:var(--cz-text);border-color:var(--cz-border-strong)}
.cz-btn--secondary:hover{border-color:var(--cz-text);background:var(--cz-surface-glass)}
.cz-btn--ghost{background:var(--cz-surface-glass);color:var(--cz-text);border-color:var(--cz-border)}
.cz-btn--ghost:hover{border-color:var(--cz-border-strong)}
.cz-btn:focus-visible{outline:2px solid var(--cz-focus);outline-offset:2px}
/* Small size */
.cz-btn--sm{padding:8px 16px;font-size:var(--cz-fs-2xs)}
/* Disabled — suppress hover glow; pointer-events kept so cursor:not-allowed is visible */
.cz-btn[disabled],.cz-btn:disabled{opacity:.45;cursor:not-allowed}
.cz-btn--primary[disabled]:hover,.cz-btn--primary:disabled:hover{background:var(--cz-orange);box-shadow:none}
.cz-btn--secondary[disabled]:hover,.cz-btn--secondary:disabled:hover{border-color:var(--cz-border-strong);background:transparent}
.cz-btn--ghost[disabled]:hover,.cz-btn--ghost:disabled:hover{border-color:var(--cz-border)}
/* Danger — destructive fill button, parallel to primary */
.cz-btn--danger{background:var(--cz-danger);color:var(--cz-text)}
.cz-btn--danger:hover{background:color-mix(in srgb, var(--cz-danger) 88%, var(--cz-ink));box-shadow:none}
.cz-btn--danger[disabled]:hover,.cz-btn--danger:disabled:hover{background:var(--cz-danger);box-shadow:none}
/* Link — text-only low-emphasis action; not a pill */
.cz-btn--link{background:transparent;border-color:transparent;color:var(--cz-text-subtle);padding-left:0;padding-right:0;letter-spacing:normal;text-transform:none}
.cz-btn--link:hover{color:var(--cz-text);text-decoration:underline;background:transparent}
.cz-btn--link[disabled]:hover,.cz-btn--link:disabled:hover{color:var(--cz-text-subtle);text-decoration:none;background:transparent}

.cz-card{background:var(--cz-surface);border:1px solid var(--cz-border);
  border-radius:var(--cz-mode-panel-radius);padding:var(--cz-mode-pad);
  transition:border-color var(--cz-mode-duration) var(--cz-mode-ease)}
.cz-card--glass{background:var(--cz-mode-panel-bg);box-shadow:var(--cz-mode-panel-shadow);
  backdrop-filter:var(--cz-mode-panel-blur);-webkit-backdrop-filter:var(--cz-mode-panel-blur)}

.cz-badge{display:inline-flex;align-items:center;gap:7px;font-size:var(--cz-fs-xs);font-weight:500;
  background:var(--cz-surface-glass);border:1px solid var(--cz-border);
  border-radius:var(--cz-rounded-pill);padding:5px 13px;color:var(--cz-text)}
/* Solid filled badge variant — uses orange by default */
.cz-badge--solid{background:var(--cz-orange);color:var(--cz-on-primary);border-color:transparent}
/* Tone variants — 40% border tint, 12% fill tint, tone-colored text */
.cz-badge--info{color:var(--cz-info);border-color:color-mix(in srgb, var(--cz-info) 40%, transparent);background:color-mix(in srgb, var(--cz-info) 12%, transparent)}
.cz-badge--success{color:var(--cz-success);border-color:color-mix(in srgb, var(--cz-success) 40%, transparent);background:color-mix(in srgb, var(--cz-success) 12%, transparent)}
.cz-badge--warning{color:var(--cz-warning);border-color:color-mix(in srgb, var(--cz-warning) 40%, transparent);background:color-mix(in srgb, var(--cz-warning) 12%, transparent)}
.cz-badge--danger{color:var(--cz-danger);border-color:color-mix(in srgb, var(--cz-danger) 40%, transparent);background:color-mix(in srgb, var(--cz-danger) 12%, transparent)}
.cz-dot{width:8px;height:8px;border-radius:50%;display:inline-block}

.cz-field{display:flex;flex-direction:column;gap:8px;max-width:340px}
.cz-field label{font-family:var(--cz-font-display);font-weight:600;font-size:var(--cz-fs-2xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--cz-text-muted)}
.cz-field input{background:var(--cz-surface-glass);border:1px solid var(--cz-border);
  border-radius:var(--cz-rounded-md);padding:12px 16px;color:var(--cz-text);
  font-family:var(--cz-font-body);font-size:15px;outline:none;
  transition:border-color var(--cz-mode-duration) var(--cz-mode-ease),box-shadow var(--cz-mode-duration)}
.cz-field input::placeholder{color:var(--cz-text-subtle)}
.cz-field input:focus{border-color:var(--cz-orange);box-shadow:0 0 0 3px var(--cz-focus-glow)}
/* Error state */
.cz-field--error input{border-color:var(--cz-danger)}
/* Hint text below field */
.cz-field__hint{font-size:var(--cz-fs-xs);color:var(--cz-text-muted)}
.cz-field__hint--error{color:var(--cz-danger)}
/* Disabled input */
.cz-field input:disabled{opacity:.45;cursor:not-allowed}
/* Focused demo helper (static preview only) */
.cz-field--focused input{border-color:var(--cz-orange)}

.cz-stat{display:flex;flex-direction:column;gap:12px}
.cz-stat__num{font:700 40px/1 var(--cz-font-display);font-variant-numeric:tabular-nums}
.cz-stat__num--o{color:var(--cz-orange-strong)} .cz-stat__num--w{color:var(--cz-text)}
.cz-stat__lbl{font-family:var(--cz-font-display);font-weight:600;font-size:var(--cz-fs-xs);letter-spacing:.1em;
  text-transform:uppercase;color:var(--cz-text-muted);line-height:1.35}

.cz-icon{width:var(--cz-icon-md);height:var(--cz-icon-md);display:inline-block;flex-shrink:0;vertical-align:middle;color:inherit}
.cz-icon--sm{width:var(--cz-icon-sm);height:var(--cz-icon-sm)}
.cz-icon--lg{width:var(--cz-icon-lg);height:var(--cz-icon-lg)}

.cz-navbar{display:flex;align-items:center;gap:20px;height:68px;padding:0 24px;
  --cz-text:var(--cz-white);--cz-text-muted:var(--cz-neutral-gray-muted);--cz-text-subtle:var(--cz-neutral-gray-subtle);
  --cz-border:var(--cz-dark-border);--cz-border-strong:var(--cz-dark-border-strong);
  background:var(--cz-navbar-bg);backdrop-filter:blur(var(--cz-blur-glass));
  -webkit-backdrop-filter:blur(var(--cz-blur-glass));border-bottom:1px solid var(--cz-border)}

/* ── Blueprint frame: dashed border + ink→navy gradient + orange corner marks.
      Extraído de marketing-stat-band; reutilizável em decks e faixas. Co-aplique
      junto de radius/flex específicos do componente. ── */
.cz-blueprint-bg{position:relative;background:linear-gradient(120deg,var(--cz-ink),var(--cz-navy));border:1px dashed var(--cz-border-strong);overflow:hidden}
.cz-blueprint-bg::before,.cz-blueprint-bg::after{content:'';position:absolute;width:16px;height:16px;border-color:var(--cz-orange);border-style:solid;pointer-events:none;z-index:1}
.cz-blueprint-bg::before{top:-1px;left:-1px;border-width:2px 0 0 2px}
.cz-blueprint-bg::after{bottom:-1px;right:-1px;border-width:0 2px 2px 0}

/* ── Vertical rotated label (blueprint rail / scene label). Extraído de
      .cz-stat-band__rail-label — mecânica de rotação + tipografia de label. ── */
.cz-vertical-label{font-family:var(--cz-font-display);font-weight:600;font-size:var(--cz-fs-3xs);letter-spacing:var(--cz-tracking-label);text-transform:uppercase;color:var(--cz-text-subtle);white-space:nowrap;writing-mode:vertical-rl;transform:rotate(180deg);line-height:1.2}

/* ── Print helper genérico: preserva fundos/gradientes e oculta chrome marcado
      com [data-print-hide]. O @page/size fica a cargo de cada peça (deck: 1920×1080;
      proposta: A4). ── */
@media print {
  :root, body { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  [data-print-hide] { display: none !important; }
}
