/* DPPK Dynamic Theme CSS - Generated from theme-config.json */
:root {
  --theme-primary-color: #1E40AF;
  --app-primary-color: #1E40AF;
  --dapen-red-primary: #1E40AF;
  --theme-primary-color-rgb: 30,64,175;
  --theme-secondary-color: #FFCC00;
  --app-secondary-color: #FFCC00;
  --dapen-red-secondary: #FFCC00;
  --theme-accent-color: #22C55E;
  --app-accent-color: #22C55E;
  --dapen-red-accent: #22C55E;
  --theme-button-primary-color: #356594;
  --theme-button-back-color: #6c757d;
  --theme-button-delete-color: #dc3545;
  --theme-app-name: "DAPEN BTN";
  --theme-app-subname: "PPIP dan PPMP CORESYSTEM";
  --theme-background-image: url('/images/dapen-bg.svg');
  --app-background-image: url('/images/dapen-bg.svg');
  --theme-logo-url: url('/css/images/logo-ojk.png');
  --theme-favicon-url: url('/css/images/logo-ojk.png');

  /* Calculated theme colors */
  --dapen-red-muted: color-mix(in srgb, var(--theme-primary-color) 70%, black 30%);
  --dapen-red-soft: color-mix(in srgb, var(--theme-primary-color) 80%, black 20%);
  --dapen-red-header: color-mix(in srgb, var(--theme-primary-color) 85%, black 15%);
  --dapen-red-header-light: color-mix(in srgb, var(--theme-primary-color) 75%, black 25%);
  --dapen-red-subtle: color-mix(in srgb, var(--theme-primary-color) 8%, transparent 92%);

  /* Dynamic gradients */
  --dapen-gradient-primary: linear-gradient(135deg, var(--dapen-red-primary) 0%, var(--dapen-red-accent) 100%);
  --dapen-gradient-extended: linear-gradient(135deg, var(--dapen-red-primary) 0%, var(--dapen-red-accent) 100%);
  --dapen-gradient-header: linear-gradient(90deg, var(--dapen-red-primary) 0%, var(--dapen-red-accent) 100%);
  --dapen-gradient-header-soft: linear-gradient(135deg, var(--dapen-red-primary) 0%, var(--theme-accent-color) 100%);
}

/* Navbar/Header - tema DAPEN BTN dengan pola rasi bintang */
.tr-header {
  background-image: url('/images/header-pattern.svg'), var(--dapen-gradient-header) !important;
  background-size: 320px 80px, 100% 100% !important;
  background-position: 0 0, 0 0 !important;
  background-repeat: repeat, no-repeat !important;
}

/* Theme-aware utility classes */
.theme-bg-primary { background-color: var(--theme-primary-color) !important; }
.theme-text-primary { color: var(--theme-primary-color) !important; }
.theme-border-primary { border-color: var(--theme-primary-color) !important; }
.theme-bg-secondary { background-color: var(--theme-secondary-color) !important; }
.theme-text-secondary { color: var(--theme-secondary-color) !important; }
.theme-bg-accent { background-color: var(--theme-accent-color) !important; }
.theme-text-accent { color: var(--theme-accent-color) !important; }

/* Button-specific classes use button colors instead of theme colors */
.btn-primary { background-color: var(--theme-button-primary-color) !important; border-color: var(--theme-button-primary-color) !important; }
.btn-back { background-color: var(--theme-button-back-color) !important; border-color: var(--theme-button-back-color) !important; color: #ffffff !important; }
.btn-delete { background-color: var(--theme-button-delete-color) !important; border-color: var(--theme-button-delete-color) !important; color: #ffffff !important; }