/* ===================================================
   Therapy Sessions – Package Grid (10 Styles)
   =================================================== */

/* ── Grid Layout ─────────────────────────────────── */
.ts-packages-wrapper { padding: 20px 0; }
.ts-packages-grid { display: grid; gap: 28px; grid-template-columns: repeat(3,1fr); }
.ts-cols-1 { grid-template-columns: 1fr; }
.ts-cols-2 { grid-template-columns: repeat(2,1fr); }
.ts-cols-3 { grid-template-columns: repeat(3,1fr); }
.ts-cols-4 { grid-template-columns: repeat(4,1fr); }
@media(max-width:900px){ .ts-packages-grid{ grid-template-columns:repeat(2,1fr)!important; } }
@media(max-width:560px){ .ts-packages-grid{ grid-template-columns:1fr!important; } }

/* ── Base card reset ─────────────────────────────── */
.ts-package-card {
    position:relative; display:flex; flex-direction:column;
    overflow:hidden; transition:transform .25s ease, box-shadow .25s ease;
}
.ts-package-card:hover { transform:translateY(-6px); }

/* ── Image: original size, centered, no stretch ──── */
.ts-package-image {
    width:100%; display:flex; align-items:center; justify-content:center;
    padding:20px 20px 0; box-sizing:border-box; background:transparent;
}
.ts-package-image img {
    max-width:100%; height:auto; width:auto;
    max-height:160px; object-fit:contain; display:block;
}

/* ── Body ────────────────────────────────────────── */
.ts-package-body { padding:20px 22px 12px; flex:1; }
.ts-package-title { margin:0 0 10px; font-size:19px; font-weight:700; line-height:1.3; }

/* ── Price: vertical stack ───────────────────────── */
.ts-package-price { display:flex; flex-direction:column; gap:2px; margin:10px 0 14px; }
.ts-price-regular {
    font-size:15px; font-weight:500; text-decoration:line-through;
    color:#9ca3af;
}
.ts-price-regular .woocommerce-Price-amount { font-size:15px; }
.ts-price-sale { font-size:28px; font-weight:800; line-height:1.1; }
.ts-price-sale .woocommerce-Price-currencySymbol { font-size:16px; vertical-align:super; }

/* ── Features ────────────────────────────────────── */
.ts-package-features { list-style:none; margin:12px 0 0; padding:0; }
.ts-package-features li {
    padding:7px 0; font-size:14px; border-bottom:1px solid rgba(0,0,0,.06);
    display:flex; align-items:flex-start; gap:8px; line-height:1.5;
}
.ts-package-features li::before { content:"✓"; font-weight:700; flex-shrink:0; }

/* ── Footer ──────────────────────────────────────── */
.ts-package-footer { padding:14px 22px 22px; }
.ts-btn-buy {
    display:block; width:100%; text-align:center; padding:13px 20px;
    border-radius:8px; font-size:15px; font-weight:700;
    text-decoration:none!important; cursor:pointer;
    transition:all .2s ease; box-sizing:border-box; letter-spacing:.02em;
}

/* ── Label badge ─────────────────────────────────── */
.ts-package-label {
    position:absolute; top:14px; right:14px;
    padding:5px 14px; border-radius:999px;
    font-size:11px; font-weight:700; letter-spacing:.05em;
    text-transform:uppercase; z-index:2;
    box-shadow:0 2px 8px rgba(0,0,0,.18);
}

/* =================================================================
   STYLE 1 – Clean Card (default, matches reference screenshot)
   ================================================================= */
.ts-style-1 .ts-package-card {
    background:#fff; border:2px solid #e5e7eb;
    border-radius:16px; box-shadow:0 2px 10px rgba(0,0,0,.07);
}
.ts-style-1 .ts-package-card:hover { box-shadow:0 14px 36px rgba(0,0,0,.12); }
.ts-style-1 .ts-package-card.ts-featured { border-color:#7c3aed; box-shadow:0 4px 20px rgba(124,58,237,.18); }
.ts-style-1 .ts-package-title { color:#111827; }
.ts-style-1 .ts-price-sale { color:#7c3aed; }
.ts-style-1 .ts-package-features li::before { color:#059669; }
.ts-style-1 .ts-btn-buy { background:#f3f4f6; color:#374151!important; border:2px solid #e5e7eb; }
.ts-style-1 .ts-btn-buy:hover { background:#e5e7eb; }
.ts-style-1 .ts-featured .ts-btn-buy { background:#7c3aed; color:#fff!important; border-color:#7c3aed; }
.ts-style-1 .ts-featured .ts-btn-buy:hover { background:#6d28d9; }

/* =================================================================
   STYLE 2 – Gradient Glow
   ================================================================= */
.ts-style-2 .ts-package-card {
    background:#fff; border:none; border-radius:20px;
    box-shadow:0 4px 24px rgba(124,58,237,.10);
}
.ts-style-2 .ts-package-card::before {
    content:''; position:absolute; inset:0; border-radius:20px;
    padding:2px;
    background:linear-gradient(135deg,#a855f7,#3b82f6,#06b6d4);
    -webkit-mask:linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none;
}
.ts-style-2 .ts-package-card:hover { box-shadow:0 16px 48px rgba(124,58,237,.22); }
.ts-style-2 .ts-package-title { color:#1e1b4b; }
.ts-style-2 .ts-price-sale { background:linear-gradient(90deg,#7c3aed,#3b82f6); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.ts-style-2 .ts-package-features li::before { color:#a855f7; }
.ts-style-2 .ts-btn-buy { background:linear-gradient(135deg,#7c3aed,#3b82f6); color:#fff!important; border:none; border-radius:10px; }
.ts-style-2 .ts-btn-buy:hover { opacity:.88; transform:scale(1.03); }

/* =================================================================
   STYLE 3 – Dark Premium
   ================================================================= */
.ts-style-3 .ts-packages-wrapper { background:transparent; }
.ts-style-3 .ts-package-card { background:#0f172a; border:1px solid #1e293b; border-radius:18px; }
.ts-style-3 .ts-package-card:hover { border-color:#7c3aed; box-shadow:0 0 32px rgba(124,58,237,.35); }
.ts-style-3 .ts-package-card.ts-featured { border-color:#7c3aed; box-shadow:0 0 40px rgba(124,58,237,.3); }
.ts-style-3 .ts-package-image { background:transparent; }
.ts-style-3 .ts-package-title { color:#f1f5f9; }
.ts-style-3 .ts-price-regular { color:#475569; }
.ts-style-3 .ts-price-sale { color:#a78bfa; }
.ts-style-3 .ts-package-features li { color:#cbd5e1; border-bottom-color:#1e293b; }
.ts-style-3 .ts-package-features li::before { color:#7c3aed; }
.ts-style-3 .ts-btn-buy { background:#1e293b; color:#e2e8f0!important; border:1px solid #334155; border-radius:10px; }
.ts-style-3 .ts-btn-buy:hover { background:#7c3aed; border-color:#7c3aed; color:#fff!important; }
.ts-style-3 .ts-featured .ts-btn-buy { background:#7c3aed; color:#fff!important; border-color:#7c3aed; }
.ts-style-3 .ts-package-label { box-shadow:0 2px 12px rgba(124,58,237,.5); }

/* =================================================================
   STYLE 4 – Minimal Border
   ================================================================= */
.ts-style-4 .ts-package-card {
    background:transparent; border:1.5px solid #d1d5db;
    border-radius:4px; box-shadow:none;
}
.ts-style-4 .ts-package-card:hover { border-color:#374151; box-shadow:4px 4px 0 #374151; transform:translate(-3px,-3px); }
.ts-style-4 .ts-package-card.ts-featured { border-color:#7c3aed; border-width:2px; }
.ts-style-4 .ts-package-card.ts-featured:hover { box-shadow:4px 4px 0 #7c3aed; }
.ts-style-4 .ts-package-title { color:#111827; font-size:17px; }
.ts-style-4 .ts-price-sale { color:#111827; }
.ts-style-4 .ts-package-features li::before { color:#374151; }
.ts-style-4 .ts-btn-buy { background:transparent; color:#111827!important; border:1.5px solid #374151; border-radius:4px; }
.ts-style-4 .ts-btn-buy:hover { background:#111827; color:#fff!important; }
.ts-style-4 .ts-featured .ts-btn-buy { background:#7c3aed; color:#fff!important; border-color:#7c3aed; }

/* =================================================================
   STYLE 5 – Glassmorphism
   ================================================================= */
.ts-style-5 .ts-packages-wrapper { background:linear-gradient(135deg,#667eea 0%,#764ba2 100%); border-radius:20px; padding:30px 20px; }
.ts-style-5 .ts-package-card {
    background:rgba(255,255,255,.15); backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px); border:1px solid rgba(255,255,255,.3);
    border-radius:18px;
}
.ts-style-5 .ts-package-card:hover { background:rgba(255,255,255,.22); box-shadow:0 8px 32px rgba(0,0,0,.25); }
.ts-style-5 .ts-package-title { color:#fff; }
.ts-style-5 .ts-price-regular { color:rgba(255,255,255,.6); }
.ts-style-5 .ts-price-sale { color:#fff; }
.ts-style-5 .ts-package-features li { color:rgba(255,255,255,.9); border-bottom-color:rgba(255,255,255,.15); }
.ts-style-5 .ts-package-features li::before { color:#fbbf24; }
.ts-style-5 .ts-btn-buy { background:rgba(255,255,255,.2); color:#fff!important; border:1px solid rgba(255,255,255,.4); border-radius:10px; }
.ts-style-5 .ts-btn-buy:hover { background:rgba(255,255,255,.35); }
.ts-style-5 .ts-featured .ts-btn-buy { background:#fff; color:#7c3aed!important; }
.ts-style-5 .ts-package-label { border:1px solid rgba(255,255,255,.4); }

/* =================================================================
   STYLE 6 – Ribbon Banner
   ================================================================= */
.ts-style-6 .ts-package-card { background:#fff; border-radius:12px; box-shadow:0 4px 20px rgba(0,0,0,.09); border:none; }
.ts-style-6 .ts-package-card:hover { box-shadow:0 12px 40px rgba(0,0,0,.15); }
/* Override label as a top full-width banner */
.ts-style-6 .ts-package-label {
    position:static; border-radius:12px 12px 0 0;
    margin:0; display:block; text-align:center;
    padding:10px; font-size:12px; letter-spacing:.08em;
    top:auto; right:auto; box-shadow:none;
}
.ts-style-6 .ts-package-image { margin-top:0; }
.ts-style-6 .ts-package-card:not(:has(.ts-package-label)) .ts-package-image { border-radius:12px 12px 0 0; }
.ts-style-6 .ts-package-title { color:#1f2937; }
.ts-style-6 .ts-price-sale { color:#dc2626; }
.ts-style-6 .ts-package-features li::before { color:#7c3aed; }
.ts-style-6 .ts-btn-buy { background:#7c3aed; color:#fff!important; border:none; border-radius:8px; }
.ts-style-6 .ts-btn-buy:hover { background:#6d28d9; }

/* =================================================================
   STYLE 7 – Split Color
   ================================================================= */
.ts-style-7 .ts-package-card { background:#fff; border-radius:14px; box-shadow:0 2px 12px rgba(0,0,0,.08); border:none; overflow:visible; }
.ts-style-7 .ts-package-card .ts-package-image,
.ts-style-7 .ts-package-card .ts-package-title,
.ts-style-7 .ts-package-card .ts-package-price {
    background:#f5f3ff; margin:0;
}
.ts-style-7 .ts-package-card .ts-package-image { padding-top:24px; }
.ts-style-7 .ts-package-card .ts-package-body { background:#fff; border-radius:0 0 14px 14px; }
.ts-style-7 .ts-package-card .ts-package-title { background:transparent; color:#4c1d95; }
.ts-style-7 .ts-price-sale { color:#7c3aed; }
.ts-style-7 .ts-package-features li::before { color:#059669; }
.ts-style-7 .ts-btn-buy { background:#4c1d95; color:#fff!important; border:none; border-radius:8px; }
.ts-style-7 .ts-btn-buy:hover { background:#7c3aed; }
.ts-style-7 .ts-package-card.ts-featured .ts-package-image,
.ts-style-7 .ts-package-card.ts-featured .ts-package-body { background:#ede9fe; }

/* =================================================================
   STYLE 8 – Neumorphism
   ================================================================= */
.ts-style-8 .ts-packages-wrapper { background:#e8edf2; border-radius:20px; padding:30px; }
.ts-style-8 .ts-package-card {
    background:#e8edf2; border:none; border-radius:20px;
    box-shadow:8px 8px 18px #c8cdd2, -8px -8px 18px #ffffff;
}
.ts-style-8 .ts-package-card:hover { box-shadow:12px 12px 24px #b8bdc2, -6px -6px 16px #fff; }
.ts-style-8 .ts-package-card.ts-featured { box-shadow:8px 8px 18px #b0b8c8,-8px -8px 18px #fff, inset 0 0 0 2px #7c3aed; }
.ts-style-8 .ts-package-title { color:#374151; }
.ts-style-8 .ts-price-sale { color:#7c3aed; }
.ts-style-8 .ts-package-features li { border-bottom-color:#d0d5da; }
.ts-style-8 .ts-package-features li::before { color:#7c3aed; }
.ts-style-8 .ts-btn-buy {
    background:#e8edf2; color:#374151!important; border:none; border-radius:10px;
    box-shadow:4px 4px 10px #c8cdd2, -4px -4px 10px #fff;
}
.ts-style-8 .ts-btn-buy:hover { box-shadow:inset 4px 4px 10px #c0c5ca, inset -4px -4px 10px #f0f5fa; }
.ts-style-8 .ts-featured .ts-btn-buy { background:#7c3aed; color:#fff!important; box-shadow:4px 4px 12px rgba(124,58,237,.35); }

/* =================================================================
   STYLE 9 – Bold Accent
   ================================================================= */
.ts-style-9 .ts-package-card { background:#fff; border-radius:0; border:none; border-left:5px solid #e5e7eb; box-shadow:0 2px 12px rgba(0,0,0,.06); }
.ts-style-9 .ts-package-card:hover { border-left-color:#7c3aed; box-shadow:0 8px 28px rgba(0,0,0,.12); }
.ts-style-9 .ts-package-card.ts-featured { border-left:5px solid #7c3aed; border-left-width:8px; }
.ts-style-9 .ts-package-title { color:#111827; font-size:20px; text-transform:uppercase; letter-spacing:.04em; }
.ts-style-9 .ts-price-sale { color:#111827; font-size:34px; }
.ts-style-9 .ts-package-features li::before { color:#7c3aed; font-size:16px; }
.ts-style-9 .ts-btn-buy { background:#111827; color:#fff!important; border:none; border-radius:3px; letter-spacing:.08em; text-transform:uppercase; font-size:13px; }
.ts-style-9 .ts-btn-buy:hover { background:#7c3aed; }
.ts-style-9 .ts-package-label { position:static; border-radius:0; display:inline-block; top:auto; right:auto; margin-bottom:10px; }
/* pill label back to absolute for style 9 – override above */
.ts-style-9 .ts-package-card .ts-package-label { position:absolute; top:14px; right:14px; border-radius:2px; }

/* =================================================================
   STYLE 10 – Soft Pastel
   ================================================================= */
.ts-style-10 .ts-package-card { background:#fdf4ff; border:1.5px solid #e9d5ff; border-radius:20px; box-shadow:0 2px 8px rgba(167,139,250,.12); }
.ts-style-10 .ts-package-card:hover { background:#f5e8ff; box-shadow:0 12px 32px rgba(167,139,250,.22); }
.ts-style-10 .ts-package-card.ts-featured { background:#f0e6ff; border-color:#c084fc; }
.ts-style-10 .ts-package-image { background:transparent; }
.ts-style-10 .ts-package-title { color:#6b21a8; font-size:18px; }
.ts-style-10 .ts-price-regular { color:#c084fc; }
.ts-style-10 .ts-price-sale { color:#7c3aed; }
.ts-style-10 .ts-package-features li { color:#4c1d95; border-bottom-color:#e9d5ff; }
.ts-style-10 .ts-package-features li::before { color:#a855f7; }
.ts-style-10 .ts-btn-buy { background:#ede9fe; color:#6d28d9!important; border:1.5px solid #c4b5fd; border-radius:12px; }
.ts-style-10 .ts-btn-buy:hover { background:#7c3aed; color:#fff!important; border-color:#7c3aed; }
.ts-style-10 .ts-featured .ts-btn-buy { background:#7c3aed; color:#fff!important; border-color:#7c3aed; }
