/* 7777KH Wallet — payments UI (top-up modal, header button, movie paywall).
   Theme: dark #0a0a0e, gold #d4a017. Scoped to .sevenk-* / .sevenk-pay-* classes. */

/* ---- Header top-up button ---- */
.sevenk-hdr-topup{display:inline-flex;align-items:center;gap:8px;vertical-align:middle}
.sevenk-hdr-balance{color:#ffd76a;font-weight:800;font-size:13px;white-space:nowrap}
.sevenk-hdr-btn{display:inline-block;background:linear-gradient(180deg,#ffd76a,#d4a017);color:#141414;font-weight:700;font-size:13px;line-height:1;padding:8px 12px;border:none;border-radius:8px;cursor:pointer;text-decoration:none;white-space:nowrap}
.sevenk-hdr-btn:hover{filter:brightness(1.05)}

/* Desktop: as a menu item in the top nav — vertically centered in the header row. */
.sevenk-hdr-li{list-style:none;float:left;display:flex;align-items:center;height:70px;padding:0 10px;margin:0}
.sevenk-hdr-li .sevenk-hdr-topup{margin:0}

/* Mobile: compact icon button pinned just left of the responsive search icon. */
header.responsive .sevenk-hdr-topup.is-compact{position:absolute;right:58px;top:0;height:100%;display:flex;align-items:center;margin:0;z-index:6}
header.responsive .sevenk-hdr-topup.is-compact .sevenk-hdr-btn{padding:6px 9px;font-size:11px;line-height:1.15;white-space:nowrap}
/* very narrow phones: shrink a touch more so the text never clips or collides */
@media (max-width:360px){
	header.responsive .sevenk-hdr-topup.is-compact .sevenk-hdr-btn{padding:5px 7px;font-size:10px}
	header.responsive .sevenk-hdr-topup.is-compact{right:52px}
}

/* ---- Modal overlay ---- */
.sevenk-pay-overlay{position:fixed;inset:0;z-index:99999;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;padding:16px}
.sevenk-pay-overlay[hidden]{display:none}
.sevenk-pay-modal{position:relative;width:100%;max-width:380px;background:#0a0a0e;border:1px solid #23232b;border-radius:16px;padding:22px 20px;color:#eaeaf0;box-shadow:0 20px 60px rgba(0,0,0,.6)}
.sevenk-pay-x{position:absolute;top:10px;right:12px;background:none;border:none;color:#9a9aa6;font-size:26px;line-height:1;cursor:pointer}
.sevenk-pay-x:hover{color:#fff}
.sevenk-pay-title{margin:0 0 6px;font-size:19px;font-weight:800;color:#fff;text-align:center}
.sevenk-pay-bal{text-align:center;color:#b9b9c6;font-size:13px;margin-bottom:16px}
.sevenk-pay-bal b{color:#ffd76a}
.sevenk-pay-amounts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:12px}
.sevenk-pay-preset{flex:1 1 44%;background:#15151c;border:1px solid #2d2d38;color:#fff;font-weight:700;font-size:15px;padding:12px 8px;border-radius:10px;cursor:pointer;transition:border-color .15s,background .15s}
.sevenk-pay-preset:hover{border-color:#d4a017;background:#1b1b24}
.sevenk-pay-fixed{width:100%;text-align:center;background:#15151c;border:1px solid #d4a017;border-radius:10px;padding:14px;color:#ffd76a;font-weight:800;font-size:17px}
.sevenk-pay-custom{display:flex;gap:8px;margin-bottom:8px}
.sevenk-pay-custom[hidden]{display:none}
.sevenk-pay-input{flex:1;background:#0f0f14;border:1px solid #2d2d38;border-radius:10px;padding:11px 12px;color:#fff;font-size:15px;outline:none}
.sevenk-pay-input:focus{border-color:#d4a017}
.sevenk-pay-go{background:linear-gradient(180deg,#ffd76a,#d4a017);color:#141414;font-weight:700;border:none;border-radius:10px;padding:0 14px;cursor:pointer;white-space:nowrap}
.sevenk-pay-qr{text-align:center;margin-top:14px}
.sevenk-pay-qr[hidden]{display:none}
.sevenk-pay-qr-img{width:200px;height:200px;background:#fff;border-radius:12px;padding:8px;box-sizing:border-box}
.sevenk-pay-qr-amt{color:#ffd76a;font-weight:800;font-size:18px;margin-top:10px}
.sevenk-pay-countdown{color:#b9b9c6;font-size:13px;margin-top:4px}
.sevenk-pay-hint{color:#8a8a96;font-size:12px;margin-top:8px}
.sevenk-pay-msg{text-align:center;font-size:13px;margin-top:12px;color:#ffb4b4;min-height:16px}
.sevenk-pay-ok{color:#a5e6b8;font-weight:700}

/* ---- Movie paywall overlay ---- */
/* Only the VIDEO behind is lightly blurred + the server-option list disabled — NEVER the
   overlay card (the :not() + explicit filter:none keep the text 100% crisp; the earlier
   #playcontainer>* rule was blurring the card itself). */
.dooplay_player.sevenk-paywalled #playcontainer > *:not(.sevenk-paywall),
.dooplay_player.sevenk-paywalled #playeroptions,
.dooplay_player.sevenk-paywalled #playeroptionsul{filter:blur(3px);pointer-events:none;user-select:none}
/* The overlay sits over the actual video box (#playcontainer). Solid dark, no blur on it. */
.sevenk-paywall-host{position:relative;min-height:220px}
.sevenk-paywall{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;background:rgba(6,6,10,.94);padding:24px;filter:none}
.sevenk-paywall,.sevenk-paywall *{filter:none !important}
/* khdiamond-style card: centered, high-contrast text, gold price. */
.sevenk-paywall-card{max-width:600px;text-align:center;color:#f0f0f5}
.sevenk-paywall-have{font-size:17px;color:#f0f0f5;line-height:1.6;margin:0 0 8px;font-weight:600}
.sevenk-paywall-have b{color:#d4a017;font-weight:800}
.sevenk-paywall-need{font-size:15px;color:#e2e2e8;line-height:1.7;margin:0 0 20px}
.sevenk-paywall-need b{color:#d4a017;font-weight:800}
.sevenk-paywall-price{font-size:17px;color:#f0f0f5;margin:0 0 20px;font-weight:600}
.sevenk-paywall-price span{color:#d4a017;font-weight:800;font-size:32px;margin-left:8px;vertical-align:middle}
.sevenk-paywall-btn{display:inline-block;background:linear-gradient(90deg,#8b5cf6,#ec4899);color:#fff;font-weight:800;font-size:16px;border:none;border-radius:10px;padding:14px 34px;cursor:pointer;box-shadow:0 6px 22px rgba(139,92,246,.4)}
.sevenk-paywall-btn:hover{filter:brightness(1.06)}
/* "I agree to buy" button = gold gradient. */
.sevenk-paywall-btn.is-buy{background:linear-gradient(180deg,#ffd76a,#d4a017);color:#141414;box-shadow:0 6px 22px rgba(212,160,23,.42)}
.sevenk-paywall-note{font-size:12.5px;color:#d9b44a;line-height:1.6;margin:16px auto 0;max-width:420px}
.sevenk-paywall-msg{font-size:13px;margin-top:14px;color:#ffb4b4;min-height:16px}

@media (max-width:600px){
	.sevenk-pay-modal{max-width:100%}
	.sevenk-pay-qr-img{width:170px;height:170px}
	.sevenk-hdr-balance{display:none}
}