/* Cabal RED — แพ็คลงทะเบียนล่วงหน้า (ใช้เฉพาะหน้า /topup/cabalred) */

/* แถบรอบขาย */
.cbr-rounds{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}
.cbr-round{position:relative;border-radius:8px;padding:10px 12px;text-align:center;border:1px solid #3a3835;background:#26241f;overflow:hidden}
.cbr-round-n{font-size:14px;font-weight:600;color:#fff}
.cbr-round-n span{color:#FFD700;font-weight:500}
.cbr-round-d{font-size:12px;color:#aaa;margin-top:3px}
.cbr-round.is-done{opacity:.45}
.cbr-round.is-done .cbr-round-n::after{content:" · จบแล้ว";font-size:11px;color:#aaa}
.cbr-round.is-next .cbr-round-n::after{content:" · เร็ว ๆ นี้";font-size:11px;color:#aaa}
.cbr-round.is-live{background:linear-gradient(180deg,#d0122f,#7d0c1d);border-color:#ff5c73;box-shadow:0 0 0 1px rgba(255,92,115,.2),0 8px 24px rgba(200,16,46,.27)}
.cbr-round.is-live .cbr-round-n span,.cbr-round.is-live .cbr-round-d{color:#ffe1e6}
.cbr-round.is-live::before{content:"กำลังขาย";position:absolute;top:8px;left:-26px;transform:rotate(-35deg);background:#FFD700;color:#111;font-size:10px;font-weight:700;padding:2px 30px}
.cbr-count{display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;font-size:13px;color:#aaa;margin:0 0 14px}
.cbr-count b{background:#000;border:1px solid #D0993D;color:#FFD700;border-radius:6px;padding:2px 8px;font-size:15px;min-width:44px;text-align:center;font-variant-numeric:tabular-nums}

/* การ์ดแพ็ค — ทับสไตล์กลางของ .card-select-topup-multi */
#pack-selection-container .cbr-pack.card-select-topup-multi{padding:3px;border:0;border-radius:12px;background:linear-gradient(180deg,#e0163a,#5e0a17);overflow:visible;transition:transform .15s,box-shadow .15s}
#pack-selection-container .cbr-pack.cbr-gold.card-select-topup-multi{background:linear-gradient(180deg,#ffb52e,#b8620a)}
#pack-selection-container .cbr-pack.card-select-topup-multi:hover{border-color:transparent;transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.45)}
#pack-selection-container .cbr-pack.card-select-topup-multi.selected{border-color:transparent;background:linear-gradient(180deg,#e0163a,#5e0a17);box-shadow:0 0 0 3px #FFD700,0 10px 30px rgba(212,160,23,.33)}
#pack-selection-container .cbr-pack.cbr-gold.card-select-topup-multi.selected{background:linear-gradient(180deg,#ffb52e,#b8620a)}
.cbr-in{background:#0e0f11 url(../images/games/cabalred/card-red-mb.webp) center/cover;border-radius:10px;padding:0 0 14px;overflow:hidden;position:relative;height:100%;display:flex;flex-direction:column}
.cbr-gold .cbr-in{background-image:url(../images/games/cabalred/card-yellow-mb.webp)}
.cbr-stock{background:linear-gradient(90deg,#b30f28,#e01a3c);color:#fff;font-size:12px;text-align:center;padding:5px 8px 5px 26px;position:relative;border-radius:10px 10px 0 0}
.cbr-gold .cbr-stock{background:linear-gradient(90deg,#b8620a,#f39c12)}
.cbr-stock::before{content:"!";position:absolute;left:10px;top:4px;width:15px;height:15px;border-radius:50%;background:#fff;color:#c8102e;font-size:11px;font-weight:700;line-height:15px;text-align:center}
.cbr-gold .cbr-stock::before{color:#b8620a}
.cbr-value{position:absolute;top:-8px;left:-8px;width:74px;height:74px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ff5b7a,#c8102e 60%,#7a0a1c);border:2px solid #ffd6dd;color:#fff;font-weight:700;display:flex;flex-direction:column;align-items:center;justify-content:center;transform:rotate(-12deg);box-shadow:0 4px 12px rgba(0,0,0,.5);z-index:2;line-height:1}
.cbr-gold .cbr-value{background:radial-gradient(circle at 35% 30%,#ffd166,#f39c12 60%,#b8620a);border-color:#fff1c9}
.cbr-value small{font-size:10px;font-weight:500}
.cbr-value b{font-size:18px}
.cbr-img{height:150px;display:flex;align-items:center;justify-content:center;padding:10px 12px 0}
.cbr-img img{max-height:140px;max-width:100%;filter:drop-shadow(0 6px 10px #000)}
.cbr-ribbon{display:flex;align-items:center;justify-content:space-between;padding:0 14px;margin-top:2px}
.cbr-shock{background:#000;border:1px solid #ff3355;color:#fff;font-weight:700;font-style:italic;font-size:13px;padding:4px 12px;border-radius:20px;letter-spacing:.5px}
.cbr-shock i{color:#ffd400;font-style:normal}
.cbr-view{width:54px;height:54px;border-radius:50%;background:radial-gradient(circle,#3b3c42,#1a1b1e);border:2px solid #9a9ca3;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:9px;color:#ddd;text-decoration:none;gap:1px}
.cbr-view:hover{color:#fff;border-color:#fff}
.cbr-view b{font-size:16px}
.cbr-limit{margin-top:10px;font-size:11px;color:#ff8797;text-align:center}
.cbr-gold .cbr-limit{color:#ffd48a}
.cbr-name{font-size:16px;font-weight:600;text-align:center;margin-top:2px;color:#fff}
.cbr-normal{font-size:12px;color:#aaa;text-align:center}
.cbr-normal s{color:#ff6b81;font-weight:500}
.cbr-price{margin:8px 12px 0;background:linear-gradient(180deg,#e0163a,#a50f28);border:1px solid #ff6b81;border-radius:8px;text-align:center;font-size:26px;font-weight:700;padding:6px;color:#fff;text-shadow:0 2px 4px rgba(0,0,0,.5)}
.cbr-gold .cbr-price{background:linear-gradient(180deg,#ffb52e,#d67d0f);border-color:#ffe0a3;color:#2b1600;text-shadow:none}
.cbr-next{font-size:10.5px;color:#aaa;text-align:center;margin-top:6px;padding:0 10px;min-height:16px}
#pack-selection-container .cbr-pack .quantity-controls{bottom:52px}
.cbr-limit-msg{margin:-4px 0 10px;padding:8px 12px;border-radius:8px;background:rgba(176,32,32,.15);border:1px solid rgba(214,66,66,.45);color:#ff9a9a;font-size:13px;text-align:center}
.cbr-note{margin:4px 0 0;padding:11px 14px;border:1px solid rgba(214,66,66,.42);border-left-width:3px;border-radius:8px;background:rgba(176,32,32,.10);color:#ff9a9a;font-size:13px;line-height:1.75}
.cbr-note b{color:#ff6b6b;font-weight:700}
.cbr-note-line{margin-top:9px;padding-top:9px;border-top:1px solid rgba(214,66,66,.25)}
.cbr-note-line a{color:#FFD700;text-decoration:underline;word-break:break-all}
.cbr-note-line a:hover{color:#fff}
@media (max-width:991px){.cbr-rounds{grid-template-columns:1fr}}
@media (max-width:575px){.cbr-img{height:130px}.cbr-price{font-size:22px}}