/**
 * GCT — modelos visuais (Configurações → Parâmetros → visual_modelo).
 * Modelo 1 = visual padrão (sem overrides). 2–5 mudam o degradê e as grades,
 * sempre na identidade Querity (verde #2d9f5f / #1a6b42 / #14532d).
 */

/* ——— Variáveis por modelo ——— */
body.gct-visual-2 {
  --gct-v-accent: #2d9f5f;
  --gct-v-accent-deep: #14532d;
  --gct-v-header-from: #ecfdf5;
  --gct-v-header-to: #d1fae5;
  --gct-v-header-line: #2d9f5f;
  --gct-v-header-color: #14532d;
  --gct-v-zebra: rgba(16, 185, 129, 0.05);
  --gct-v-grid: rgba(15, 23, 42, 0.075);
  --gct-v-hover: linear-gradient(90deg, rgba(45, 159, 95, 0.1), rgba(16, 185, 129, 0.03));
  --gct-v-frame: rgba(45, 159, 95, 0.28);
  --gct-v-rail: #2d9f5f;
  --gct-v-card-glow: 0 22px 48px rgba(2, 24, 12, 0.22);
}

body.gct-visual-3 {
  --gct-v-accent: #ca8a04;
  --gct-v-accent-deep: #1a6b42;
  --gct-v-header-from: #fffbeb;
  --gct-v-header-to: #ecfdf5;
  --gct-v-header-line: #ca8a04;
  --gct-v-header-color: #14532d;
  --gct-v-zebra: rgba(253, 230, 138, 0.28);
  --gct-v-grid: rgba(120, 53, 15, 0.08);
  --gct-v-hover: linear-gradient(90deg, rgba(45, 159, 95, 0.08), rgba(245, 158, 11, 0.08));
  --gct-v-frame: rgba(202, 138, 4, 0.28);
  --gct-v-rail: #ca8a04;
  --gct-v-card-glow: 0 22px 48px rgba(28, 18, 4, 0.2);
}

body.gct-visual-4 {
  --gct-v-accent: #34d399;
  --gct-v-accent-deep: #047857;
  --gct-v-header-from: #f0fdf4;
  --gct-v-header-to: #ffffff;
  --gct-v-header-line: #10b981;
  --gct-v-header-color: #064e3b;
  --gct-v-zebra: rgba(240, 253, 244, 0.9);
  --gct-v-grid: rgba(6, 78, 59, 0.08);
  --gct-v-hover: linear-gradient(90deg, rgba(16, 185, 129, 0.1), rgba(45, 159, 95, 0.04));
  --gct-v-frame: rgba(16, 185, 129, 0.26);
  --gct-v-rail: #10b981;
  --gct-v-card-glow: 0 20px 44px rgba(4, 47, 32, 0.16);
}

body.gct-visual-5 {
  --gct-v-accent: #4ade80;
  --gct-v-accent-deep: #052e16;
  --gct-v-header-from: #166534;
  --gct-v-header-to: #14532d;
  --gct-v-header-line: #86efac;
  --gct-v-header-color: #ecfdf5;
  --gct-v-zebra: rgba(15, 23, 42, 0.035);
  --gct-v-grid: rgba(15, 23, 42, 0.1);
  --gct-v-hover: linear-gradient(90deg, rgba(45, 159, 95, 0.12), rgba(15, 23, 42, 0.03));
  --gct-v-frame: rgba(20, 83, 45, 0.45);
  --gct-v-rail: #4ade80;
  --gct-v-card-glow: 0 24px 56px rgba(1, 8, 6, 0.38);
}

/* ——— Fundos (app) ——— */
html:has(body.gct-visual-2) { background-color: #010806; }
html:has(body.gct-visual-3) { background-color: #07140a; }
html:has(body.gct-visual-4) { background-color: #022c1a; }
html:has(body.gct-visual-5) { background-color: #020617; }

body.wash-app.gct-visual-2 {
  background-color: #010806;
  background-image:
    radial-gradient(ellipse 95% 70% at 12% -8%, rgba(16, 185, 129, 0.5), transparent 52%),
    radial-gradient(ellipse 70% 55% at 100% 8%, rgba(45, 159, 95, 0.22), transparent 48%),
    radial-gradient(ellipse 80% 45% at 48% 108%, rgba(5, 46, 22, 0.95), transparent 52%),
    linear-gradient(168deg, #010806 0%, #052e16 36%, #14532d 70%, #0a1f12 100%);
}

body.wash-app.gct-visual-3 {
  background-color: #07140a;
  background-image:
    radial-gradient(ellipse 85% 60% at 88% -8%, rgba(245, 158, 11, 0.34), transparent 52%),
    radial-gradient(ellipse 90% 70% at 8% 0%, rgba(45, 159, 95, 0.42), transparent 50%),
    radial-gradient(ellipse 55% 40% at 50% 100%, rgba(180, 83, 9, 0.2), transparent 50%),
    linear-gradient(158deg, #03140a 0%, #0f2416 38%, #1a3a1a 68%, #2a2410 100%);
}

body.wash-app.gct-visual-4 {
  background-color: #022c1a;
  background-image:
    radial-gradient(ellipse 110% 80% at 50% -28%, rgba(94, 208, 138, 0.55), transparent 56%),
    radial-gradient(ellipse 60% 45% at 0% 85%, rgba(45, 159, 95, 0.22), transparent 50%),
    radial-gradient(ellipse 50% 40% at 100% 100%, rgba(16, 185, 129, 0.2), transparent 48%),
    linear-gradient(175deg, #021a10 0%, #0a3d24 42%, #166534 78%, #1a6b42 100%);
}

body.wash-app.gct-visual-5 {
  background-color: #020617;
  background-image:
    radial-gradient(ellipse 55% 48% at 0% 0%, rgba(45, 159, 95, 0.42), transparent 52%),
    radial-gradient(ellipse 50% 55% at 100% 100%, rgba(20, 83, 45, 0.55), transparent 50%),
    radial-gradient(ellipse 40% 30% at 50% 50%, rgba(15, 23, 42, 0.35), transparent 70%),
    linear-gradient(180deg, #020617 0%, #0b1f14 48%, #020617 100%);
}

body.wash-app.gct-visual-2::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='72' height='72' viewBox='0 0 72 72'%3E%3Cg fill='none' stroke='%234ade80' stroke-opacity='0.07'%3E%3Cpath d='M0 36h72M36 0v72'/%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.85;
}

body.wash-app.gct-visual-3::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='%23fbbf24' stroke-opacity='0.08'%3E%3Cpath d='M-8 28l28-28M0 56l56-56M28 56l28-28'/%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.7;
}

body.wash-app.gct-visual-4::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23ffffff' stroke-opacity='0.045'%3E%3Cpath d='M0 40h40M40 0v40'/%3E%3C/g%3E%3C/svg%3E");
  opacity: 0.95;
}

body.wash-app.gct-visual-5::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Ccircle cx='1' cy='1' r='0.8' fill='%23ffffff' fill-opacity='0.06'/%3E%3C/svg%3E");
  opacity: 1;
}

/* ——— Fundos (login / auth) ——— */
body.wash-auth.gct-visual-2 {
  background-color: #010806;
  background-image:
    radial-gradient(ellipse 100% 70% at 50% -18%, rgba(16, 185, 129, 0.55), transparent 55%),
    radial-gradient(ellipse 70% 55% at 110% 60%, rgba(45, 159, 95, 0.28), transparent 48%),
    radial-gradient(ellipse 55% 45% at -8% 90%, rgba(5, 46, 22, 0.7), transparent 50%),
    linear-gradient(165deg, #010806 0%, #052e16 42%, #14532d 100%);
}

body.wash-auth.gct-visual-3 {
  background-color: #07140a;
  background-image:
    radial-gradient(ellipse 90% 65% at 80% -10%, rgba(245, 158, 11, 0.4), transparent 52%),
    radial-gradient(ellipse 90% 70% at 10% 0%, rgba(45, 159, 95, 0.48), transparent 50%),
    linear-gradient(160deg, #03140a 0%, #0f2416 45%, #3f2e0a 100%);
}

body.wash-auth.gct-visual-4 {
  background-color: #022c1a;
  background-image:
    radial-gradient(ellipse 110% 80% at 50% -22%, rgba(94, 208, 138, 0.58), transparent 55%),
    radial-gradient(ellipse 60% 50% at 100% 80%, rgba(16, 185, 129, 0.22), transparent 50%),
    linear-gradient(175deg, #021a10 0%, #0a3d24 50%, #1a6b42 100%);
}

body.wash-auth.gct-visual-5 {
  background-color: #020617;
  background-image:
    radial-gradient(ellipse 70% 55% at 0% 0%, rgba(45, 159, 95, 0.48), transparent 52%),
    radial-gradient(ellipse 60% 60% at 100% 100%, rgba(20, 83, 45, 0.5), transparent 50%),
    linear-gradient(180deg, #020617 0%, #0b1f14 50%, #020617 100%);
}

/* ——— Grades / tabelas (modelos 2–5) ——— */
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table-responsive,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-data-card,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-users-card {
  border: 1px solid var(--gct-v-frame);
  border-top: 2px solid var(--gct-v-accent);
  border-radius: 10px;
  background: #fff;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.7) inset,
    var(--gct-v-card-glow);
  overflow: hidden;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5)
  .gct-data-card
  .table-responsive,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5)
  .gct-users-card
  .table-responsive {
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table {
  --bs-table-border-color: var(--gct-v-grid);
  border-collapse: separate;
  border-spacing: 0;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table > :not(caption) > * > * {
  border-right: 1px solid var(--gct-v-grid);
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5)
  .table
  > :not(caption)
  > *
  > *:last-child {
  border-right: none;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table thead th,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-data-table thead th,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-users-table thead th,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-report-table thead th,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .gct-param-table th {
  background: linear-gradient(180deg, var(--gct-v-header-from), var(--gct-v-header-to)) !important;
  color: var(--gct-v-header-color) !important;
  border-bottom: 0 !important;
  box-shadow: inset 0 -2px 0 var(--gct-v-header-line);
  letter-spacing: 0.04em;
  font-weight: 700;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table tbody tr:nth-child(even) > * {
  background-color: var(--gct-v-zebra);
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table-hover > tbody > tr:hover > *,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table tbody tr:hover > * {
  --bs-table-accent-bg: transparent;
  background: var(--gct-v-hover) !important;
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5)
  .table
  tbody
  tr:hover
  > *:first-child {
  box-shadow: inset 3px 0 0 var(--gct-v-rail);
}

body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table tfoot td,
body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5) .table tfoot th {
  background: linear-gradient(180deg, #f8fafc, #f1f5f9) !important;
  border-top: 2px solid var(--gct-v-header-line) !important;
  font-weight: 700;
}

body.gct-visual-5 .gct-param-chave code {
  background: rgba(15, 23, 42, 0.08);
  color: #334155;
}

@media print {
  body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5),
  body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5).wash-app,
  body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5).wash-auth {
    background: #fff !important;
  }
  body:is(.gct-visual-2, .gct-visual-3, .gct-visual-4, .gct-visual-5)::before {
    display: none !important;
  }
}