/* ==========================================================
   TABAK-MARKET | VUSE ULTRA PODS PREMIUM 2026
   Scope: .tm-vuse-ultra-pods only
   Load after tm-premium-category.css
   ========================================================== */
.tm-vuse-ultra-pods{
  --vup-green:#547d39;--vup-dark:#17371f;--vup-line:#d6e3ce;
  --vup-cream:#f6f9f2;--vup-ink:#20312a;--vup-muted:#566459;
  color:var(--vup-ink);font-size:15px;line-height:1.65;
}
.tm-vuse-ultra-pods,.tm-vuse-ultra-pods *{box-sizing:border-box}
.tm-vuse-ultra-pods h2,.tm-vuse-ultra-pods h3,.tm-vuse-ultra-pods h4{color:var(--vup-dark);line-height:1.25}
.tm-vuse-ultra-pods p{margin:0 0 12px}
.tm-vuse-ultra-pods .vup-kicker{display:block;color:var(--vup-green);font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;margin-bottom:8px}
/* Hero: light premium palette */
.tm-vuse-ultra-pods .vup-hero{position:relative;overflow:hidden;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:22px;align-items:center;padding:30px;border:1px solid #d4e6d5;border-radius:22px;background:radial-gradient(circle at 100% 0%,#d4eff1 0,transparent 42%),linear-gradient(115deg,#f9fcfa,#edf6e8 75%,#e4f2e5);box-shadow:0 14px 36px rgba(36,71,42,.09);margin-bottom:18px}
.tm-vuse-ultra-pods .vup-hero::after{content:'VUSE ULTRA';position:absolute;right:12px;top:12px;font-weight:900;font-size:clamp(42px,7vw,90px);line-height:.9;letter-spacing:-.06em;color:rgba(64,128,111,.09);z-index:-1;pointer-events:none;max-width:50%}
.tm-vuse-ultra-pods .vup-hero h2{font-size:clamp(25px,3vw,36px);margin:0 0 14px}
.tm-vuse-ultra-pods .vup-hero h2 span{color:var(--vup-green)}
.tm-vuse-ultra-pods .vup-hero-image{display:block;max-width:100%;width:100%;max-height:340px;object-fit:contain;border-radius:16px}
.tm-vuse-ultra-pods .vup-chips{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}
.tm-vuse-ultra-pods .vup-chips span{display:inline-flex;align-items:center;border:1px solid #bdd3b0;border-radius:999px;padding:6px 12px;background:#ffffffc9;color:#31532d;font-size:12px;font-weight:700}
.tm-vuse-ultra-pods .vup-age{background:#e6f2dc;border-left:4px solid var(--vup-green);border-radius:10px;padding:12px 15px;font-size:13px}
/* Section cards */
.tm-vuse-ultra-pods .vup-section{background:linear-gradient(145deg,#fff 10%,#f5f9f1 100%);border:1px solid var(--vup-line);border-radius:17px;padding:22px;margin-bottom:16px;box-shadow:0 7px 20px rgba(34,69,35,.055);min-width:0;transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}
.tm-vuse-ultra-pods .vup-section:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(34,69,35,.11);border-color:#a6c594}
.tm-vuse-ultra-pods .vup-section h3{font-size:19px;margin:0 0 14px}
.tm-vuse-ultra-pods .vup-section h4{font-size:15px;margin:6px 0}
.tm-vuse-ultra-pods .vup-highlights{background:linear-gradient(125deg,#f9fcf7,#e9f2e2)}
.tm-vuse-ultra-pods .vup-highlights-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.tm-vuse-ultra-pods .vup-feature{min-width:0;text-align:center;padding:18px 9px;border:1px solid #d6e6cc;border-radius:13px;background:linear-gradient(155deg,#fff,#eef6e8);box-shadow:0 4px 12px rgba(33,75,38,.05);transition:transform .2s,box-shadow .2s}
.tm-vuse-ultra-pods .vup-feature:hover{transform:translateY(-4px);box-shadow:0 9px 20px rgba(42,80,38,.13)}
.tm-vuse-ultra-pods .vup-feature-icon{display:block;color:var(--vup-green);font-size:29px;line-height:1.2;margin-bottom:9px}
.tm-vuse-ultra-pods .vup-feature p{font-size:12px;line-height:1.5;margin:0}
.tm-vuse-ultra-pods .vup-two-col{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start}
.tm-vuse-ultra-pods .vup-two-col > *{min-width:0}
.tm-vuse-ultra-pods .vup-right-stack{display:grid;gap:16px}
.tm-vuse-ultra-pods .vup-right-stack .vup-section{margin:0}
/* Technical data */
.tm-vuse-ultra-pods .vup-table-wrap{overflow-x:auto;border-radius:12px;border:1px solid var(--vup-line)}
.tm-vuse-ultra-pods table.vup-table{width:100%;border-collapse:collapse;margin:0;background:#fff;font-size:13px}
.tm-vuse-ultra-pods .vup-table th,.tm-vuse-ultra-pods .vup-table td{padding:11px 12px;text-align:left;vertical-align:top;border-bottom:1px solid #dfe9da}
.tm-vuse-ultra-pods .vup-table tr:last-child th,.tm-vuse-ultra-pods .vup-table tr:last-child td{border-bottom:0}
.tm-vuse-ultra-pods .vup-table th{width:37%;background:#5e8544!important;color:#fff!important;font-weight:700}
.tm-vuse-ultra-pods .vup-table tr:nth-child(even) th{background:#4d7437!important}
.tm-vuse-ultra-pods .vup-table tr:nth-child(even) td{background:#f0f6ec}
.tm-vuse-ultra-pods .vup-table td{color:#25392a!important}
/* Flavor, compatibility, notices */
.tm-vuse-ultra-pods .vup-flavor-art{width:100%;height:120px;display:block;object-fit:cover;border-radius:12px;margin:0 0 12px}
.tm-vuse-ultra-pods .vup-notice{padding:13px 15px;border:1px solid #f0c97d;border-left:4px solid #d99b28;border-radius:10px;background:#fff5e4;font-size:13px}
.tm-vuse-ultra-pods .vup-notice strong{display:block;color:#584018;margin-bottom:3px}
.tm-vuse-ultra-pods .vup-notice p{margin:0}
.tm-vuse-ultra-pods .vup-compatibility-image{max-width:180px;width:40%;height:auto;float:left;object-fit:contain;margin:0 16px 8px 0}
.tm-vuse-ultra-pods .vup-compact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.tm-vuse-ultra-pods .vup-compact-grid .vup-section{margin-bottom:16px}
.tm-vuse-ultra-pods .vup-safety{background:linear-gradient(130deg,#f7fbff,#eaf3fc);border-color:#cfe0ef}
/* FAQ: supports existing toggle-block JavaScript */
.tm-vuse-ultra-pods .vup-faq .toggle-block{border:1px solid #dce7d4;border-radius:12px;overflow:hidden;background:#fff}
.tm-vuse-ultra-pods .vup-faq .toggle-item{border-bottom:1px solid #e2e9dd}
.tm-vuse-ultra-pods .vup-faq .toggle-item:last-child{border-bottom:0}
.tm-vuse-ultra-pods .vup-faq .toggle-button{display:block;width:100%;padding:15px 42px 15px 17px;text-align:left;font-size:14px;font-weight:700;color:var(--vup-dark);background:#fff;border:0;cursor:pointer;position:relative}
.tm-vuse-ultra-pods .vup-faq .toggle-button:hover,.tm-vuse-ultra-pods .vup-faq .toggle-button:focus-visible{background:#f0f6e9;outline-color:#5d8442}
.tm-vuse-ultra-pods .vup-faq .toggle-content{padding:0 17px 14px;font-size:14px;line-height:1.65}
.tm-vuse-ultra-pods .vup-faq .toggle-content p{margin:0}
/* Product info */
.tm-vuse-ultra-pods .vup-product-info .toggle-item{border-bottom:1px solid #e1e9db}
.tm-vuse-ultra-pods .vup-product-info .toggle-button{width:100%;text-align:left;padding:13px 14px;border:0;background:#f6faf3;color:#24482b;font-weight:700;cursor:pointer}
.tm-vuse-ultra-pods .vup-product-info .toggle-content{padding:12px 15px}
/* Conclusion */
.tm-vuse-ultra-pods .vup-fazit{position:relative;overflow:hidden;border-radius:16px;border:1px solid #accb91;border-left:5px solid #5a843d;background:linear-gradient(110deg,#eaf3d8,#d8eac5 65%,#c5e0d3);padding:22px 25px;box-shadow:0 8px 20px rgba(37,74,30,.08)}
.tm-vuse-ultra-pods .vup-fazit::after{content:'ULTRA';position:absolute;right:-12px;bottom:-25px;font-size:clamp(60px,9vw,130px);font-weight:900;letter-spacing:-.06em;color:rgba(60,112,54,.09);pointer-events:none}
.tm-vuse-ultra-pods .vup-fazit h3{font-size:22px;color:#416b2f;margin:0 0 9px}
.tm-vuse-ultra-pods .vup-fazit p{position:relative;z-index:1;max-width:75%;margin:0}
@media(max-width:950px){.tm-vuse-ultra-pods .vup-highlights-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tm-vuse-ultra-pods .vup-two-col{grid-template-columns:1fr}}
@media(max-width:650px){.tm-vuse-ultra-pods{font-size:14px}.tm-vuse-ultra-pods .vup-hero{grid-template-columns:1fr;padding:20px}.tm-vuse-ultra-pods .vup-hero-image{max-height:260px}.tm-vuse-ultra-pods .vup-section{padding:16px}.tm-vuse-ultra-pods .vup-highlights-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tm-vuse-ultra-pods .vup-compact-grid{grid-template-columns:1fr}.tm-vuse-ultra-pods .vup-fazit p{max-width:100%}.tm-vuse-ultra-pods .vup-compatibility-image{float:none;display:block;width:150px;max-width:100%;margin:0 auto 12px}}
@media(prefers-reduced-motion:reduce){.tm-vuse-ultra-pods .vup-section,.tm-vuse-ultra-pods .vup-feature{transition:none}.tm-vuse-ultra-pods .vup-section:hover,.tm-vuse-ultra-pods .vup-feature:hover{transform:none}}

/* Peppermint Ice: CSS-only artwork, no missing image paths */
.tm-vuse-ultra-pods .vup-hero-visual{min-height:235px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;border-radius:18px;border:1px solid #c5e3dc;background:radial-gradient(circle at 75% 15%,#fff 0,transparent 34%),radial-gradient(circle at 20% 75%,#d6f1ec 0,transparent 45%),linear-gradient(135deg,#eaf8f4,#d8f1e8 55%,#c4e9eb);color:#326f64;text-align:center}
.tm-vuse-ultra-pods .vup-hero-decoration{font-size:clamp(24px,3vw,39px);font-weight:900;letter-spacing:.12em;line-height:1.2;opacity:.68}
.tm-vuse-ultra-pods .vup-hero-symbol{font-size:62px;color:#529b97;line-height:1}
.tm-vuse-ultra-pods .vup-flavor-banner{display:flex;align-items:center;justify-content:center;gap:16px;min-height:78px;margin-bottom:13px;border-radius:12px;background:linear-gradient(110deg,#dff5f1,#b8e4e1,#e5f6e8);color:#2c7167;font-size:25px}
.tm-vuse-ultra-pods .vup-flavor-banner span{font-size:13px;font-weight:800;letter-spacing:.14em}
.tm-vuse-ultra-pods .vup-native-faq{overflow:hidden;border:1px solid #d8e6d0;border-radius:12px;background:#fff}
.tm-vuse-ultra-pods .vup-native-faq details+details{border-top:1px solid #e4ebe0}
.tm-vuse-ultra-pods .vup-native-faq summary{position:relative;display:block;cursor:pointer;padding:15px 43px 15px 16px;font-weight:700;font-size:13px;line-height:1.5;color:#23472c;list-style:none}
.tm-vuse-ultra-pods .vup-native-faq summary::-webkit-details-marker{display:none}
.tm-vuse-ultra-pods .vup-native-faq summary::after{content:'+';position:absolute;right:13px;top:50%;transform:translateY(-50%);width:23px;height:23px;display:grid;place-items:center;border:1px solid #c7dabb;border-radius:50%;background:#f2f8ed;color:#4e7b37;font-size:18px;font-weight:400}
.tm-vuse-ultra-pods .vup-native-faq details[open]>summary{background:#eff6e9}
.tm-vuse-ultra-pods .vup-native-faq details[open]>summary::after{content:'−';background:#638a49;color:#fff}
.tm-vuse-ultra-pods .vup-native-faq summary:hover,.tm-vuse-ultra-pods .vup-native-faq summary:focus-visible{background:#edf5e8;outline-offset:-3px}
.tm-vuse-ultra-pods .vup-native-faq details>p{padding:12px 16px 15px;margin:0;color:#324639;font-size:13px;line-height:1.65}
.tm-vuse-ultra-pods .vup-bottom-grid{align-items:start}
.tm-vuse-ultra-pods .vup-bottom-grid .vup-right-stack{gap:0}
.tm-vuse-ultra-pods .vup-bottom-grid .vup-fazit p{max-width:100%}
@media(max-width:650px){.tm-vuse-ultra-pods .vup-hero-visual{min-height:170px}.tm-vuse-ultra-pods .vup-bottom-grid{grid-template-columns:1fr}}


/* =========================================
   VUSE ULTRA PODS – FAQ PREMIUM FIX
   ========================================= */

.tm-vuse-pod .vup-native-faq.toggle-block {
    display: block;
    overflow: hidden;
    border: 1px solid #dce7d2;
    border-radius: 14px;
    background: #fff;
}

.tm-vuse-pod .vup-native-faq .toggle-item {
    margin: 0;
    border: 0;
    border-bottom: 1px solid #e5ebdf;
    border-radius: 0;
    background: #fff;
}

.tm-vuse-pod .vup-native-faq .toggle-item:last-child {
    border-bottom: 0;
}

.tm-vuse-pod .vup-native-faq .toggle-button {
    display: block;
    position: relative;
    width: 100%;
    min-height: 54px;
    padding: 15px 52px 15px 18px;
    border: 0;
    background: transparent;
    color: #173b24;
    font-size: 15px;
    font-weight: 700;
    text-align: left;
    cursor: pointer;
}

.tm-vuse-pod .vup-native-faq .toggle-button:hover {
    background: #f0f6e9;
}

.tm-vuse-pod .vup-native-faq .toggle-button:focus-visible {
    outline: 2px solid #658744;
    outline-offset: -3px;
}

.tm-vuse-pod .vup-native-faq .toggle-content {
    padding: 0 18px 17px;
    color: #405044;
    font-size: 14px;
    line-height: 1.7;
}

.tm-vuse-pod .vup-native-faq .toggle-content p {
    margin: 0 0 9px;
}

.tm-vuse-pod .vup-native-faq .toggle-content p:last-child {
    margin-bottom: 0;
}


/* VUSE ULTRA PODS – Compact FAQ */

.tm-vuse-pod .vup-native-faq .toggle-button {
    min-height: 52px;
    padding: 13px 48px 13px 18px;
    line-height: 1.4;
}

.tm-vuse-pod .vup-native-faq .toggle-item {
    min-height: 0;
}


/* ==============================================
   VUSE ULTRA PODS – REAL PRODUCT IMAGES
   Tabak-Market Premium Design 2026
   ============================================== */

.tm-vuse-ultra-pods .vup-hero-visual {
    overflow: hidden;
    border-radius: 16px;
    background: #edf5f1;
    min-width: 0;
}

.tm-vuse-ultra-pods .vup-hero-visual img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 220px;
    object-fit: cover;
    object-position: center;
    border-radius: inherit;
}

/* Peppermint Ice flavor illustration */
.tm-vuse-ultra-pods .vup-flavor-banner {
    display: block;
    overflow: hidden;
    height: 105px;
    padding: 0;
    border-radius: 12px;
    background: #e7f5f3;
}

.tm-vuse-ultra-pods .vup-flavor-banner img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

/* Shared device image – all Ultra Pod variants */
.tm-vuse-ultra-pods .vup-device-visual {
    overflow: hidden;
    margin: 12px 0 18px;
    padding: 12px;
    border: 1px solid #dce7d5;
    border-radius: 14px;
    background: linear-gradient(
        145deg,
        #ffffff 0%,
        #f1f6ed 100%
    );
}

.tm-vuse-ultra-pods .vup-device-visual img {
    display: block;
    width: 100%;
    max-height: 230px;
    object-fit: contain;
    transition: transform .3s ease;
}

@media (hover: hover) {
    .tm-vuse-ultra-pods
    .vup-device-visual:hover img {
        transform: scale(1.035);
    }
}

@media (max-width: 767px) {
    .tm-vuse-ultra-pods .vup-hero-visual img {
        height: 190px;
        min-height: 0;
    }

    .tm-vuse-ultra-pods .vup-flavor-banner {
        height: 85px;
    }

    .tm-vuse-ultra-pods .vup-device-visual img {
        max-height: 190px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .tm-vuse-ultra-pods .vup-device-visual img {
        transition: none;
    }
}
