/* =====================================================================
   ExtrusaLab — camada visual sobre o Tabler, seguindo o Manual de Marca & Design System v1.0
   Tipografia: Plus Jakarta Sans (interface e marca) + JetBrains Mono (gramas, kWh, horas e R$).
   Cores: degradê térmico Violeta → Magenta → Coral → Laranja; superfícies Carbon/Slate (tema escuro é o padrão).
   Liquid glass: intensidade regulada pelo admin master (0 = chapado, 1 = vidro máximo) via --glass-* (theme.js).
   ===================================================================== */

:root {
  /* Cores da marca (stops do degradê térmico) */
  --xl-purple-deep: #53257E;
  --xl-purple: #5B2A86;
  --xl-magenta: #A83885;
  --xl-coral: #F15362;
  --xl-orange: #FFA149;
  --xl-grad: linear-gradient(35deg, #5B2A86 0%, #A83885 38%, #F15362 76%, #FF8C46 100%);
  --xl-grad-hover: linear-gradient(35deg, #6E3494 0%, #B83B82 40%, #F65B5E 78%, #FFA149 100%);
  --xl-grad-subtle: linear-gradient(135deg, rgba(91, 42, 134, .18) 0%, rgba(241, 83, 98, .14) 55%, rgba(255, 161, 73, .18) 100%);
  --xl-grad-bars: linear-gradient(180deg, #FF9248 0%, #F15463 36%, #A13786 72%, #53257E 100%);
  /* Status (feedback do ERP) */
  --xl-success: #10B981; --xl-success-bg: rgba(16, 185, 129, .12);
  --xl-warning: #F59E0B; --xl-warning-bg: rgba(245, 158, 11, .12);
  --xl-danger: #EF4444;  --xl-danger-bg: rgba(239, 68, 68, .12);
  --xl-info: #3B82F6;    --xl-info-bg: rgba(59, 130, 246, .12);
  /* Tipografia */
  --xl-font-sans: "Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, sans-serif;
  --xl-font-mono: "JetBrains Mono", monospace;
  /* Espaçamento (base 4/8) e raios */
  --xl-space-1: 4px; --xl-space-2: 8px; --xl-space-3: 12px; --xl-space-4: 16px; --xl-space-5: 20px;
  --xl-space-6: 24px; --xl-space-8: 32px; --xl-space-10: 40px; --xl-space-12: 48px; --xl-space-16: 64px;
  --xl-radius-xs: 4px; --xl-radius-sm: 6px; --xl-radius-md: 10px; --xl-radius-lg: 14px; --xl-radius-xl: 20px; --xl-radius-full: 9999px;
  --xl-glow: 0 8px 28px rgba(241, 83, 98, .28);
  --xl-focus: #F15362;
  --xl-sidebar: 260px;

  /* Liquid glass — valores padrão (nível 60); o theme.js recalcula conforme o admin master */
  --glass: .6;
  --glass-opacity: 75%;
  --glass-blur: 16px;
  --glass-sat: 148%;
  --glass-shine: .08;
  --glass-edge: .1;
  --glass-glow: .6;
}

/* ---------- Tema escuro (padrão do ERP) ---------- */
:root,
[data-bs-theme="dark"] {
  --xl-canvas: #141619;
  --xl-bg: #1F2126;
  --xl-surface: #282B32;
  --xl-elevated: #30343D;
  --xl-border: #343842;
  --xl-border-subtle: rgba(255, 255, 255, .07);
  --xl-text: #FFFFFF;
  --xl-text-2: #C8CDD5;
  --xl-muted: #8A93A2;
  --xl-accent: #F15362;        /* acento de interface (foco, ícone ativo, destaques) */
  --xl-accent-text: #FFA149;   /* texto de destaque sobre fundo escuro (pills de marca) */
  --xl-shadow-sm: 0 2px 6px rgba(11, 12, 14, .25);
  --xl-shadow-md: 0 8px 24px rgba(11, 12, 14, .38);
  --xl-shadow-lg: 0 16px 40px rgba(11, 12, 14, .55);
  --xl-shine-rgb: 255, 255, 255;

  --tblr-primary: #F15362;
  --tblr-primary-rgb: 241, 83, 98;
  --tblr-primary-fg: #FFFFFF;
  --tblr-primary-lt: rgba(241, 83, 98, .14);
  --tblr-link-color: #FFA149;
  --tblr-link-color-rgb: 255, 161, 73;
  --tblr-link-hover-color: #FFB46E;
  --tblr-body-bg: var(--xl-bg);
  --tblr-body-color: var(--xl-text);
  --tblr-emphasis-color: var(--xl-text);
  --tblr-heading-color: var(--xl-text);
  --tblr-secondary: var(--xl-text-2);
  --tblr-secondary-color: var(--xl-text-2);
  --tblr-muted: var(--xl-muted);
  --tblr-bg-surface: var(--xl-surface);
  --tblr-bg-surface-secondary: var(--xl-elevated);
  --tblr-bg-surface-tertiary: var(--xl-canvas);
  --tblr-bg-forms: var(--xl-bg);
  --tblr-border-color: var(--xl-border);
  --tblr-border-color-translucent: var(--xl-border-subtle);
  --tblr-dark: var(--xl-canvas);

  /* nomes antigos usados pelos componentes */
  --p3-ink: var(--xl-text);
  --p3-plate: var(--xl-bg);
  --p3-accent: var(--xl-accent);
  --p3-orange: var(--xl-orange);
  --p3-magenta: var(--xl-magenta);
  --p3-grid: var(--xl-border-subtle);
  --p3-glass: color-mix(in srgb, var(--xl-surface) var(--glass-opacity), transparent);
  --p3-glass-border: color-mix(in srgb, var(--xl-border) calc(100% - var(--glass) * 45%), rgba(255, 255, 255, .5));
  --p3-glass-edge: var(--xl-border);
  --p3-shadow: inset 0 1px 0 rgba(var(--xl-shine-rgb), var(--glass-shine)), var(--xl-shadow-md);
  color-scheme: dark;
}

/* ---------- Tema claro (secundário / impressão / documentos) ---------- */
[data-bs-theme="light"] {
  --xl-canvas: #F8FAFC;
  --xl-bg: #F8FAFC;
  --xl-surface: #FFFFFF;
  --xl-elevated: #FFFFFF;
  --xl-border: #E2E8F0;
  --xl-border-subtle: rgba(15, 23, 42, .06);
  --xl-text: #0F172A;
  --xl-text-2: #475569;
  --xl-muted: #475569;
  --xl-accent: #A83885;        /* magenta: legível em texto pequeno sobre branco (6:1) */
  --xl-accent-text: #A83885;
  --xl-shadow-sm: 0 2px 6px rgba(15, 23, 42, .06);
  --xl-shadow-md: 0 8px 24px rgba(15, 23, 42, .08);
  --xl-shadow-lg: 0 16px 40px rgba(15, 23, 42, .12);
  --xl-shine-rgb: 255, 255, 255;

  --tblr-primary: #A83885;
  --tblr-primary-rgb: 168, 56, 133;
  --tblr-primary-fg: #FFFFFF;
  --tblr-primary-lt: rgba(168, 56, 133, .1);
  --tblr-link-color: #A83885;
  --tblr-link-color-rgb: 168, 56, 133;
  --tblr-link-hover-color: #5B2A86;
  --tblr-body-bg: var(--xl-bg);
  --tblr-body-color: var(--xl-text);
  --tblr-emphasis-color: var(--xl-text);
  --tblr-heading-color: var(--xl-text);
  --tblr-secondary: var(--xl-text-2);
  --tblr-secondary-color: var(--xl-text-2);
  --tblr-muted: var(--xl-muted);
  --tblr-bg-surface: var(--xl-surface);
  --tblr-bg-surface-secondary: #F1F5F9;
  --tblr-bg-surface-tertiary: var(--xl-canvas);
  --tblr-bg-forms: #FFFFFF;
  --tblr-border-color: var(--xl-border);
  --tblr-border-color-translucent: var(--xl-border-subtle);

  --p3-ink: var(--xl-text);
  --p3-plate: var(--xl-bg);
  --p3-accent: var(--xl-accent);
  --p3-grid: var(--xl-border-subtle);
  --p3-glass: color-mix(in srgb, var(--xl-surface) var(--glass-opacity), transparent);
  --p3-glass-border: color-mix(in srgb, var(--xl-border) calc(100% - var(--glass) * 60%), rgba(255, 255, 255, .9));
  --p3-glass-edge: var(--xl-border);
  --p3-shadow: inset 0 1px 0 rgba(var(--xl-shine-rgb), calc(var(--glass-shine) * 6)), var(--xl-shadow-md);
  color-scheme: light;
}

/* Status do Tabler com as cores semânticas da marca */
:root, [data-bs-theme="dark"], [data-bs-theme="light"] {
  --tblr-green: var(--xl-success); --tblr-green-rgb: 16, 185, 129; --tblr-success: var(--xl-success); --tblr-success-rgb: 16, 185, 129;
  --tblr-yellow: var(--xl-warning); --tblr-yellow-rgb: 245, 158, 11; --tblr-warning: var(--xl-warning); --tblr-warning-rgb: 245, 158, 11;
  --tblr-red: var(--xl-danger); --tblr-red-rgb: 239, 68, 68; --tblr-danger: var(--xl-danger); --tblr-danger-rgb: 239, 68, 68;
  --tblr-blue: var(--xl-info); --tblr-blue-rgb: 59, 130, 246; --tblr-info: var(--xl-info); --tblr-info-rgb: 59, 130, 246;
  --tblr-font-sans-serif: var(--xl-font-sans);
  --tblr-font-monospace: var(--xl-font-mono);
  --tblr-body-font-family: var(--xl-font-sans);
  --tblr-body-font-size: .9375rem;     /* Body default: 15px */
  --tblr-body-line-height: 1.55;
  --tblr-body-font-weight: 400;
  --tblr-border-radius: var(--xl-radius-sm);
  --tblr-border-radius-sm: var(--xl-radius-xs);
  --tblr-border-radius-lg: var(--xl-radius-md);
  --tblr-border-radius-xl: var(--xl-radius-lg);
  --tblr-border-radius-pill: var(--xl-radius-full);
  --tblr-focus-ring-color: rgba(241, 83, 98, .25);
}

/* Acessibilidade: quem pede menos transparência no sistema recebe a versão chapada */
@media (prefers-reduced-transparency: reduce) {
  :root { --glass: 0 !important; --glass-opacity: 100% !important; --glass-blur: 0px !important; --glass-sat: 100% !important; --glass-shine: 0 !important; --glass-glow: 0 !important; }
}

/* ---------- Fundo ---------- */
html { background-color: var(--xl-bg); }
body {
  background-color: transparent;
  font-family: var(--xl-font-sans);
  font-size: .9375rem;
  line-height: 1.55;
  color: var(--xl-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
/* Brilho de marca atrás do vidro (o mesmo do hero do manual); some no modo chapado */
body::before {
  content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: var(--glass-glow);
  background:
    radial-gradient(46rem 46rem at 105% -12%, rgba(241, 83, 98, .16) 0%, rgba(91, 42, 134, .08) 50%, transparent 70%),
    radial-gradient(40rem 40rem at -12% 112%, rgba(91, 42, 134, .2) 0%, rgba(168, 56, 133, .06) 50%, transparent 70%),
    radial-gradient(30rem 24rem at 55% 45%, rgba(255, 161, 73, .05) 0%, transparent 70%);
}
[data-bs-theme="light"] body::before { opacity: calc(var(--glass-glow) * .7); }
::selection { background: var(--xl-coral); color: #FFFFFF; }

/* ---------- Escala tipográfica ---------- */
h1, h2, h3, h4, h5, h6 { font-family: var(--xl-font-sans); color: var(--xl-text); }
.display-font, .xl-display { font-size: 2.25rem; font-weight: 800; line-height: 1.15; letter-spacing: -.03em; }      /* Display 36px */
h1, .h1, .page-title { font-size: 1.75rem; font-weight: 700; line-height: 1.25; letter-spacing: -.02em; }           /* H1 28px */
h2, .h2 { font-size: 1.25rem; font-weight: 700; line-height: 1.35; letter-spacing: -.01em; }                        /* H2 20px */
h3, .h3, .card-title { font-size: 1.0625rem; font-weight: 700; line-height: 1.35; letter-spacing: -.01em; }
h4, .h4 { font-size: .9375rem; font-weight: 700; line-height: 1.4; }
.xl-label, .subheader { font-size: .75rem; font-weight: 600; line-height: 1.4; letter-spacing: .08em; text-transform: uppercase; color: var(--xl-muted); }
.form-label { font-size: .8rem; font-weight: 600; color: var(--xl-text-2); margin-bottom: 6px; }
.text-secondary { color: var(--xl-text-2) !important; }
.text-muted { color: var(--xl-muted) !important; }
strong, b { font-weight: 700; }
/* Números (R$, gramas, kWh, horas): JetBrains Mono tabular */
.num, .font-mono, code, kbd, pre, .kpi-value, input[type="number"], td.text-end, .text-end > .num, .badge, .xl-pill { font-family: var(--xl-font-mono); font-variant-numeric: tabular-nums; }
code { color: var(--xl-accent-text); font-size: .85em; }
a { color: var(--tblr-link-color); }

/* ---------- Liquid glass ---------- */
.glass,
.card,
.navbar-glass,
.modal-content,
.dropdown-menu {
  background:
    linear-gradient(180deg, rgba(var(--xl-shine-rgb), var(--glass-shine)) 0%, transparent 38%),
    var(--p3-glass) !important;
  backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat));
  border: 1px solid var(--p3-glass-border) !important;
  box-shadow: var(--p3-shadow);
}
.card { border-radius: var(--xl-radius-lg); }
.card .card-header { background: transparent; border-bottom-color: var(--xl-border-subtle); }
.card .card-footer { background: transparent; border-top-color: var(--xl-border-subtle); }
.card:hover { border-color: color-mix(in srgb, var(--p3-glass-border) 70%, rgba(255, 255, 255, .16)) !important; }
.modal-content, .dropdown-menu { --p3-glass: color-mix(in srgb, var(--xl-elevated) calc(var(--glass-opacity) + 12%), transparent); }
.table { --tblr-table-bg: transparent; --tblr-table-border-color: var(--xl-border-subtle); }
.table thead th { font-family: var(--xl-font-sans); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--xl-muted); background: transparent; }
.table thead th.text-end { font-family: var(--xl-font-sans); }

@supports not (backdrop-filter: blur(1px)) {
  .glass, .card, .navbar-glass, .modal-content { background: var(--xl-surface) !important; }
}

/* ---------- Botões ---------- */
.btn {
  --tblr-btn-font-weight: 700;
  --tblr-btn-border-radius: var(--xl-radius-sm);
  font-family: var(--xl-font-sans); font-weight: 700; border-radius: var(--xl-radius-sm);
  transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease, color .2s ease;
}
.btn:not(.btn-primary):not(.btn-ghost-secondary):not(.btn-ghost-primary):not([class*="btn-outline"]):not(.btn-link):not(.btn-dark):not(.btn-apple):not(.btn-danger):not(.btn-success):not(.btn-warning):not(.btn-close) {
  --tblr-btn-bg: var(--xl-surface); --tblr-btn-color: var(--xl-text); --tblr-btn-border-color: var(--xl-border);
  --tblr-btn-hover-bg: var(--xl-elevated); --tblr-btn-hover-border-color: var(--xl-muted); --tblr-btn-hover-color: var(--xl-text);
  --tblr-btn-active-bg: var(--xl-elevated); --tblr-btn-active-border-color: var(--xl-muted);
}
[data-bs-theme="light"] .btn:not(.btn-primary):not(.btn-ghost-secondary):not(.btn-ghost-primary):not([class*="btn-outline"]):not(.btn-link):not(.btn-dark):not(.btn-apple):not(.btn-danger):not(.btn-success):not(.btn-warning):not(.btn-close) {
  --tblr-btn-hover-bg: #F1F5F9; --tblr-btn-active-bg: #F1F5F9; --tblr-btn-hover-border-color: #CBD5E1;
}
/* Ação principal: degradê oficial + glow de marca */
.btn-primary {
  --tblr-btn-color: #FFFFFF; --tblr-btn-hover-color: #FFFFFF; --tblr-btn-active-color: #FFFFFF; --tblr-btn-disabled-color: #FFFFFF;
  --tblr-btn-border-color: transparent; --tblr-btn-hover-border-color: transparent; --tblr-btn-active-border-color: transparent;
  background: var(--xl-grad) !important; border-color: transparent !important; color: #FFFFFF !important; box-shadow: var(--xl-glow);
}
.btn-primary:hover, .btn-primary:focus-visible { background: var(--xl-grad-hover) !important; transform: translateY(-1px); }
.btn-primary:active { transform: none; }
/* Empresa com cor própria: botão principal na cor dela (sem o degradê da ExtrusaLab) */
.xl-custom-primary .btn-primary, .xl-custom-primary .btn-primary:hover { background: var(--tblr-primary) !important; color: var(--tblr-primary-fg) !important; box-shadow: none; }
.xl-custom-primary .p3-seg button[aria-selected="true"], .xl-custom-primary .chat-msg.user { background: var(--tblr-primary); color: var(--tblr-primary-fg); box-shadow: none; }
[data-glass="off"] *, [data-glass="off"] *::before, [data-glass="off"] *::after { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.btn-primary:disabled, .btn-primary.disabled { opacity: .55; box-shadow: none; }
/* Contorno de marca */
.btn-outline-primary {
  --tblr-btn-color: var(--xl-accent-text); --tblr-btn-bg: rgba(241, 83, 98, .08); --tblr-btn-border-color: rgba(241, 83, 98, .4);
  --tblr-btn-hover-color: var(--xl-accent-text); --tblr-btn-hover-bg: rgba(241, 83, 98, .16); --tblr-btn-hover-border-color: var(--xl-coral);
  --tblr-btn-active-color: var(--xl-accent-text); --tblr-btn-active-bg: rgba(241, 83, 98, .16); --tblr-btn-active-border-color: var(--xl-coral);
}
.btn-ghost-primary { --tblr-btn-color: var(--xl-accent); --tblr-btn-hover-bg: rgba(241, 83, 98, .1); --tblr-btn-hover-color: var(--xl-accent); }
.btn-ghost-secondary { --tblr-btn-color: var(--xl-text-2); --tblr-btn-hover-bg: var(--xl-surface); --tblr-btn-hover-color: var(--xl-text); --tblr-btn-active-bg: var(--xl-elevated); }
.btn-danger { --tblr-btn-bg: var(--xl-danger); --tblr-btn-border-color: var(--xl-danger); --tblr-btn-hover-bg: #DC2626; --tblr-btn-hover-border-color: #DC2626; }
.btn-success { --tblr-btn-bg: var(--xl-success); --tblr-btn-border-color: var(--xl-success); --tblr-btn-hover-bg: #059669; --tblr-btn-hover-border-color: #059669; }
.btn-link { --tblr-btn-color: var(--tblr-link-color); font-weight: 600; }

/* ---------- Campos ---------- */
.form-control, .form-select, .input-group-text {
  border-radius: var(--xl-radius-sm); border-color: var(--xl-border); background-color: var(--tblr-bg-forms); color: var(--xl-text);
  font-family: var(--xl-font-sans); transition: border-color .2s ease, box-shadow .2s ease;
}
.form-control::placeholder { color: var(--xl-muted); opacity: 1; }
.form-control:focus, .form-select:focus, .form-check-input:focus { border-color: var(--xl-focus); box-shadow: 0 0 0 3px rgba(241, 83, 98, .15); }
.input-group-text { font-family: var(--xl-font-mono); font-size: .75rem; color: var(--xl-muted); background: rgba(255, 255, 255, .04); }
[data-bs-theme="light"] .input-group-text { background: #F1F5F9; }
.form-check-input:checked { background-color: var(--xl-coral); border-color: var(--xl-coral); }
.form-switch .form-check-input:checked { background-color: var(--xl-coral); }
.form-range::-webkit-slider-thumb { background: var(--xl-coral); }
.form-range::-moz-range-thumb { background: var(--xl-coral); }
.form-hint { color: var(--xl-muted); font-size: .8125rem; }
.input-group > .form-control, .input-group > .form-select { font-family: var(--xl-font-mono); }
.input-group > .form-control:not([type="number"]):not([inputmode="decimal"]):not([inputmode="numeric"]) { font-family: var(--xl-font-sans); }

/* ---------- Badges / pills de status (raio total, mono) ---------- */
.badge { border-radius: var(--xl-radius-full); font-weight: 600; letter-spacing: 0; text-transform: none; padding: .3em .75em; font-size: .75rem; }
.bg-green-lt, .bg-success-lt { background: var(--xl-success-bg) !important; color: var(--xl-success) !important; box-shadow: inset 0 0 0 1px rgba(16, 185, 129, .3); }
.bg-yellow-lt, .bg-warning-lt, .bg-orange-lt { background: var(--xl-warning-bg) !important; color: var(--xl-warning) !important; box-shadow: inset 0 0 0 1px rgba(245, 158, 11, .3); }
.bg-red-lt, .bg-danger-lt { background: var(--xl-danger-bg) !important; color: var(--xl-danger) !important; box-shadow: inset 0 0 0 1px rgba(239, 68, 68, .3); }
.bg-blue-lt, .bg-info-lt, .bg-azure-lt { background: var(--xl-info-bg) !important; color: var(--xl-info) !important; box-shadow: inset 0 0 0 1px rgba(59, 130, 246, .3); }
.bg-primary-lt, .bg-purple-lt, .bg-pink-lt { background: var(--xl-grad-subtle) !important; color: var(--xl-accent-text) !important; box-shadow: inset 0 0 0 1px rgba(241, 83, 98, .35); }
.bg-secondary-lt { background: rgba(138, 147, 162, .12) !important; color: var(--xl-text-2) !important; box-shadow: inset 0 0 0 1px rgba(138, 147, 162, .25); }
[data-bs-theme="light"] .bg-green-lt, [data-bs-theme="light"] .bg-success-lt { color: #047857 !important; }
[data-bs-theme="light"] .bg-yellow-lt, [data-bs-theme="light"] .bg-warning-lt, [data-bs-theme="light"] .bg-orange-lt { color: #B45309 !important; }
[data-bs-theme="light"] .bg-red-lt, [data-bs-theme="light"] .bg-danger-lt { color: #B91C1C !important; }
[data-bs-theme="light"] .bg-blue-lt, [data-bs-theme="light"] .bg-info-lt, [data-bs-theme="light"] .bg-azure-lt { color: #1D4ED8 !important; }
.bg-primary { background: var(--xl-grad) !important; color: #FFFFFF !important; }
.text-primary { color: var(--xl-accent) !important; }
.text-green, .text-success { color: var(--xl-success) !important; }
.text-red, .text-danger { color: var(--xl-danger) !important; }
.text-yellow, .text-warning { color: var(--xl-warning) !important; }
.xl-gradient-text { display: inline-block; background: var(--xl-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }

/* ---------- Alertas e diversos ---------- */
.alert { border-radius: var(--xl-radius-md); }
.progress { border-radius: var(--xl-radius-full); background: var(--xl-border-subtle); }
.progress-bar { background: var(--xl-grad); }
.nav-tabs .nav-link.active, .nav-link.active { color: var(--xl-text); }
.nav-tabs .nav-link.active { border-bottom-color: var(--xl-coral); }
.list-group-item { background: transparent; border-color: var(--xl-border-subtle); }
.avatar { border-radius: var(--xl-radius-md); font-family: var(--xl-font-sans); font-weight: 700; }
.bg-primary-lt.avatar { box-shadow: none; }
hr { border-color: var(--xl-border); opacity: 1; }
::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: var(--xl-border); border-radius: 99px; border: 2px solid transparent; background-clip: padding-box; }
::-webkit-scrollbar-track { background: transparent; }

/* ---------- Marca no menu (símbolo + assinatura tipográfica) ---------- */
.xl-mark { width: 32px; height: 32px; flex: none; display: block; }
.xl-wordmark { font-family: var(--xl-font-sans); font-weight: 800; font-size: 1.15rem; letter-spacing: -.02em; line-height: 1.2; color: var(--xl-text); white-space: nowrap; }
/* No manual o degradê de "Lab" cobre a palavra inteira (objectBoundingBox do texto): "Lab" fica com o trecho final, coral → laranja */
.xl-wordmark .lab { font-weight: 500; background: var(--xl-grad); background-size: 335% 100%; background-position: 100% 0; -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.xl-tagline { display: block; font-size: .7rem; font-weight: 500; color: var(--xl-muted); letter-spacing: .08em; text-transform: uppercase; margin-top: 2px; white-space: nowrap; }
.xl-lockup { display: inline-flex; align-items: center; gap: 12px; min-width: 0; }
.xl-lockup-text { display: flex; flex-direction: column; min-width: 0; }
.xl-lockup.md .xl-mark { width: 44px; height: 44px; }
.xl-lockup.md .xl-wordmark { font-size: 1.5rem; }
.xl-lockup.md .xl-tagline { font-size: .66rem; letter-spacing: .16em; margin-top: 3px; }
.xl-lockup.lg .xl-mark { width: 52px; height: 52px; }
.xl-lockup.lg .xl-wordmark { font-size: 1.85rem; }
.xl-lockup.lg .xl-tagline { font-size: .74rem; letter-spacing: .17em; margin-top: 4px; }
.xl-powered { font-size: .72rem; color: var(--xl-muted); }
.xl-powered b { color: var(--xl-text-2); font-weight: 700; }

/* ---------- Shell (sidebar + topo) ---------- */
.p3-shell { display: grid; grid-template-columns: var(--xl-sidebar) 1fr; min-height: 100vh; }
.p3-side {
  position: sticky; top: 0; height: 100vh; overflow-y: auto; padding: 18px 14px;
  border-right: 1px solid var(--xl-border);
  background: color-mix(in srgb, var(--xl-bg) calc(var(--glass-opacity) - 6%), transparent);
  backdrop-filter: blur(calc(var(--glass-blur) * 1.3)) saturate(var(--glass-sat));
  -webkit-backdrop-filter: blur(calc(var(--glass-blur) * 1.3)) saturate(var(--glass-sat));
}
.p3-brand { display: flex; align-items: center; gap: 12px; font-family: var(--xl-font-sans); font-weight: 800; font-size: 1.05rem; letter-spacing: -.02em; padding: 4px 8px 18px; color: var(--xl-text); text-decoration: none; min-width: 0; }
.p3-brand > span:not(.visually-hidden) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.p3-brand img { height: 40px; width: auto; max-width: 200px; object-fit: contain; flex: none; }
.logo-on-dark { display: none !important; }
[data-bs-theme="dark"] .logo-on-light { display: none !important; }
[data-bs-theme="dark"] .logo-on-dark { display: block !important; }
@media print { .logo-on-light { display: block !important; } .logo-on-dark { display: none !important; } }
.tenant-logo { height: 56px; width: auto; max-width: 220px; object-fit: contain; }
.p3-brand.wide span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.logo-preview { margin-top: 8px; height: 72px; border-radius: 10px; border: 1px solid var(--tblr-border-color); display: grid; place-items: center; padding: 10px; }
.logo-preview.light { background: #FFFFFF; color: #475569; }
.logo-preview.dark { background: #1F2126; color: #8A93A2; }
.logo-preview img { max-height: 52px; max-width: 100%; object-fit: contain; }
.logo-preview span { font-size: .8rem; }
.p3-logo { width: 32px; height: 32px; flex: none; }
.p3-nav-group { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--xl-muted); padding: 16px 12px 8px; }
.p3-nav { display: flex; flex-direction: column; gap: 4px; }
.p3-nav a {
  position: relative; display: flex; align-items: center; gap: 12px; padding: 8px 12px; border-radius: var(--xl-radius-sm); border: 1px solid transparent;
  color: var(--xl-text-2); text-decoration: none; font-size: .875rem; font-weight: 500; transition: background .2s ease, color .2s ease;
}
.p3-nav a:hover { background: var(--xl-surface); color: var(--xl-text); }
.p3-nav a.active { background: var(--xl-grad-subtle); border-color: rgba(241, 83, 98, .35); color: var(--xl-text); font-weight: 600; }
.p3-nav a.active .ti { color: var(--xl-accent); }
.p3-nav a .ti { font-size: 1.15rem; color: var(--xl-muted); transition: color .2s ease; }
.p3-nav a:hover .ti { color: var(--xl-text-2); }
[data-bs-theme="light"] .p3-nav a:hover { background: #F1F5F9; }
.p3-main { min-width: 0; }
.p3-top { display: flex; align-items: center; gap: 12px; padding: 14px 28px; position: sticky; top: 0; z-index: 10; }
.p3-top .page-title { margin: 0; font-size: 1.35rem; }
.p3-content { padding: 8px var(--xl-space-8) var(--xl-space-12); max-width: 1440px; }
.p3-burger { display: none; }

@media (max-width: 991px) {
  .p3-shell { grid-template-columns: 1fr; }
  .p3-side { position: fixed; inset: 0 auto 0 0; width: 270px; z-index: 1050; transform: translateX(-100%); transition: transform .2s ease; }
  .p3-side.open { transform: none; }
  .p3-burger { display: inline-flex; }
  .p3-top, .p3-content { padding-left: 16px; padding-right: 16px; }
}

/* ---------- Componentes ---------- */
.kpi .kpi-value { font-family: var(--xl-font-mono); font-size: 1.5rem; font-weight: 700; line-height: 1.2; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.kpi .kpi-label { color: var(--xl-muted); font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; }
.kpi .kpi-foot { font-size: .8rem; color: var(--xl-text-2); }
.live-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--xl-success); display: inline-block; box-shadow: 0 0 0 0 rgba(16,185,129,.6); animation: pulse 2s infinite; }
@keyframes pulse { 70% { box-shadow: 0 0 0 9px rgba(16,185,129,0); } 100% { box-shadow: 0 0 0 0 rgba(16,185,129,0); } }

.swatch { width: 18px; height: 18px; border-radius: 50%; display: inline-block; border: 2px solid var(--p3-glass-border); box-shadow: 0 0 0 1px var(--p3-glass-edge); vertical-align: middle; }
.empty-state { text-align: center; padding: 48px 16px; color: var(--tblr-secondary); }
.empty-state .ti { font-size: 2.4rem; display: block; margin-bottom: 8px; color: var(--p3-accent); }

/* Termômetro de preço */
.thermo { position: relative; height: 14px; border-radius: 99px; background: linear-gradient(90deg, var(--xl-danger) 0%, var(--xl-warning) 22%, var(--xl-success) 45%, var(--xl-success) 62%, var(--xl-warning) 80%, var(--xl-danger) 100%); }
.thermo-marker { position: absolute; top: -6px; width: 4px; height: 26px; border-radius: 3px; background: var(--xl-text); transform: translateX(-50%); transition: left .25s ease; box-shadow: 0 0 0 3px var(--p3-plate); }
.thermo-labels { display: flex; justify-content: space-between; font-size: .75rem; color: var(--tblr-secondary); margin-top: 8px; }

.breakdown-bar { display: flex; height: 12px; border-radius: 99px; overflow: hidden; background: var(--p3-glass-edge); }
.breakdown-bar span { display: block; height: 100%; }

.filament-line { border: 1px dashed var(--p3-glass-edge); border-radius: 12px; padding: 12px; }

/* Onboarding */
.machine-pick { cursor: pointer; transition: transform .12s ease, border-color .12s ease; }
.machine-pick:hover { transform: translateY(-2px); }
.machine-pick.selected { border-color: var(--p3-accent) !important; box-shadow: 0 0 0 2px var(--p3-accent); }
.step-list { counter-reset: step; list-style: none; padding: 0; }
.step-list li { counter-increment: step; position: relative; padding: 0 0 18px 44px; }
.step-list li::before { content: counter(step); position: absolute; left: 0; top: 0; width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; background: color-mix(in srgb, var(--p3-accent) 18%, transparent); color: var(--p3-accent); }

/* Banner de impersonação */
.impersonate-bar { background: var(--xl-orange); color: #141619; padding: 8px 16px; font-weight: 600; display: flex; gap: 12px; align-items: center; justify-content: center; }

/* Toasts */
.p3-toasts { position: fixed; right: 16px; bottom: 100px; z-index: 2000; display: grid; gap: 8px; } /* acima do botão de acessibilidade */
.p3-toast { padding: 12px 20px; border-radius: var(--xl-radius-md); min-width: 260px; max-width: 380px; box-shadow: var(--xl-shadow-lg) !important; }
.p3-toast.error { border-left: 4px solid var(--xl-danger) !important; }
.p3-toast.success { border-left: 4px solid var(--xl-success) !important; }

/* Foco visível para teclado */
:focus-visible { outline: 2px solid var(--xl-focus); outline-offset: 2px; }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

/* Impressão do catálogo */
@media print {
  body { background: #fff !important; }
  .no-print, .p3-side, .p3-top { display: none !important; }
  .p3-shell { display: block; }
  .card { box-shadow: none !important; backdrop-filter: none !important; background: #fff !important; border: 1px solid #ddd !important; break-inside: avoid; }
}

/* Modal nativo <dialog> */
dialog.p3-dialog { border: 0; padding: 0; background: transparent; width: min(580px, 94vw); max-height: 92vh; color: inherit; }
dialog.p3-dialog.lg { width: min(860px, 96vw); }
dialog.p3-dialog::backdrop { background: rgba(11, 12, 14, .55); backdrop-filter: blur(calc(var(--glass-blur) * .3)); }
dialog.p3-dialog .modal-content { border-radius: 16px; max-height: 92vh; display: flex; flex-direction: column; }
dialog.p3-dialog .modal-body { overflow-y: auto; }
dialog.p3-dialog .modal-header, dialog.p3-dialog .modal-footer { border-color: var(--p3-glass-edge); display: flex; align-items: center; justify-content: space-between; gap: 8px; }
dialog.p3-dialog .modal-footer { justify-content: flex-end; }

/* Faixa do ambiente de demonstração */
.p3-demo-bar { background: var(--xl-grad); color: #fff; padding: 7px 16px; font-size: .88rem; font-weight: 600; text-align: center; }

/* Assistente IA do admin */
.chat-wrap { display: grid; grid-template-rows: 1fr auto; height: calc(100vh - 170px); min-height: 460px; }
.chat-log { overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 14px; }
.chat-msg { max-width: min(760px, 92%); padding: 12px 16px; border-radius: 16px; line-height: 1.55; }
.chat-msg.user { align-self: flex-end; background: var(--xl-grad); color: #fff; border-bottom-right-radius: 4px; white-space: pre-wrap; }
.chat-msg.model { align-self: flex-start; background: color-mix(in srgb, var(--p3-ink) 6%, transparent); border: 1px solid var(--p3-glass-edge); border-bottom-left-radius: 4px; }
.chat-msg.model h3, .chat-msg.model h4 { font-size: 1rem; margin: 10px 0 6px; }
.chat-msg.model ul, .chat-msg.model ol { padding-left: 1.2rem; margin: 6px 0; }
.chat-msg.model p { margin: 0 0 8px; }
.chat-msg.model p:last-child { margin-bottom: 0; }
.chat-input { border-top: 1px solid var(--p3-glass-edge); padding: 12px; display: flex; gap: 8px; align-items: flex-end; }
.chat-input textarea { resize: none; max-height: 180px; }
.chat-suggestions { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.typing span { display: inline-block; width: 7px; height: 7px; margin: 0 2px; border-radius: 50%; background: currentColor; opacity: .4; animation: blink 1.2s infinite; }
.typing span:nth-child(2) { animation-delay: .2s; } .typing span:nth-child(3) { animation-delay: .4s; }
@keyframes blink { 50% { opacity: 1; } }

/* Botões de login social */
.btn-social { display: flex; align-items: center; justify-content: center; gap: 10px; font-weight: 600; }
.btn-social .ti { font-size: 1.2rem; }
.btn-apple { background: #000; color: #fff; border-color: #000; }
.btn-apple:hover { background: #222; color: #fff; }
.divider-or { display: flex; align-items: center; gap: 12px; color: var(--tblr-secondary); font-size: .85rem; margin: 18px 0; }
.divider-or::before, .divider-or::after { content: ""; flex: 1; height: 1px; background: var(--p3-glass-edge); }

/* ---------- Manutenção ---------- */
.maint-bar { background: #B45309; color: #fff; padding: 7px 16px; font-size: .88rem; font-weight: 600; text-align: center; }
.maint-bar a { color: #fff; text-decoration: underline; margin-left: .5rem; }
.maint-status { display: inline-flex; align-items: center; gap: .4rem; font-weight: 600; padding: .3rem .7rem; border-radius: 999px; font-size: .85rem; }
.maint-status.on { background: color-mix(in srgb, var(--xl-warning) 18%, transparent); color: var(--xl-warning); }
.maint-status.soon { background: color-mix(in srgb, var(--p3-orange) 22%, transparent); color: color-mix(in srgb, var(--p3-orange) 70%, #000); }
.maint-status.off { background: color-mix(in srgb, var(--xl-success) 16%, transparent); color: var(--xl-success); }
.serp { font-family: arial, sans-serif; background: #fff; color: #202124; border-radius: 12px; padding: 14px 16px; max-width: 640px; border: 1px solid #dadce0; }
.serp .u { font-size: 12px; color: #4d5156; }
.serp .t { font-size: 20px; color: #1a0dab; line-height: 1.3; margin: 2px 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.serp .d { font-size: 14px; color: #4d5156; line-height: 1.58; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.char-count { font-size: .78rem; }
.char-count.ok { color: var(--xl-success); } .char-count.warn { color: var(--xl-warning); }
.maint-hero { width: 76px; height: 76px; margin: 22px auto 10px; border-radius: var(--xl-radius-xl); display: grid; place-items: center; font-size: 38px; color: #fff;
  background: var(--xl-grad); box-shadow: var(--xl-glow); }
.maint-count { border-radius: 14px; padding: 12px; margin-top: 8px; }
.maint-count .v { font-family: var(--xl-font-mono); font-size: 1.8rem; font-weight: 700; font-variant-numeric: tabular-nums; }

/* =====================================================================
   v0.4 — refinamentos de UX
   ===================================================================== */

/* Cabeçalho da página: título à esquerda, ações à direita (quebram para baixo no celular) */
.p3-top { flex-wrap: wrap; row-gap: 10px; backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
  background: color-mix(in srgb, var(--p3-plate) 72%, transparent); border-bottom: 1px solid transparent; }
.p3-top .page-title { line-height: 1.2; }
.p3-top .page-sub { color: var(--tblr-secondary); font-size: .88rem; margin-top: 2px; max-width: 62ch; }

/* Barra de ferramentas dentro da página (busca, filtros, botão principal) */
.toolbar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-bottom: 14px; }
.toolbar .search { position: relative; flex: 1 1 260px; max-width: 420px; }
.toolbar .search .ti { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--tblr-secondary); pointer-events: none; }
.toolbar .search input { padding-left: 34px; }
.toolbar .spacer { flex: 1; }

/* Chips de filtro com contador */
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chip { border: 1px solid var(--xl-border); background: var(--p3-glass); border-radius: var(--xl-radius-full); font-weight: 500; padding: 5px 12px; font-size: .85rem; cursor: pointer; color: inherit; display: inline-flex; gap: 6px; align-items: center; }
.chip b { font-weight: 600; opacity: .65; }
.chip:hover { border-color: color-mix(in srgb, var(--p3-accent) 45%, transparent); }
.chip[aria-pressed="true"] { background: var(--xl-grad-subtle); border-color: rgba(241, 83, 98, .55); color: var(--xl-text); font-weight: 600; }
.chip[aria-pressed="true"] b { opacity: 1; }

/* Abas laterais (configurações) */
.p3-tabs-layout { display: grid; grid-template-columns: 240px 1fr; gap: 20px; align-items: start; }
.p3-tabs { position: sticky; top: 24px; display: grid; gap: 4px; padding: 8px; border-radius: var(--xl-radius-lg); }
.p3-tabs button { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 12px; padding: 9px 12px; border-radius: var(--xl-radius-sm); border: 1px solid transparent; cursor: pointer; font-size: .875rem; font-weight: 500; color: var(--xl-text-2); }
.p3-tabs button:hover { background: var(--xl-surface); color: var(--xl-text); }
.p3-tabs button[aria-selected="true"] { background: var(--xl-grad-subtle); border-color: rgba(241, 83, 98, .35); color: var(--xl-text); font-weight: 600; }
.p3-tabs button[aria-selected="true"] .ti { color: var(--xl-accent); }
.p3-tabs button:focus-visible { outline: 3px solid color-mix(in srgb, var(--p3-accent) 70%, transparent); }
.p3-tabs .ti { font-size: 1.15rem; }
.p3-tabs .dot { margin-left: auto; }
@media (max-width: 991px) {
  .p3-tabs-layout { grid-template-columns: 1fr; }
  .p3-tabs { position: static; display: flex; overflow-x: auto; scrollbar-width: none; }
  .p3-tabs button { white-space: nowrap; }
}
.tab-head { margin-bottom: 14px; }
.tab-head h2 { font-size: 1.25rem; margin: 0 0 2px; }
.tab-head p { color: var(--tblr-secondary); margin: 0; max-width: 70ch; }

/* Indicador de status (configurado / pendente / erro) */
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; flex: none; background: var(--tblr-secondary); opacity: .5; }
.dot.ok { background: var(--xl-success); opacity: 1; }
.dot.warn { background: var(--xl-warning); opacity: 1; }
.dot.off { background: var(--xl-danger); opacity: 1; }

/* Título de grupo dentro de formulários */
.form-section { font-family: var(--xl-font-sans); font-weight: 700; font-size: 1rem; letter-spacing: -.01em; padding-top: 8px; margin-top: 4px; border-top: 1px solid var(--p3-glass-edge); }
.row > .col-12:first-child > .form-section { border-top: 0; padding-top: 0; margin-top: 0; }
.form-section span { display: block; font-family: var(--tblr-font-sans-serif); font-weight: 400; font-size: .85rem; color: var(--tblr-secondary); }

/* Medidor de uso */
.meter { min-width: 140px; }
.meter-top { display: flex; justify-content: space-between; gap: 8px; font-size: .82rem; margin-bottom: 5px; }
.meter-top span { color: var(--tblr-secondary); }
.meter-bar { height: 8px; border-radius: 99px; background: color-mix(in srgb, var(--p3-ink) 9%, transparent); overflow: hidden; }
.meter-bar span { display: block; height: 100%; border-radius: 99px; background: var(--xl-grad); transition: width .4s ease; }
.meter.warn .meter-bar span { background: var(--xl-warning); }
.meter.danger .meter-bar span { background: var(--xl-danger); }
.meter.compact .meter-top { font-size: .78rem; margin-bottom: 3px; }

/* Avatar com iniciais */
.ava { width: 36px; height: 36px; border-radius: var(--xl-radius-md); display: grid; place-items: center; font-weight: 700; font-size: .85rem; flex: none;
  background: color-mix(in srgb, var(--p3-accent) 16%, transparent); color: var(--p3-accent); }
.ava.lg { width: 52px; height: 52px; border-radius: 14px; font-size: 1.1rem; }

/* Tabela com linhas clicáveis */
.table-click tbody tr { cursor: pointer; }
.table-click tbody tr:hover { background: color-mix(in srgb, var(--p3-accent) 5%, transparent); }
.row-actions { display: flex; gap: 4px; justify-content: flex-end; }
.row-actions .btn { --tblr-btn-padding-x: .45rem; }

/* Menu de ações (⋯) */
.menu { position: relative; display: inline-block; }
.menu-list { position: absolute; right: 0; top: calc(100% + 4px); z-index: 30; min-width: 230px; padding: 6px; border-radius: 12px; display: none; }
.menu.open .menu-list { display: grid; }
.menu-list button, .menu-list a { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; cursor: pointer; font-size: .9rem; }
.menu-list button:hover, .menu-list a:hover { background: color-mix(in srgb, var(--p3-accent) 10%, transparent); }
.menu-list .danger { color: var(--xl-danger); }
.menu-list hr { margin: 4px 0; opacity: .15; }

/* Painel lateral (drawer) */
dialog.p3-dialog.drawer { margin: 0 0 0 auto; height: 100vh; max-height: 100vh; width: min(720px, 100vw); }
dialog.p3-dialog.drawer .modal-content { height: 100vh; max-height: 100vh; border-radius: 18px 0 0 18px; }
dialog.p3-dialog.drawer .modal-header { flex-wrap: wrap; }
dialog.p3-dialog.drawer .drawer-sub { order: 3; flex-basis: 100%; color: var(--tblr-secondary); font-size: .88rem; }
dialog.p3-dialog.drawer[open] { animation: drawer-in .22s ease; }
@keyframes drawer-in { from { transform: translateX(40px); opacity: 0; } }

/* Abas horizontais (dentro de painéis) */
.seg { display: flex; gap: 4px; border-bottom: 1px solid var(--p3-glass-edge); margin-bottom: 16px; overflow-x: auto; }
.seg button { all: unset; cursor: pointer; padding: 8px 12px; font-size: .9rem; border-bottom: 2px solid transparent; white-space: nowrap; color: var(--tblr-secondary); }
.seg button[aria-selected="true"] { color: var(--xl-text); border-color: var(--xl-coral); font-weight: 600; }

/* Zona de perigo */
.danger-zone { border: 1px solid color-mix(in srgb, var(--xl-danger) 35%, transparent); border-radius: 12px; padding: 14px 16px; background: color-mix(in srgb, var(--xl-danger) 5%, transparent); }
.danger-zone h4 { color: var(--xl-danger); margin: 0 0 4px; }

/* Checklist de lançamento */
.checklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; }
.checklist a { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; color: inherit; text-decoration: none; }
.checklist a:hover { background: color-mix(in srgb, var(--p3-accent) 7%, transparent); }
.checklist .ic { width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; flex: none; border: 2px solid var(--p3-glass-edge); }
.checklist .done .ic { background: var(--xl-success); border-color: var(--xl-success); color: #fff; }
.checklist .done .t { text-decoration: line-through; opacity: .6; }
.checklist .d { font-size: .82rem; color: var(--tblr-secondary); }

/* KPI com ícone */
.kpi .kpi-icon { width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; font-size: 1.15rem; float: right;
  background: color-mix(in srgb, var(--p3-accent) 14%, transparent); color: var(--p3-accent); }

/* Rodapé do menu lateral */
.p3-side { display: flex; flex-direction: column; }
.p3-side .p3-nav { flex: 1; }
.p3-side-foot { font-size: .72rem; color: var(--xl-muted); padding: 12px 8px 2px; display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 2px 8px; }
.p3-side-foot .num { font-size: .68rem; }

/* Bloco de informação com ícone */
.callout { display: flex; gap: 12px; padding: 12px 14px; border-radius: var(--xl-radius-md); background: color-mix(in srgb, var(--p3-accent) 8%, transparent); border: 1px solid color-mix(in srgb, var(--p3-accent) 22%, transparent); font-size: .9rem; }
.callout > .ti { font-size: 1.3rem; color: var(--p3-accent); flex: none; margin-top: 1px; }
.callout.warn { background: color-mix(in srgb, var(--xl-warning) 9%, transparent); border-color: color-mix(in srgb, var(--xl-warning) 30%, transparent); }
.callout.warn > .ti { color: var(--xl-warning); }

/* Barra de salvar fixa (formulários longos) */
.savebar { position: sticky; bottom: 12px; z-index: 5; display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 14px; margin-top: 16px; }
.savebar .msg { color: var(--tblr-secondary); font-size: .88rem; }
.savebar.dirty .msg { color: var(--xl-warning); font-weight: 600; }
dialog .btn-close:focus { box-shadow: none; }
dialog .btn-close:focus-visible { outline: 3px solid color-mix(in srgb, var(--p3-accent) 70%, transparent); }

/* Ideias por nicho: fotos de produtos parecidos */
.idea-photos { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; padding: 4px; }
.idea-photos a, .idea-photos .ph { position: relative; aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: color-mix(in srgb, var(--p3-ink) 7%, transparent); display: block; }
.idea-photos img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; background: #fff; }
.idea-photos a:hover img { transform: scale(1.05); }
.idea-photos .price { position: absolute; left: 6px; bottom: 6px; background: rgba(0,0,0,.65); color: #fff; font-size: .72rem; font-weight: 600; padding: 2px 6px; border-radius: 6px; }
.idea-photos.empty { grid-template-columns: 1fr; place-items: center; aspect-ratio: auto; height: 120px; color: var(--tblr-secondary); gap: 4px; font-size: .85rem; }
.idea-photos.empty .ti { font-size: 1.8rem; }
.idea-links { padding: 4px 16px 0; color: var(--tblr-secondary); }
.shimmer { background: linear-gradient(90deg, color-mix(in srgb, var(--p3-ink) 6%, transparent) 25%, color-mix(in srgb, var(--p3-ink) 12%, transparent) 50%, color-mix(in srgb, var(--p3-ink) 6%, transparent) 75%) !important; background-size: 200% 100% !important; animation: shimmer 1.2s infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }
.chip .ti { font-size: 1rem; }

/* =====================================================================
   v0.8 — drawer no lugar de modais, mobile revisado, loadings com estimativa
   ===================================================================== */

/* ---------- Drawer (todo "modal" do sistema) ---------- */
dialog.p3-drawer { margin: 0 0 0 auto; height: 100dvh; max-height: 100dvh; width: min(560px, 100vw); max-width: 100vw; }
dialog.p3-drawer.lg, dialog.p3-drawer.wide { width: min(780px, 100vw); }
dialog.p3-drawer.actions { width: min(420px, 100vw); }
dialog.p3-drawer .modal-content { height: 100%; max-height: 100%; border-radius: var(--xl-radius-lg) 0 0 var(--xl-radius-lg); }
dialog.p3-drawer .modal-header { align-items: flex-start; }
dialog.p3-drawer .drawer-sub { color: var(--tblr-secondary); font-size: .88rem; margin-top: 2px; overflow-wrap: anywhere; }
dialog.p3-drawer .modal-body { flex: 1; overscroll-behavior: contain; }
dialog.p3-drawer .modal-footer { position: sticky; bottom: 0; }
dialog.p3-drawer[open] { animation: drawer-in-side .24s cubic-bezier(.2, .8, .2, 1); }
dialog.p3-drawer.closing { animation: drawer-out-side .18s ease forwards; }
dialog.p3-drawer[open]::backdrop { animation: fade-in .2s ease; }
dialog.p3-drawer.closing::backdrop { opacity: 0; transition: opacity .18s; }
.drawer-grab { display: none; }
.min-w-0 { min-width: 0; }
@keyframes drawer-in-side { from { transform: translateX(48px); opacity: 0; } }
@keyframes drawer-out-side { to { transform: translateX(48px); opacity: 0; } }
@keyframes drawer-in-up { from { transform: translateY(100%); } }
@keyframes drawer-out-up { to { transform: translateY(100%); } }
@keyframes fade-in { from { opacity: 0; } }

@media (max-width: 767px) {
  dialog.p3-drawer, dialog.p3-drawer.lg, dialog.p3-drawer.wide, dialog.p3-drawer.actions {
    margin: auto 0 0 0; width: 100vw; height: auto; max-height: 92dvh;
  }
  dialog.p3-drawer .modal-content { border-radius: 20px 20px 0 0; max-height: 92dvh; padding-bottom: env(safe-area-inset-bottom); }
  dialog.p3-drawer[open] { animation: drawer-in-up .26s cubic-bezier(.2, .8, .2, 1); }
  dialog.p3-drawer.closing { animation: drawer-out-up .18s ease forwards; }
  .drawer-grab { display: block; width: 42px; height: 5px; border-radius: 99px; background: color-mix(in srgb, var(--p3-ink) 25%, transparent); margin: 8px auto 0; cursor: grab; }
  dialog.p3-drawer .modal-header { padding-top: 10px !important; }
  dialog.p3-drawer .modal-footer { flex-wrap: wrap; }
  dialog.p3-drawer .modal-footer .btn { flex: 1 1 auto; }
}

/* Lista de ações dentro do drawer (substitui menus suspensos) */
.drawer-actions { display: grid; gap: 2px; margin: -4px -8px; }
.drawer-actions > a, .drawer-actions > button { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 12px; padding: 12px 12px; border-radius: 10px; cursor: pointer; font-size: .95rem; min-height: 44px; }
.drawer-actions > a:hover, .drawer-actions > button:hover { background: color-mix(in srgb, var(--p3-accent) 10%, transparent); }
.drawer-actions > a:focus-visible, .drawer-actions > button:focus-visible { outline: 3px solid color-mix(in srgb, var(--p3-accent) 70%, transparent); }
.drawer-actions .ti { font-size: 1.2rem; opacity: .85; }
.drawer-actions .danger { color: var(--xl-danger); }
.drawer-actions hr { margin: 6px 0; opacity: .15; }
.drawer-note { display: flex; align-items: center; gap: 10px; padding: 4px 12px 10px; color: var(--tblr-secondary); font-size: .88rem; }
.menu-list { display: none !important; }

/* ---------- Carregamento ---------- */
.p3-topbar { position: fixed; top: 0; left: 0; right: 0; height: 3px; z-index: 3000; pointer-events: none; opacity: 0; transition: opacity .3s; }
.p3-topbar span { display: block; height: 100%; width: 0; background: var(--xl-grad); box-shadow: 0 0 8px rgba(241, 83, 98, .6); }
.p3-topbar.on { opacity: 1; }
.p3-topbar.on span { animation: topbar 8s cubic-bezier(.1, .7, .3, 1) forwards; }
.p3-topbar.done span { width: 100% !important; animation: none; transition: width .2s ease; }
@keyframes topbar { 0% { width: 0; } 30% { width: 55%; } 100% { width: 92%; } }

.p3-progress { padding: 18px 4px; max-width: 520px; margin: 0 auto; }
.p3-progress.compact { padding: 32px 4px; }
.p3-progress-top { display: flex; justify-content: space-between; align-items: center; gap: 12px; font-size: .9rem; margin-bottom: 8px; }
.p3-progress-label { display: inline-flex; align-items: center; color: var(--tblr-body-color); }
.p3-progress-eta { color: var(--tblr-secondary); font-size: .82rem; white-space: nowrap; font-variant-numeric: tabular-nums; }
.p3-progress-bar { height: 8px; border-radius: 99px; background: color-mix(in srgb, var(--p3-ink) 9%, transparent); overflow: hidden; }
.p3-progress-bar span { display: block; height: 100%; width: 0; border-radius: 99px; background: var(--xl-grad); transition: width .25s linear; }
.p3-boot { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.p3-boot .p3-progress { width: min(360px, 90vw); }

/* ---------- Topo e menu no celular ---------- */
@media (max-width: 991px) {
  body.side-open { overflow: hidden; }
  body.side-open::after { content: ""; position: fixed; inset: 0; background: rgba(11, 12, 14, .55); backdrop-filter: blur(2px); z-index: 1040; }
  .p3-side { box-shadow: 0 0 40px rgba(0, 0, 0, .25); }
  .p3-nav a { padding: 11px 10px; }
  .toolbar .search { max-width: none; }
  .p3-toasts { left: 12px; right: 12px; bottom: calc(12px + env(safe-area-inset-bottom)); }
  .p3-toast { min-width: 0; max-width: none; }
}

/* ---------- Tabelas viram cards no celular ---------- */
@media (max-width: 767px) {
  .table-responsive:has(> table.p3-rtable) { overflow: visible; }
  table.p3-rtable, table.p3-rtable tbody, table.p3-rtable tr, table.p3-rtable td { display: block; width: 100%; }
  table.p3-rtable thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  table.p3-rtable { border: 0; }
  table.p3-rtable tbody { display: grid; gap: 10px; padding: 10px; }
  .card > table.p3-rtable tbody, .card .table-responsive > table.p3-rtable tbody { padding: 10px; }
  table.p3-rtable tr { border: 1px solid var(--p3-glass-edge); border-radius: 14px; padding: 8px 12px; background: color-mix(in srgb, var(--tblr-bg-surface) 85%, transparent); }
  table.p3-rtable tr.table-click, table.table-click.p3-rtable tr { cursor: pointer; }
  table.p3-rtable td { border: 0 !important; padding: 6px 0 !important; display: flex; justify-content: space-between; align-items: center; gap: 12px; text-align: right !important; min-height: 32px; }
  table.p3-rtable td::before { content: attr(data-label); color: var(--tblr-secondary); font-size: .8rem; text-align: left; flex: none; max-width: 45%; }
  table.p3-rtable td[data-label=""]::before { content: none; }
  /* Primeira coluna = título do card */
  table.p3-rtable td:first-child { display: block; text-align: left !important; font-size: 1rem; padding-bottom: 8px !important; border-bottom: 1px solid var(--p3-glass-edge) !important; margin-bottom: 4px; }
  table.p3-rtable td:first-child::before { display: block; margin-bottom: 2px; }
  table.p3-rtable td:first-child[data-label]:not([data-label=""])::before { content: none; }
  table.p3-rtable td.td-actions { justify-content: flex-end; border-top: 1px solid var(--p3-glass-edge) !important; margin-top: 4px; padding-top: 8px !important; }
  table.p3-rtable td.td-actions:first-child { border-top: 0 !important; }
  table.p3-rtable td:empty { display: none; }
  table.p3-rtable td .btn-icon { min-width: 40px; min-height: 40px; }
  table.p3-rtable.no-head td { text-align: left !important; }
  table.p3-rtable.table-sm tbody { padding: 0; gap: 6px; }
  table.p3-rtable td .form-control, table.p3-rtable td .form-select { max-width: 60%; }
  table.p3-rtable td > .d-flex { justify-content: flex-end; }
  table.p3-rtable td:first-child > .d-flex { justify-content: flex-start; }
}
@media (min-width: 1200px) { .p3-sticky-col { position: sticky; top: 84px; } }
tr.row-link { cursor: pointer; }
tr.row-link:hover td { background: color-mix(in srgb, var(--p3-accent) 6%, transparent); }
@media (max-width: 767px) {
  table.p3-rtable td { overflow-wrap: anywhere; word-break: break-word; min-width: 0; }
  table.p3-rtable td > * { min-width: 0; max-width: 100%; }
  table.p3-rtable td code, table.p3-rtable td pre { white-space: pre-wrap; overflow-wrap: anywhere; }
  table.p3-rtable td.text-nowrap { white-space: normal !important; }
}
@media (max-width: 767px) {
  dialog.p3-drawer { height: fit-content !important; }
  dialog.p3-drawer .modal-content { height: auto; }
  dialog.p3-drawer .modal-body { flex: 0 1 auto; }
}
@media (max-width: 767px) { [data-photo-box] { aspect-ratio: auto !important; height: 160px; } }

/* v0.9 — Capacidade e custo da IA */
.p3-cap-list { display: grid; gap: .75rem; }
@media (min-width: 1200px) { .p3-cap-list { grid-template-columns: 1fr 1fr; } }
.p3-cap { border: 1px solid var(--tblr-border-color); border-radius: var(--tblr-border-radius-lg, 10px); padding: .875rem 1rem; display: grid; gap: .5rem; }
.p3-cap-head { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; }
.p3-cap-head .ti { font-size: 1.15rem; color: var(--tblr-primary); }
.p3-cap-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .5rem .75rem; margin: 0; }
.p3-cap-grid dt { font-size: .75rem; font-weight: 500; color: var(--tblr-secondary); }
.p3-cap-grid dd { margin: 0; font-weight: 600; font-variant-numeric: tabular-nums; }
details.card > summary { cursor: pointer; list-style: revert; }

/* v0.10 — Orçamentos */
.p3-seg { display: inline-flex; padding: 3px; gap: 2px; border-radius: 999px; background: var(--p3-glass); border: 1px solid var(--p3-glass-edge); }
.p3-seg button { border: 0; background: transparent; color: inherit; border-radius: 999px; padding: 6px 14px; font-size: .875rem; font-weight: 500; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; }
.p3-seg button[aria-selected="true"] { background: var(--xl-grad); color: #fff; font-weight: 700; box-shadow: var(--xl-glow); }
.p3-seg button:focus-visible { outline: 2px solid var(--p3-accent); outline-offset: 2px; }

.q-board { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(200px, 1fr); gap: 12px; overflow-x: auto; padding-bottom: 6px; scroll-snap-type: x mandatory; align-items: start; }
.q-col { scroll-snap-align: start; background: color-mix(in srgb, var(--xl-bg) var(--glass-opacity), transparent); border: 1px solid var(--xl-border); border-radius: var(--xl-radius-lg); padding: 10px; display: flex; flex-direction: column; min-height: 220px; }
.q-col-head { display: flex; align-items: center; gap: 8px; padding: 4px 4px 2px; font-size: .9rem; }
.q-col-head b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.q-count { flex: none; }
.q-dot { width: 9px; height: 9px; border-radius: 50%; flex: none; }
.q-count { font-size: .75rem; font-weight: 600; min-width: 22px; height: 20px; padding: 0 6px; border-radius: 999px; display: inline-grid; place-items: center; background: color-mix(in srgb, currentColor 10%, transparent); }
.q-col-sum { font-family: var(--xl-font-mono); padding: 0 4px 0 21px; margin-bottom: 8px; min-height: 1em; font-size: .75rem; color: var(--tblr-secondary); font-variant-numeric: tabular-nums; white-space: nowrap; }
.q-list { display: flex; flex-direction: column; gap: 8px; flex: 1; min-height: 120px; border-radius: 10px; transition: background .15s; }
.q-list.over { background: color-mix(in srgb, var(--p3-accent) 8%, transparent); outline: 2px dashed color-mix(in srgb, var(--p3-accent) 45%, transparent); outline-offset: 2px; }
.q-empty { display: none; text-align: center; font-size: .8rem; color: var(--tblr-secondary); padding: 22px 8px; border: 1px dashed var(--p3-glass-edge); border-radius: 10px; }
.q-list > .q-empty:first-child { display: block; }
.q-card { background: var(--xl-surface); border: 1px solid var(--xl-border); border-radius: var(--xl-radius-md); padding: 12px; cursor: pointer; box-shadow: 0 1px 2px rgba(0,0,0,.04); transition: box-shadow .15s, transform .15s, border-color .15s; }
.q-card:hover { border-color: color-mix(in srgb, var(--p3-accent) 40%, var(--tblr-border-color)); box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.q-card:focus-visible { outline: 2px solid var(--p3-accent); outline-offset: 2px; }
.q-card.dragging { opacity: .45; transform: rotate(1deg); }
.q-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 4px; }
.q-ref { font-family: var(--xl-font-mono); font-size: .72rem; color: var(--xl-accent-text); font-variant-numeric: tabular-nums; }
.q-title { font-size: .95rem; font-weight: 600; margin: 0 0 6px; line-height: 1.3; overflow-wrap: anywhere; }
.q-meta { display: flex; flex-wrap: wrap; gap: 4px 12px; font-size: .78rem; color: var(--tblr-secondary); }
.q-meta span { display: inline-flex; align-items: center; gap: 4px; min-width: 0; }
.q-foot { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--tblr-border-color); }
.q-price { font-family: var(--xl-font-mono); font-weight: 700; font-size: 1.1rem; color: var(--tblr-green); font-variant-numeric: tabular-nums; }
.q-sub { font-size: .72rem; color: var(--tblr-secondary); }
.q-actions { display: flex; gap: 4px; }
@media (max-width: 767px) {
  .q-board { grid-auto-columns: 86%; margin: 0 -16px; padding: 0 16px 8px; scroll-padding: 0 16px; }
  .q-actions .btn { width: 40px; height: 40px; }
}

/* Itens no editor */
.q-item { display: grid; grid-template-columns: minmax(0, 1fr) 80px 140px 110px 40px; gap: 8px; align-items: end; padding: 10px 0; border-bottom: 1px dashed var(--tblr-border-color); }
.q-item .form-label { margin-bottom: 4px; }
.q-item + .q-item .form-label { display: none; }
.q-item-sub { display: flex; flex-direction: column; justify-content: center; min-height: 38px; text-align: right; font-variant-numeric: tabular-nums; }
.q-item-sub .form-label { margin-bottom: 4px; }
.q-item + .q-item .q-item-sub .form-label { display: none; }
.q-add { margin-top: 10px; border-style: dashed; }
.q-total { border-radius: var(--xl-radius-md); background: var(--xl-bg); border: 1px solid rgba(241, 83, 98, .35); padding: 12px 16px; display: grid; gap: 4px; font-variant-numeric: tabular-nums; }
.q-total > div > span:last-child, .q-total b { font-family: var(--xl-font-mono); }
.q-total > div { display: flex; justify-content: space-between; gap: 12px; font-size: .9rem; }
.q-total .q-total-final { font-size: 1.05rem; padding-top: 6px; border-top: 1px solid var(--p3-glass-edge); margin-top: 2px; }
.q-total .q-total-final b { color: var(--tblr-green); font-family: var(--xl-font-mono); font-size: 1.25rem; }
@media (max-width: 767px) {
  .q-item { grid-template-columns: 72px minmax(0, 1fr) 40px; grid-template-areas: "desc desc desc" "qty unit rm" "sub sub sub"; }
  .q-item-desc { grid-area: desc; } .q-item-qty { grid-area: qty; } .q-item-unit { grid-area: unit; } .q-item-rm { grid-area: rm; } .q-item-sub { grid-area: sub; flex-direction: row; justify-content: space-between; min-height: 0; }
  .q-item + .q-item .form-label { display: block; }
  .q-item .q-item-sub .form-label { display: inline; }
}
@media (max-width: 767px) {
  .q-kpis { --tblr-gutter-x: 8px; }
  .q-kpis .card-body { padding: 10px; }
  .q-kpis .kpi-icon, .q-kpis .kpi-foot { display: none; }
  .q-kpis .kpi-label { font-size: .72rem; line-height: 1.2; }
  .q-kpis .kpi-value { font-size: 1rem; margin-top: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* =====================================================================
   v0.11 — Topo sem controles: título, ações, busca e filtros ficam dentro da página.
   Desktop: sem barra no topo (a conta fica no rodapé do menu). Celular: barra mínima (menu, marca, conta).
   ===================================================================== */
.p3-top { display: none; }
.p3-pagehead { display: flex; align-items: flex-start; gap: 12px 16px; flex-wrap: wrap; padding: 22px 0 14px; }
.p3-titles { flex: 1 1 320px; min-width: 0; }
.p3-titles .page-title { margin: 0; font-size: 1.75rem; font-weight: 700; line-height: 1.25; letter-spacing: -.02em; }
.p3-titles .page-sub { color: var(--xl-text-2); font-size: .9375rem; margin-top: 4px; max-width: 70ch; }
.p3-head-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; justify-content: flex-end; }
.p3-head-actions:empty { display: none; }
.p3-toolbar { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: var(--xl-space-6); padding: 8px; border-radius: var(--xl-radius-lg); background: var(--p3-glass); border: 1px solid var(--p3-glass-border); backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(var(--glass-sat)); }
.p3-toolbar[hidden] { display: none !important; }
.p3-toolbar-search { flex: 1 1 260px; min-width: 0; max-width: 460px; position: relative; }
.p3-toolbar-search:empty { display: none; }
.p3-toolbar-search::before { content: "\eb1c"; font-family: "tabler-icons"; position: absolute; left: 11px; top: 50%; transform: translateY(-50%); color: var(--tblr-secondary); pointer-events: none; }
.p3-toolbar-search input { width: 100% !important; padding-left: 34px; }
.p3-toolbar-filters { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-left: auto; }
.p3-toolbar-filters:empty { display: none; }
.p3-toolbar-filters .form-control, .p3-toolbar-filters .form-select { width: auto; }
.p3-filter-btn { display: none; }
.p3-side-user { margin-top: auto; display: flex; align-items: center; gap: 6px; padding: 12px 4px 4px; border-top: 1px solid var(--p3-glass-edge); }
.p3-side-user .p3-user { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; text-align: left; justify-content: flex-start; padding: 6px 8px; }
.p3-side-user .p3-user b { display: block; font-size: .88rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p3-side-user .p3-user small { display: block; font-size: .74rem; color: var(--tblr-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.p3-side-user .p3-user > span:last-child { min-width: 0; }
@media (max-width: 991px) {
  .p3-top { display: flex; align-items: center; gap: 6px; position: sticky; top: 0; z-index: 10; padding: 8px 12px; min-height: 56px;
    backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); background: color-mix(in srgb, var(--p3-plate) 80%, transparent); border-bottom: 1px solid var(--p3-glass-edge); transition: transform .22s ease; }
  .p3-top.hide { transform: translateY(-110%); }
  .p3-top .btn-icon, .p3-top .p3-user { min-width: 40px; min-height: 40px; }
  .p3-top-brand { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; font-family: var(--xl-font-sans); font-weight: 800; letter-spacing: -.02em; color: inherit; text-decoration: none; }
  .p3-top-brand img { height: 28px; width: auto; max-width: 140px; object-fit: contain; }
  .p3-top-brand .p3-logo { width: 26px; height: 26px; }
  .p3-top-brand span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .p3-top-brand.wide span { display: none; }
  .p3-top .p3-user { padding: 4px !important; }
  .p3-pagehead { padding: 14px 0 10px; gap: 10px; flex-wrap: nowrap; align-items: center; }
  .p3-titles { flex: 1 1 auto; }
  .p3-titles .page-title { font-size: 1.2rem; }
  .p3-titles .page-sub { font-size: .84rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .p3-head-actions { flex: none; flex-wrap: nowrap; }
  .p3-head-actions .btn:not(.btn-primary) { display: none; }
  .p3-head-actions .btn-primary.compact { font-size: 0 !important; width: 42px; height: 42px; padding: 0 !important; border-radius: 12px; justify-content: center; }
  .p3-head-actions .btn-primary.compact .ti { font-size: 21px !important; margin: 0 !important; }
  .p3-toolbar { flex-wrap: nowrap; padding: 6px; margin-bottom: 12px; }
  .p3-toolbar-search { max-width: none; flex: 1 1 auto; }
  .p3-toolbar-filters { display: none !important; }
  .p3-filter-btn { display: inline-flex; flex: none; min-height: 38px; align-items: center; }
  .p3-toolbar-search:empty ~ .p3-filter-btn { flex: 1; justify-content: center; }
  .p3-content > .alert { padding: 8px 12px; font-size: .85rem; margin-bottom: 10px !important; }
  .p3-content > .alert .btn { padding: 4px 10px; font-size: .8rem; }
  .p3-side-user { display: none; }
}
.p3-filter-body { display: grid; gap: 12px; }
.p3-filter-body > input, .p3-filter-body > select, .p3-filter-body > .form-control, .p3-filter-body > .form-select { width: 100% !important; min-height: 42px; }
.p3-filter-body > .btn, .p3-filter-body > a.btn { width: 100%; justify-content: flex-start; min-height: 44px; }
.p3-filter-field { display: grid; gap: 4px; margin: 0; }
.p3-filter-field > input, .p3-filter-field > select { width: 100% !important; min-height: 42px; }

/* v0.11 — Dashboard personalizável */
.kpi-delta { display: inline-flex; align-items: center; gap: 2px; font-weight: 600; font-size: .75rem; padding: 1px 6px; border-radius: 999px; font-variant-numeric: tabular-nums; }
.kpi-delta .ti { font-size: .85rem; }
.kpi-delta.up { color: var(--tblr-green); background: color-mix(in srgb, var(--tblr-green) 12%, transparent); }
.kpi-delta.down { color: var(--tblr-red); background: color-mix(in srgb, var(--tblr-red) 12%, transparent); }
.kpi-delta.flat { color: var(--tblr-secondary); background: color-mix(in srgb, currentColor 8%, transparent); }
.dash-grid .kpi .kpi-value { font-size: 1.55rem; }
.dash-card .card-title { font-size: .95rem; }
.dash-chart { position: relative; }
.dash-swatch { width: 12px; height: 12px; border-radius: 50%; flex: none; box-shadow: inset 0 0 0 1px rgba(0,0,0,.15); }
.dash-funnel { display: grid; gap: 10px; }
.dash-funnel-row { display: grid; grid-template-columns: 140px 1fr auto; gap: 10px; align-items: center; font-size: .85rem; }
.dash-funnel-label { color: var(--tblr-secondary); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-funnel-track { height: 12px; border-radius: 4px; background: color-mix(in srgb, currentColor 7%, transparent); overflow: hidden; }
.dash-funnel-bar { display: block; height: 100%; border-radius: 4px; background: var(--tblr-blue); }
.dash-funnel-bar.calcular { background: var(--tblr-yellow); } .dash-funnel-bar.enviado { background: var(--tblr-purple); }
.dash-funnel-bar.aprovado { background: var(--tblr-green); } .dash-funnel-bar.recusado { background: var(--tblr-red); }
.dash-funnel-val { font-variant-numeric: tabular-nums; white-space: nowrap; }
@media (max-width: 575px) { .dash-funnel-row { grid-template-columns: 1fr auto; } .dash-funnel-track { grid-column: 1 / -1; order: 3; } .dash-grid .kpi .kpi-value { font-size: 1.15rem; } .dash-grid .kpi .kpi-icon { display: none; } }
.min-w-0 { min-width: 0; }

.cz-list { display: grid; gap: 6px; }
.cz-item { display: grid; grid-template-columns: 20px minmax(0, 1fr) 150px auto; gap: 10px; align-items: center; padding: 8px 10px; border-radius: 12px; border: 1px solid var(--tblr-border-color); background: var(--tblr-bg-surface); opacity: .75; }
.cz-item.on { opacity: 1; border-color: color-mix(in srgb, var(--p3-accent) 35%, var(--tblr-border-color)); }
.cz-item.dragging { opacity: .4; }
.cz-grip { color: var(--tblr-secondary); cursor: grab; }
.cz-toggle .form-check-label { display: flex; flex-direction: column; min-width: 0; }
.cz-toggle b { font-size: .9rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cz-toggle small { font-size: .74rem; color: var(--tblr-secondary); display: inline-flex; align-items: center; gap: 4px; }
.cz-move { display: inline-flex; }
@media (max-width: 575px) {
  .cz-item { grid-template-columns: minmax(0, 1fr) auto; }
  .cz-grip { display: none; }
  .cz-size { grid-column: 1; }
  .cz-move { grid-row: 1 / span 2; grid-column: 2; flex-direction: column; }
}
.p3-captcha { margin: 4px 0 12px; min-height: 0; }
.p3-captcha:empty { margin: 0; }
/* Menu rola sozinho; a conta fica sempre visível no rodapé do menu */
@media (min-width: 992px) {
  .p3-side { overflow: hidden; }
  .p3-side .p3-nav { flex: 1 1 auto; min-height: 0; overflow-y: auto; margin: 0 -6px; padding: 0 6px; scrollbar-width: thin; }
}
.p3-toolbar-search:empty + .p3-toolbar-filters { margin-left: 0; }
.dash-dates { display: inline-flex; gap: 8px; }
.dash-dates[hidden] { display: none; }
.p3-filter-body .dash-dates { display: grid; grid-template-columns: 1fr 1fr; }
.p3-filter-body .dash-dates[hidden] { display: none; }

/* v0.12 — Preços nos marketplaces */
.mp-box { border-top: 1px dashed var(--tblr-border-color); padding-top: 14px; }
.mp-box h4 { font-size: .95rem; }
.mp-row { padding: 10px 0; display: grid; gap: 6px; }
.mp-row + .mp-row { border-top: 1px solid var(--tblr-border-color); }
.mp-head { display: flex; align-items: center; gap: 8px; }
.mp-logo { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; color: #fff; flex: none; }
.mp-logo.mercadolivre { background: #2d3277; color: #ffe600; }
.mp-logo.shopee { background: #ee4d2d; }
.mp-detail b { color: var(--tblr-body-color); font-weight: 600; }
.price-mp { font-family: var(--xl-font-mono); font-variant-numeric: tabular-nums; white-space: nowrap; }
.price-mp small { font-family: var(--xl-font-sans); }
.price-mp small { display: block; font-size: .7rem; color: var(--tblr-secondary); }

/* v0.13 — Lista com busca (combobox) */
.p3-combo { position: relative; }
.p3-combo-field { position: relative; }
.p3-combo-field > .ti { position: absolute; left: 12px; top: 50%; transform: translateY(-50%); color: var(--tblr-secondary); pointer-events: none; }
.p3-combo-field .form-control { padding-left: 36px; padding-right: 40px; }
.p3-combo-clear { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); }
.p3-combo-list { position: absolute; z-index: 30; left: 0; right: 0; top: calc(100% + 4px); max-height: 280px; overflow-y: auto; margin: 0; padding: 4px; list-style: none;
  background: var(--xl-elevated); border: 1px solid var(--xl-border); border-radius: var(--xl-radius-md); box-shadow: var(--xl-shadow-lg); }
.p3-combo-list li { padding: 10px 12px; border-radius: 8px; cursor: pointer; min-height: 44px; display: flex; align-items: center; }
.p3-combo-list li:hover, .p3-combo-list li:focus { background: color-mix(in srgb, var(--p3-accent) 12%, transparent); outline: none; }
.p3-combo-empty { color: var(--tblr-secondary); cursor: default !important; }

/* Botão de acessibilidade (Sienna): canto inferior direito, acima da barra do celular */
.asw-menu-btn { left: auto !important; right: 20px !important; bottom: calc(20px + env(safe-area-inset-bottom)) !important; }
.asw-menu { left: auto !important; right: 20px !important; }
@media (max-width: 991px) { .asw-menu-btn { right: 14px !important; bottom: calc(84px + env(safe-area-inset-bottom)) !important; } }

/* =====================================================================
   v0.13 — Sino de notificações, loja de extensões, anúncio com IA
   ===================================================================== */
.p3-side-head { display: flex; align-items: center; gap: 8px; padding: 4px 4px 18px; }
.p3-side-head .p3-brand { flex: 1; min-width: 0; padding: 4px 4px 0; }
.p3-bell { position: relative; flex: none; width: 40px; height: 40px; }
.p3-bell .ti { font-size: 1.3rem; }
.p3-bell-dot { position: absolute; top: 4px; right: 3px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--xl-coral); color: #fff; font-family: var(--xl-font-mono);
  font-size: .66rem; font-weight: 700; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--tblr-bg-surface); }
.p3-bell-dot[hidden] { display: none; }
.notif-list { display: grid; gap: 4px; }
.notif-item { display: flex; gap: 12px; align-items: flex-start; width: 100%; text-align: left; border: 0; background: transparent; color: inherit; padding: 12px 10px; border-radius: 12px; cursor: pointer; position: relative; min-height: 56px; }
.notif-item:hover, .notif-item:focus-visible { background: color-mix(in srgb, var(--p3-accent) 8%, transparent); outline: none; }
.notif-item.unread { background: color-mix(in srgb, var(--p3-accent) 6%, transparent); }
.notif-icon { width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; flex: none; background: color-mix(in srgb, var(--p3-accent) 14%, transparent); color: var(--p3-accent); font-size: 1.15rem; }
.notif-icon.stock, .notif-icon.delivery { background: color-mix(in srgb, var(--tblr-orange) 15%, transparent); color: var(--tblr-orange); }
.notif-icon.birthday { background: color-mix(in srgb, var(--tblr-pink) 15%, transparent); color: var(--tblr-pink); }
.notif-icon.support { background: color-mix(in srgb, var(--tblr-blue) 15%, transparent); color: var(--tblr-blue); }
.notif-icon.update { background: color-mix(in srgb, var(--tblr-purple) 15%, transparent); color: var(--tblr-purple); }
.notif-text { display: grid; gap: 2px; min-width: 0; flex: 1; }
.notif-text b { font-weight: 600; font-size: .92rem; }
.notif-text span { font-size: .85rem; color: var(--tblr-secondary); overflow-wrap: anywhere; }
.notif-text small { font-size: .74rem; color: var(--tblr-secondary); }
.notif-unread { width: 9px; height: 9px; border-radius: 50%; background: var(--xl-coral); flex: none; margin-top: 8px; }
.notif-media { width: 100%; max-height: 360px; object-fit: contain; border-radius: 12px; margin-bottom: 14px; background: #000; }
img.notif-media { background: transparent; }
.notif-video { position: relative; aspect-ratio: 16 / 9; margin-bottom: 14px; border-radius: 12px; overflow: hidden; }
.notif-video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

.ext-card { transition: box-shadow .15s, border-color .15s; cursor: pointer; }
.ext-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,.08); border-color: color-mix(in srgb, var(--p3-accent) 35%, var(--tblr-border-color)); }
.ext-card.locked .ext-icon { filter: grayscale(.8); opacity: .7; }
.ext-card .card-footer .btn { min-height: 40px; }
.ext-name { font-size: 1.02rem; }
.ext-icon { width: 46px; height: 46px; border-radius: var(--xl-radius-lg); display: grid; place-items: center; flex: none; font-size: 1.45rem; color: #fff; background: var(--xl-grad); }
.ext-icon.sm { width: 34px; height: 34px; border-radius: 10px; font-size: 1.1rem; }
.ext-icon.lg { width: 60px; height: 60px; border-radius: 18px; font-size: 1.9rem; }
.ext-icon.vendas { background: linear-gradient(35deg, #5B2A86, #A83885); } .ext-icon.catalogo { background: linear-gradient(35deg, #A83885, #F15362); } .ext-icon.alertas { background: linear-gradient(35deg, #F15362, #FFA149); }
.ext-icon.ia { background: linear-gradient(35deg, #53257E, #5B2A86 40%, #A83885); } .ext-icon.marketplaces { background: var(--xl-grad); }
.ext-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 8px; }
.ext-list li { display: flex; gap: 8px; align-items: flex-start; }
.ext-list .ti { color: var(--tblr-green); margin-top: 2px; }
.ext-matrix .ext-group td { background: color-mix(in srgb, currentColor 4%, transparent); font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; color: var(--tblr-secondary); }
.ext-matrix .form-switch .form-check-input { width: 2.6rem; height: 1.4rem; }
.al-block { border: 1px solid var(--tblr-border-color); border-radius: 12px; padding: 12px; margin-bottom: 10px; }
.al-text { white-space: pre-line; font-size: .92rem; }

/* =====================================================================
   v0.13 — Toque no celular e tablet: áreas de clique de pelo menos 44 px
   ===================================================================== */
@media (pointer: coarse) {
  .btn { min-height: 44px; }
  .btn-sm { min-height: 40px; padding-left: 12px; padding-right: 12px; }
  .btn-icon, .btn.btn-icon { min-width: 44px; min-height: 44px; }
  .btn-icon.btn-sm { min-width: 42px; min-height: 42px; }
  .form-control, .form-select { min-height: 44px; font-size: 16px; } /* 16 px evita o zoom automático do iOS */
  .form-control-sm, .form-select-sm { min-height: 40px; font-size: 15px; }
  textarea.form-control { min-height: 88px; }
  .chip { min-height: 40px; padding: 8px 14px; }
  .form-check { min-height: 32px; padding-top: 4px; }
  .form-check-input { width: 1.25rem; height: 1.25rem; }
  .form-switch .form-check-input { width: 2.5rem; height: 1.35rem; }
  .p3-nav a { min-height: 46px; }
  .table .btn-icon, .table .btn-sm { min-width: 44px; min-height: 44px; }
  .drawer-actions > button, .drawer-actions > a { min-height: 52px; }
  .dropdown-item { min-height: 44px; }
  .p3-tabs button { min-height: 48px; }
  .p3-seg button { min-height: 42px; }
  a.small, .small a { padding-block: 6px; display: inline-block; }
}
/* Tablet (768 a 1199 px): menu lateral mais estreito e conteúdo aproveitando a largura */
@media (min-width: 992px) and (max-width: 1199px) {
  .p3-shell { grid-template-columns: 220px 1fr; }
  .p3-content { padding-left: 20px; padding-right: 20px; }
  .p3-brand img { max-width: 150px; }
}
@media (min-width: 768px) and (max-width: 991px) {
  .p3-content { padding-left: 24px; padding-right: 24px; }
  .q-board { grid-auto-columns: 46%; }
}
/* Áreas seguras (notch e barra do iPhone) quando instalado como app */
@supports (padding: env(safe-area-inset-top)) {
  @media (max-width: 991px) { .p3-top { padding-top: calc(8px + env(safe-area-inset-top)); padding-left: calc(12px + env(safe-area-inset-left)); padding-right: calc(12px + env(safe-area-inset-right)); } }
  .p3-content { padding-bottom: calc(48px + env(safe-area-inset-bottom)); }
  dialog.p3-drawer .modal-footer { padding-bottom: calc(12px + env(safe-area-inset-bottom)) !important; }
}
@media (display-mode: standalone) { body { overscroll-behavior-y: contain; } }
@media (max-width: 575px) { [data-savebar] .msg { display: none; } [data-savebar] .btn { width: 100%; } }
/* App da App Store: sem links de compra/upgrade (regra 3.1.1 da Apple) */
.ios-app a[href^="/app/assinatura.html"], .ios-app [data-buy], .ios-app .p3-nav a[href="/app/assinatura.html"] { display: none !important; }

/* =====================================================================
   v0.14 — Admin › Aparência e liquid glass
   ===================================================================== */
.glass-value { font-size: 2.25rem; font-weight: 700; line-height: 1; min-width: 3ch; text-align: right; background: var(--xl-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.glass-range { display: grid; grid-template-columns: auto 1fr auto; gap: 16px; align-items: center; }
.glass-end { display: inline-flex; align-items: center; gap: 6px; font-size: .75rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--xl-muted); white-space: nowrap; }
.glass-range .form-range { height: 28px; --fill: 60%; }
.glass-range .form-range::-webkit-slider-runnable-track { height: 8px; border-radius: 99px; background: linear-gradient(90deg, #5B2A86 0%, #A83885 calc(var(--fill) * .5), #F15362 var(--fill), var(--xl-border) var(--fill)); }
.glass-range .form-range::-moz-range-track { height: 8px; border-radius: 99px; background: var(--xl-border); }
.glass-range .form-range::-moz-range-progress { height: 8px; border-radius: 99px; background: var(--xl-grad); }
.glass-range .form-range::-webkit-slider-thumb { width: 24px; height: 24px; margin-top: -8px; border-radius: 50%; background: #FFFFFF; border: 3px solid var(--xl-coral); box-shadow: var(--xl-glow); }
.glass-range .form-range::-moz-range-thumb { width: 18px; height: 18px; border-radius: 50%; background: #FFFFFF; border: 3px solid var(--xl-coral); box-shadow: var(--xl-glow); }
@media (max-width: 575px) { .glass-range { grid-template-columns: 1fr 1fr; } .glass-range .form-range { grid-column: 1 / -1; grid-row: 1; } .glass-end:last-child { justify-self: end; } }
.theme-pick { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
@media (max-width: 575px) { .theme-pick { grid-template-columns: 1fr; } }
.theme-opt { all: unset; box-sizing: border-box; cursor: pointer; display: flex; gap: 12px; align-items: center; padding: 12px; border-radius: var(--xl-radius-md); border: 1px solid var(--xl-border); background: var(--xl-bg); min-height: 64px; }
.theme-opt:hover { border-color: var(--xl-muted); }
.theme-opt[aria-checked="true"] { border-color: var(--xl-coral); background: var(--xl-grad-subtle), var(--xl-bg); box-shadow: 0 0 0 3px rgba(241, 83, 98, .15); }
.theme-opt:focus-visible { outline: 2px solid var(--xl-focus); outline-offset: 2px; }
.theme-opt b { display: block; font-size: .875rem; }
.theme-opt small { display: block; font-size: .75rem; color: var(--xl-muted); }
.theme-swatch { width: 34px; height: 34px; border-radius: var(--xl-radius-sm); flex: none; border: 1px solid var(--xl-border); }
.theme-swatch.dark { background: linear-gradient(135deg, #1F2126 50%, #282B32 50%); }
.theme-swatch.light { background: linear-gradient(135deg, #F8FAFC 50%, #FFFFFF 50%); }
.theme-swatch.auto { background: linear-gradient(135deg, #1F2126 50%, #F8FAFC 50%); }
.seg-mini { display: inline-flex; gap: 2px; padding: 2px; border-radius: var(--xl-radius-full); border: 1px solid var(--xl-border); text-transform: none; letter-spacing: 0; }
.seg-mini button { border: 0; background: transparent; color: var(--xl-muted); width: 30px; height: 26px; border-radius: var(--xl-radius-full); display: grid; place-items: center; }
.seg-mini button[aria-pressed="true"] { background: var(--xl-surface); color: var(--xl-text); }
/* Palco da prévia: fundo com cores fortes para o vidro ficar visível */
.glass-stage { position: relative; overflow: hidden; border-radius: var(--xl-radius-lg); border: 1px solid var(--xl-border); background: var(--xl-bg); padding: 20px; min-height: 340px; color: var(--xl-text); isolation: isolate; }
.glass-blob { position: absolute; border-radius: 50%; z-index: -1; filter: blur(2px); opacity: calc(.35 + var(--glass) * .65); }
.glass-blob.a { width: 220px; height: 220px; right: -40px; top: -50px; background: radial-gradient(circle at 35% 35%, #FFA149, #F15362 60%, transparent 72%); }
.glass-blob.b { width: 260px; height: 260px; left: -70px; bottom: -90px; background: radial-gradient(circle at 60% 40%, #A83885, #5B2A86 60%, transparent 72%); }
.glass-blob.c { width: 120px; height: 120px; left: 46%; top: 42%; background: radial-gradient(circle, #F15362, transparent 70%); }
.glass-mock { display: grid; grid-template-columns: 150px 1fr; gap: 14px; }
.glass-mock-side { border-radius: var(--xl-radius-md); padding: 12px; display: grid; align-content: start; gap: 4px; }
.glass-mock-side .xl-wordmark { font-size: .9rem; }
.glass-mock-side a { display: flex; align-items: center; gap: 8px; font-size: .75rem; font-weight: 500; color: var(--xl-text-2); padding: 6px 8px; border-radius: var(--xl-radius-sm); border: 1px solid transparent; }
.glass-mock-side a.active { background: var(--xl-grad-subtle); border-color: rgba(241, 83, 98, .35); color: var(--xl-text); }
.glass-mock-side a.active .ti { color: var(--xl-accent); }
.glass-mock-main { display: grid; gap: 14px; align-content: start; }
.glass-mock-main .kpi-value { font-size: 1.5rem; }
.xl-mark.sm { width: 24px; height: 24px; }
@media (max-width: 575px) { .glass-mock { grid-template-columns: 1fr; } .glass-mock-side { display: none; } }

.brand-files { display: grid; gap: 8px; }
.brand-file { display: flex; align-items: center; gap: 12px; padding: 8px 12px 8px 8px; border-radius: var(--xl-radius-md); border: 1px solid var(--xl-border); color: var(--xl-text); text-decoration: none; background: var(--xl-bg); min-height: 56px; }
.brand-file:hover { border-color: var(--xl-muted); color: var(--xl-text); }
.brand-file b { display: block; font-size: .875rem; }
.brand-file small { display: block; font-size: .72rem; color: var(--xl-muted); }
.brand-file-pv { width: 92px; height: 44px; border-radius: var(--xl-radius-sm); display: grid; place-items: center; flex: none; padding: 4px 6px; border: 1px solid var(--xl-border); }
.brand-file-pv img { width: 100%; height: 100%; object-fit: contain; display: block; }
.brand-file-pv.dark { background: #1F2126; } .brand-file-pv.light { background: #F8FAFC; }
.brand-file-pv.checker { background-color: #1B1D22; background-image: linear-gradient(45deg, #23262E 25%, transparent 25%), linear-gradient(-45deg, #23262E 25%, transparent 25%), linear-gradient(45deg, transparent 75%, #23262E 75%), linear-gradient(-45deg, transparent 75%, #23262E 75%); background-size: 12px 12px; background-position: 0 0, 0 6px, 6px -6px, -6px 0; }