/*!
 * Pricing Table Master — card-styles.css
 * Six card skins. Put the class on the pricing root, a grid, or a single card:
 *   .pt-style-flat  .pt-style-bordered  .pt-style-glass  .pt-style-gradient  .pt-style-neumorphic  .pt-style-minimal
 */

/* ---------- Flat ---------- */
.pt-style-flat .pt-card:not(.is-inverted),
.pt-card.pt-style-flat {
  border-color: transparent;
  background: var(--pt-surface);
  box-shadow: none;
}
.pt-style-flat .pt-card.is-featured { box-shadow: 0 0 0 2px var(--pt-accent); }

/* ---------- Bordered ---------- */
.pt-style-bordered .pt-card,
.pt-card.pt-style-bordered {
  border-width: 2px;
  box-shadow: none;
}
.pt-style-bordered .pt-card:not(.is-inverted) { background: var(--pt-surface); }
.pt-style-bordered .pt-card.is-featured {
  border-color: var(--pt-accent);
  box-shadow: 8px 8px 0 0 color-mix(in srgb, var(--pt-accent) 25%, transparent);
}
.pt-style-bordered .pt-btn { border-width: 2px; }

/* ---------- Glass ---------- */
.pt-style-glass {
  --pt-glass-bg: rgba(255, 255, 255, .55);
  --pt-glass-border: rgba(255, 255, 255, .7);
}
[data-pt-mode="dark"] .pt-style-glass,
.pt-style-glass[data-pt-mode="dark"] {
  --pt-glass-bg: rgba(22, 25, 40, .5);
  --pt-glass-border: rgba(255, 255, 255, .1);
}
.pt-style-glass .pt-card:not(.is-inverted) {
  background: var(--pt-glass-bg);
  border-color: var(--pt-glass-border);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
          backdrop-filter: blur(18px) saturate(160%);
  box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .25);
}
.pt-style-glass .pt-card.is-featured {
  box-shadow: 0 0 0 1px color-mix(in srgb, var(--pt-accent) 70%, transparent), 0 30px 70px -20px color-mix(in srgb, var(--pt-accent) 55%, transparent);
}
.pt-style-glass .pt-features li.no::before { background-color: rgba(127, 127, 127, .14); }
.pt-style-glass .pt-btn:not(.pt-btn--primary):not(.pt-btn--gradient) { background: rgba(255, 255, 255, .08); }

/* Background blobs for glass layouts */
.pt-blobs { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 0; }
.pt-blobs span {
  position: absolute;
  width: 46vmax; height: 46vmax;
  border-radius: 50%;
  filter: blur(80px);
  opacity: .55;
}
.pt-blobs span:nth-child(1) { background: var(--pt-accent);   top: -18vmax; left: -12vmax; }
.pt-blobs span:nth-child(2) { background: var(--pt-accent-2); bottom: -22vmax; right: -10vmax; }
.pt-blobs span:nth-child(3) { background: #22d3ee; top: 30%; left: 45%; width: 24vmax; height: 24vmax; opacity: .3; }
.pt-blobs + * { position: relative; z-index: 1; }

/* ---------- Gradient ---------- */
.pt-style-gradient .pt-card:not(.is-inverted) {
  border: 1px solid transparent;
  background:
    linear-gradient(var(--pt-surface), var(--pt-surface)) padding-box,
    linear-gradient(160deg, color-mix(in srgb, var(--pt-accent) 45%, var(--pt-border)), var(--pt-border) 45%, color-mix(in srgb, var(--pt-accent-2) 35%, var(--pt-border))) border-box;
}
.pt-style-gradient .pt-card.is-featured:not(.is-inverted) {
  border-width: 2px;
  background:
    linear-gradient(var(--pt-surface), var(--pt-surface)) padding-box,
    linear-gradient(135deg, var(--pt-accent), var(--pt-accent-2)) border-box;
  box-shadow: var(--pt-shadow-lg);
}
.pt-style-gradient .pt-card.is-featured:not(.is-inverted) .pt-price-amount {
  background: linear-gradient(100deg, var(--pt-accent), var(--pt-accent-2));
  -webkit-background-clip: text; background-clip: text;
  color: transparent;
}

/* ---------- Neumorphic ---------- */
.pt-style-neumorphic {
  --pt-neu-bg: #e9edf3;
  --pt-neu-dark: rgba(163, 177, 198, .6);
  --pt-neu-light: rgba(255, 255, 255, .9);
  background: var(--pt-neu-bg);
}
[data-pt-mode="dark"] .pt-style-neumorphic,
.pt-style-neumorphic[data-pt-mode="dark"] {
  --pt-neu-bg: #1c2030;
  --pt-neu-dark: rgba(0, 0, 0, .55);
  --pt-neu-light: rgba(255, 255, 255, .05);
}
.pt-style-neumorphic .pt-card:not(.is-inverted) {
  background: var(--pt-neu-bg);
  border-color: transparent;
  box-shadow: 12px 12px 28px var(--pt-neu-dark), -12px -12px 28px var(--pt-neu-light);
}
.pt-style-neumorphic .pt-card.is-featured {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--pt-accent) 60%, transparent), 12px 12px 28px var(--pt-neu-dark), -12px -12px 28px var(--pt-neu-light);
}
.pt-style-neumorphic .pt-icon,
.pt-style-neumorphic .pt-features li::before {
  background: var(--pt-neu-bg);
  box-shadow: 3px 3px 7px var(--pt-neu-dark), -3px -3px 7px var(--pt-neu-light);
}
.pt-style-neumorphic .pt-btn:not(.pt-btn--primary) {
  background: var(--pt-neu-bg);
  border-color: transparent;
  box-shadow: 6px 6px 14px var(--pt-neu-dark), -6px -6px 14px var(--pt-neu-light);
}
.pt-style-neumorphic .pt-btn:not(.pt-btn--primary):active { box-shadow: inset 4px 4px 10px var(--pt-neu-dark), inset -4px -4px 10px var(--pt-neu-light); }
.pt-style-neumorphic .pt-segment,
.pt-style-neumorphic .pt-select select {
  background: var(--pt-neu-bg);
  border-color: transparent;
  box-shadow: inset 4px 4px 10px var(--pt-neu-dark), inset -4px -4px 10px var(--pt-neu-light);
}
.pt-style-neumorphic .pt-switch { box-shadow: inset 3px 3px 7px var(--pt-neu-dark), inset -3px -3px 7px var(--pt-neu-light); }

/* ---------- Minimal ---------- */
.pt-style-minimal .pt-grid { gap: 0; }
.pt-style-minimal .pt-card:not(.is-inverted) { background: transparent; }
.pt-style-minimal .pt-card {
  border: 0;
  border-radius: 0;
  box-shadow: none;
  padding-inline: 32px;
}
.pt-style-minimal .pt-card + .pt-card { border-inline-start: 1px solid var(--pt-border); }
.pt-style-minimal .pt-card.is-featured:not(.is-inverted) { background: var(--pt-surface); border-radius: var(--pt-radius); box-shadow: var(--pt-shadow); }
.pt-style-minimal .pt-card.is-featured + .pt-card { border-inline-start-color: transparent; }
.pt-style-minimal .pt-features li::before { background: transparent !important; }
.pt-style-minimal .pt-card > .pt-badge--auto { position: static; transform: none; align-self: flex-start; margin-bottom: 14px; }
@media (max-width: 900px) {
  .pt-style-minimal .pt-card + .pt-card { border-inline-start: 0; border-top: 1px solid var(--pt-border); }
}
