/* Temas predefinidos — variáveis sobrescritas por data-pp-layout */

[data-pp-layout="ocean"] {
  --pp-primary: #0ea5e9;
  --pp-primary-mid: #0284c7;
  --pp-primary-dark: #0369a1;
  --pp-primary-deep: #0c4a6e;
  --pp-primary-light: #38bdf8;
  --pp-primary-glow: #7dd3fc;
  --pp-accent: #22d3ee;
  --pp-primary-rgb: 14, 165, 233;
  --pp-primary-dark-rgb: 3, 105, 161;
  --pp-primary-deep-rgb: 12, 74, 110;
  --pp-accent-rgb: 34, 211, 238;
  --pp-primary-surface: #f0f9ff;
  --pp-primary-surface-2: #e0f2fe;
  --pp-primary-border: #bae6fd;
  --pp-bg: #f0f9ff;
  --pp-gradient-hero: linear-gradient(125deg, #0c4a6e 0%, #0369a1 34%, #0ea5e9 72%, #22d3ee 100%);
  --pp-gradient-brand: linear-gradient(135deg, #0284c7 0%, #0ea5e9 55%, #38bdf8 100%);
  --pp-gradient-soft: linear-gradient(180deg, #f0f9ff 0%, #ffffff 100%);
  --pp-gradient-accent: linear-gradient(135deg, #e0f2fe 0%, #f0f9ff 48%, #ffffff 100%);
  --pp-gradient-final: linear-gradient(135deg, #bae6fd 0%, #e0f2fe 45%, #f0f9ff 100%);
  --pp-gradient-page: linear-gradient(160deg, #e0f2fe 0%, #f1f5f9 42%, #e2e8f0 100%);
  --pp-gradient-login: radial-gradient(circle at top left, rgba(34, 211, 238, 0.22), transparent 36%),
    linear-gradient(145deg, #e0f2fe 0%, #ffffff 46%, #bae6fd 100%);
  --pp-shadow: 0 18px 48px rgba(12, 74, 110, 0.14);
  --pp-shadow-soft: 0 12px 32px rgba(12, 74, 110, 0.08);
  --pp-shadow-btn: 0 4px 14px rgba(14, 165, 233, 0.28);
}

[data-pp-layout="slate"] {
  --pp-primary: #6366f1;
  --pp-primary-mid: #4f46e5;
  --pp-primary-dark: #4338ca;
  --pp-primary-deep: #312e81;
  --pp-primary-light: #818cf8;
  --pp-primary-glow: #a5b4fc;
  --pp-accent: #8b5cf6;
  --pp-primary-rgb: 99, 102, 241;
  --pp-primary-dark-rgb: 67, 56, 202;
  --pp-primary-deep-rgb: 49, 46, 129;
  --pp-accent-rgb: 139, 92, 246;
  --pp-primary-surface: #eef2ff;
  --pp-primary-surface-2: #e0e7ff;
  --pp-primary-border: #c7d2fe;
  --pp-bg: #f5f3ff;
  --pp-gradient-hero: linear-gradient(125deg, #312e81 0%, #4338ca 34%, #6366f1 72%, #8b5cf6 100%);
  --pp-gradient-brand: linear-gradient(135deg, #4f46e5 0%, #6366f1 55%, #818cf8 100%);
  --pp-gradient-soft: linear-gradient(180deg, #f5f3ff 0%, #ffffff 100%);
  --pp-gradient-accent: linear-gradient(135deg, #e0e7ff 0%, #eef2ff 48%, #ffffff 100%);
  --pp-gradient-final: linear-gradient(135deg, #c7d2fe 0%, #e0e7ff 45%, #eef2ff 100%);
  --pp-gradient-page: linear-gradient(160deg, #eef2ff 0%, #f1f5f9 42%, #e2e8f0 100%);
  --pp-gradient-login: radial-gradient(circle at top left, rgba(139, 92, 246, 0.2), transparent 36%),
    linear-gradient(145deg, #eef2ff 0%, #ffffff 46%, #e0e7ff 100%);
  --pp-shadow: 0 18px 48px rgba(49, 46, 129, 0.14);
  --pp-shadow-soft: 0 12px 32px rgba(49, 46, 129, 0.08);
  --pp-shadow-btn: 0 4px 14px rgba(99, 102, 241, 0.28);
}

[data-pp-layout="amber"] {
  --pp-primary: #f59e0b;
  --pp-primary-mid: #d97706;
  --pp-primary-dark: #b45309;
  --pp-primary-deep: #92400e;
  --pp-primary-light: #fbbf24;
  --pp-primary-glow: #fcd34d;
  --pp-accent: #fb923c;
  --pp-primary-rgb: 245, 158, 11;
  --pp-primary-dark-rgb: 180, 83, 9;
  --pp-primary-deep-rgb: 146, 64, 14;
  --pp-accent-rgb: 251, 146, 60;
  --pp-primary-surface: #fffbeb;
  --pp-primary-surface-2: #fef3c7;
  --pp-primary-border: #fde68a;
  --pp-bg: #fffbeb;
  --pp-gradient-hero: linear-gradient(125deg, #92400e 0%, #b45309 34%, #f59e0b 72%, #fb923c 100%);
  --pp-gradient-brand: linear-gradient(135deg, #d97706 0%, #f59e0b 55%, #fbbf24 100%);
  --pp-gradient-soft: linear-gradient(180deg, #fffbeb 0%, #ffffff 100%);
  --pp-gradient-accent: linear-gradient(135deg, #fef3c7 0%, #fffbeb 48%, #ffffff 100%);
  --pp-gradient-final: linear-gradient(135deg, #fde68a 0%, #fef3c7 45%, #fffbeb 100%);
  --pp-gradient-page: linear-gradient(160deg, #fef3c7 0%, #f8fafc 42%, #f1f5f9 100%);
  --pp-gradient-login: radial-gradient(circle at top left, rgba(251, 146, 60, 0.2), transparent 36%),
    linear-gradient(145deg, #fffbeb 0%, #ffffff 46%, #fef3c7 100%);
  --pp-shadow: 0 18px 48px rgba(146, 64, 14, 0.14);
  --pp-shadow-soft: 0 12px 32px rgba(146, 64, 14, 0.08);
  --pp-shadow-btn: 0 4px 14px rgba(245, 158, 11, 0.28);
}

[data-pp-layout="rose"] {
  --pp-primary: #f43f5e;
  --pp-primary-mid: #e11d48;
  --pp-primary-dark: #be123c;
  --pp-primary-deep: #9f1239;
  --pp-primary-light: #fb7185;
  --pp-primary-glow: #fda4af;
  --pp-accent: #ec4899;
  --pp-primary-rgb: 244, 63, 94;
  --pp-primary-dark-rgb: 190, 18, 60;
  --pp-primary-deep-rgb: 159, 18, 57;
  --pp-accent-rgb: 236, 72, 153;
  --pp-primary-surface: #fff1f2;
  --pp-primary-surface-2: #ffe4e6;
  --pp-primary-border: #fecdd3;
  --pp-bg: #fff1f2;
  --pp-gradient-hero: linear-gradient(125deg, #9f1239 0%, #be123c 34%, #f43f5e 72%, #ec4899 100%);
  --pp-gradient-brand: linear-gradient(135deg, #e11d48 0%, #f43f5e 55%, #fb7185 100%);
  --pp-gradient-soft: linear-gradient(180deg, #fff1f2 0%, #ffffff 100%);
  --pp-gradient-accent: linear-gradient(135deg, #ffe4e6 0%, #fff1f2 48%, #ffffff 100%);
  --pp-gradient-final: linear-gradient(135deg, #fecdd3 0%, #ffe4e6 45%, #fff1f2 100%);
  --pp-gradient-page: linear-gradient(160deg, #ffe4e6 0%, #f8fafc 42%, #f1f5f9 100%);
  --pp-gradient-login: radial-gradient(circle at top left, rgba(236, 72, 153, 0.2), transparent 36%),
    linear-gradient(145deg, #fff1f2 0%, #ffffff 46%, #ffe4e6 100%);
  --pp-shadow: 0 18px 48px rgba(159, 18, 57, 0.14);
  --pp-shadow-soft: 0 12px 32px rgba(159, 18, 57, 0.08);
  --pp-shadow-btn: 0 4px 14px rgba(244, 63, 94, 0.28);
}

/* Modificadores estruturais */

[data-pp-sidebar="compact"] .app-shell {
  grid-template-columns: 220px minmax(0, 1fr);
}

[data-pp-sidebar="default"] .app-shell {
  grid-template-columns: var(--pp-sidebar-width) minmax(0, 1fr);
}

[data-pp-grid="compact"] .pp-grid thead th {
  padding: 5px 8px;
  font-size: 0.62rem;
}

[data-pp-grid="compact"] .pp-grid tbody td,
[data-pp-grid="compact"] .pp-grid tfoot th,
[data-pp-grid="compact"] .pp-grid tfoot td {
  padding: 4px 8px;
  font-size: 0.74rem;
}

[data-pp-grid="compact"] .page-header h1 {
  font-size: 1.25rem;
}

[data-pp-grid="comfortable"] .pp-grid thead th {
  padding: 9px 14px;
  font-size: 0.7rem;
}

[data-pp-grid="comfortable"] .pp-grid tbody td,
[data-pp-grid="comfortable"] .pp-grid tfoot th,
[data-pp-grid="comfortable"] .pp-grid tfoot td {
  padding: 8px 14px;
  font-size: 0.84rem;
}

[data-pp-grid="comfortable"] .page-header h1 {
  font-size: clamp(1.35rem, 2.2vw, 1.9rem);
}
