/* GPBank identity-only layer. Layout, spacing, typography and components stay
   in the original Pages build; this file changes branded color surfaces only. */
:root {
  --gp-orange: #f7941d;
  --gp-red: #ef4130;
  --gp-deep: #8f2c29;
  --gp-soft: #fff3eb;
  --gp-soft-2: #ffe5d8;
  --gp-border: #e7b9a7;
}

.bg-quik-gradient,
.bg-vpbank-gradient,
.bg-vpbank-brand,
.bg-vietcombank-gradient {
  background-image: linear-gradient(135deg, var(--gp-red), var(--gp-orange) 54%, #d95732) !important;
  background-color: transparent !important;
}

.bg-vpbank-merchant {
  background: linear-gradient(155deg, #8f2c29 0%, var(--gp-red) 34%, var(--gp-orange) 100%) !important;
}

.bg-vpbank-merchant-bar {
  background: #6f2928 !important;
}

.bg-vpbank-merchant-card {
  background: linear-gradient(135deg, #9f3b2d, #6f2928) !important;
}

.pro-btn-grad {
  background-image: linear-gradient(100deg, var(--gp-red), var(--gp-orange) 58%, #d95732) !important;
}

[class*="bg-[#00b167]"],
[class*="bg-[#009a59]"],
[class*="bg-[#007e49]"],
[class*="bg-[#13c97a]"],
[class*="bg-[#28c785]"],
[class*="bg-[#57d6a1]"],
[class*="bg-vpbank/"],
[class~="bg-vpbank"],
[class*="bg-vietcombank/"] {
  background-color: var(--gp-red) !important;
}

[class*="bg-[#e6f9f1]"],
[class*="bg-[#c0f0dc]"],
[class*="bg-[#93e5c3]"],
[class*="bg-vpbank-50"],
[class*="bg-vpbank-100"],
[class*="bg-quik-blue-50"],
[class*="bg-vietcombank-50"] {
  background-color: var(--gp-soft) !important;
}

[class*="text-[#00b167]"],
[class*="text-[#009a59]"],
[class*="text-[#007e49]"],
[class*="text-[#003f25]"],
[class*="text-[#054c2e]"],
[class*="text-[#13c97a]"],
[class*="text-[#28c785]"],
[class*="text-[#57d6a1]"],
[class~="text-vpbank"],
[class*="text-vpbank-"],
[class*="text-vietcombank"] {
  color: var(--gp-deep) !important;
}

[class*="text-[#c0f0dc]"],
[class*="text-[#9fe7c9]"],
[class*="text-diamond-platinum"] {
  color: rgba(255, 235, 225, .9) !important;
}

[class*="border-[#00b167]"],
[class*="border-[#009a59]"],
[class*="border-[#007e49]"],
[class*="border-[#93e5c3]"],
[class*="border-vpbank"],
[class*="border-vietcombank"],
[class*="border-quik-blue"] {
  border-color: var(--gp-border) !important;
}

[class~="bg-quik-blue"],
[class~="bg-quik-blue-dark"],
[class~="bg-vietcombank"] {
  background-color: var(--gp-deep) !important;
  background-image: none !important;
}

[class~="bg-quik-orange"],
[class~="bg-quik-orange-50"] {
  background-color: var(--gp-orange) !important;
}

[class~="text-quik-blue"],
[class~="text-quik-blue-dark"],
[class~="text-vietcombank-deep"],
[class~="text-vietcombank-ink"] {
  color: var(--gp-deep) !important;
}

[class~="text-quik-orange"] {
  color: var(--gp-red) !important;
}

[class*="border-quik-orange"] {
  border-color: #efc0aa !important;
}

[class*="from-[#00b167]"],
[class*="from-[#009a59]"],
[class*="from-[#007e49]"],
[class*="from-[#13c97a]"],
[class*="from-[#28c785]"],
[class~="from-quik-blue"],
[class~="from-quik-blue-dark"] {
  --tw-gradient-from: var(--gp-red) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(239 65 48 / 0) var(--tw-gradient-to-position) !important;
}

[class*="to-[#00b167]"],
[class*="to-[#009a59]"],
[class*="to-[#007e49]"],
[class*="to-[#13c97a]"],
[class*="to-[#28c785]"],
[class~="to-quik-blue"],
[class~="to-quik-blue-light"] {
  --tw-gradient-to: var(--gp-orange) var(--tw-gradient-to-position) !important;
}

[class*="from-[#e6f9f1]"],
[class*="to-[#e6f9f1]"],
[class*="to-[#c0f0dc]"] {
  --tw-gradient-from: var(--gp-soft) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: var(--gp-soft-2) var(--tw-gradient-to-position) !important;
}

[class*="from-[#003f25]"],
[class*="from-[#054c2e]"],
[class~="from-diamond-navy"] {
  --tw-gradient-from: var(--gp-deep) var(--tw-gradient-from-position) !important;
  --tw-gradient-to: rgb(143 44 41 / 0) var(--tw-gradient-to-position) !important;
}

[class*="to-[#003f25]"],
[class*="to-[#054c2e]"],
[class~="to-diamond-charcoal"] {
  --tw-gradient-to: #6f2928 var(--tw-gradient-to-position) !important;
}

[class~="bg-diamond-navy"],
[class~="bg-diamond-deep"],
[class~="bg-diamond-charcoal"] {
  background-color: #6f2928 !important;
  background-image: linear-gradient(135deg, var(--gp-deep), #6f2928) !important;
}

[class~="text-diamond-gold"],
[class~="text-diamond-gold-light"] {
  color: var(--gp-orange) !important;
}

.pro-statusbar {
  background: linear-gradient(100deg, #8f2c29, var(--gp-red), var(--gp-orange)) !important;
}

input:focus,
button:focus-visible,
a:focus-visible {
  outline-color: var(--gp-orange) !important;
}