/* ============================================================
   Light / Dark toggle for lanabelowa.com (noir base = dark).
   Default theme = dark (the existing look, untouched).
   html[data-theme="light"] = coherent light variant.
   ============================================================ */

/* ---- Floating controls (theme toggle sits left of the coin chip) ---- */
.lana-theme-toggle{position:fixed;top:14px;right:14px;z-index:1200;display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid rgba(237,198,206,.38);background:rgba(18,11,15,.82);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);color:#f6e8ec;cursor:pointer;box-shadow:0 6px 22px rgba(0,0,0,.4);transition:transform .15s ease,border-color .15s ease}
.lana-theme-toggle:hover{transform:translateY(-1px);border-color:rgba(236,106,151,.85)}
.lana-theme-toggle svg{width:20px;height:20px}
.lana-theme-toggle .ico-sun{display:none}
.lana-coin-chip{right:62px}
@media(max-width:560px){.lana-theme-toggle{width:36px;height:36px}.lana-coin-chip{right:56px}}

/* ======================= LIGHT THEME ======================= */
html[data-theme="light"] body.noir{
  --bg:#f6eef1;--ink:#2b2230;--muted:#6f6472;--accent:#c04f7a;--on-accent:#fff;--line:#ecdde3;--card:#ffffff;
  background:#f6eef1;color:#2b2230;
}
html[data-theme="light"] .lana-theme-toggle .ico-sun{display:block}
html[data-theme="light"] .lana-theme-toggle .ico-moon{display:none}
html[data-theme="light"] .lana-theme-toggle,
html[data-theme="light"] .lana-coin-chip{background:rgba(255,255,255,.92);color:#2b2230;border-color:#e3d0d9;box-shadow:0 6px 20px rgba(160,100,130,.18)}

/* Header / nav / wordmark */
html[data-theme="light"] .noir-header,
html[data-theme="light"] .noir-header:has(.member-main-nav),
html[data-theme="light"] .chat-topbar,
html[data-theme="light"] .chat-topbar:has(.member-main-nav){background:rgba(255,255,255,.92);border-bottom:1px solid #ecdde3;color:#2b2230}
html[data-theme="light"] .noir-header a,
html[data-theme="light"] .noir-wordmark,
html[data-theme="light"] .noir-wordmark span,
html[data-theme="light"] .chat-topbar a{color:#2b2230}
html[data-theme="light"] .member-main-nav{background:#fff;border-color:#ecdde3}
html[data-theme="light"] .member-main-nav a,
html[data-theme="light"] .member-main-nav button,
html[data-theme="light"] .member-menu-toggle{color:#2b2230}
html[data-theme="light"] .member-menu-panel{background:#fff;color:#2b2230;border:1px solid #ecdde3}
html[data-theme="light"] .member-main-nav svg{stroke:#c04f7a}

/* Hero / profile banner (dark vignette -> soft light) */
html[data-theme="light"] .noir-portrait,
html[data-theme="light"] .noir-portrait:after{background:#efe3e8}
html[data-theme="light"] .noir .noir-remix{background:radial-gradient(ellipse at 20% 10%,#f6cfdd 0,#f6eef1 72%)}
html[data-theme="light"] .creator-cover{background:linear-gradient(135deg,#f6cfdd,#efe3e8)}
html[data-theme="light"] .hero-bottom,
html[data-theme="light"] .creator-bio,
html[data-theme="light"] .creator-facts span{color:#4a4050}

/* Tabs */
html[data-theme="light"] .member-tabs{background:#fff;border-color:#ecdde3}
html[data-theme="light"] .member-tabs [role="tab"]{color:#6f6472}
html[data-theme="light"] .member-tabs [role="tab"][aria-selected="true"]{color:#c04f7a}

/* Gallery toolbar / voice banner */
html[data-theme="light"] .gallery-toolbar,
html[data-theme="light"] .lana-chat-banner,
html[data-theme="light"] .member-session{background:#fff;color:#2b2230;border-color:#ecdde3}

/* Chat surfaces */
html[data-theme="light"] .chat-panel{background:#faf4f7}
html[data-theme="light"] .chat-scroll,
html[data-theme="light"] .chat-side{color:#2b2230}
html[data-theme="light"] .upload-zone,
html[data-theme="light"] .image-consent,
html[data-theme="light"] .announcement-consent input[type=text],
html[data-theme="light"] .announcement-consent input:not([type]),
html[data-theme="light"] .composer input,
html[data-theme="light"] input[type=text],
html[data-theme="light"] input:not([type]){background:#f3eaee;color:#2b2230;border-color:#e0cdd6}
html[data-theme="light"] .media-nav{background:rgba(255,255,255,.88);color:#2b2230}

/* Shop gate / misc dark cards that use variables already follow --bg/--card */
html[data-theme="light"] .shop-gate,
html[data-theme="light"] .website-wishlist{background:#fff;border-color:#ecdde3;color:#2b2230}

/* Locked preview placeholders -> soft pink in light mode */
html[data-theme="light"] .locked-preview:before{background:linear-gradient(130deg,#f3d4de,#e7c2d0 60%,#f1dde5)!important}
html[data-theme="light"] .locked-preview{color:#5a4350}

/* Coin chip plus badge / accents stay pink (already fine) */

/* ======================= DARK THEME ======================= */
/* The member/chat area redefines the palette to LIGHT via :has(.creator-profile).
   In dark mode, flip those vars back to dark so the whole catalog goes dark. */
html[data-theme="dark"] .noir:has(.creator-profile),
html[data-theme="dark"] .noir:has(.chat-room){
  --bg:#130d11;--card:#1d1218;--ink:#f3ebe6;--muted:#b7a5ac;--line:#3a2b31;--accent:#edc6ce;--on-accent:#1a1016;
  background:var(--bg);color:var(--ink);
}
/* Hardcoded #fff surfaces -> dark card */
html[data-theme="dark"] .noir:has(.creator-profile) .noir-header,
html[data-theme="dark"] .noir:has(.chat-room) .chat-topbar{background:#160f14f2;border-bottom-color:var(--line)}
html[data-theme="dark"] .noir:has(.creator-profile) .feed-post,
html[data-theme="dark"] .noir:has(.creator-profile) .shop-product,
html[data-theme="dark"] .noir:has(.creator-profile) .bundle-teasers,
html[data-theme="dark"] .noir:has(.creator-profile) .bundle-teaser,
html[data-theme="dark"] .noir:has(.creator-profile) .website-pack,
html[data-theme="dark"] .noir:has(.creator-profile) .website-wishlist,
html[data-theme="dark"] .noir:has(.creator-profile) .shop-gate,
html[data-theme="dark"] .noir:has(.creator-profile) .media-empty,
html[data-theme="dark"] .noir:has(.creator-profile) .lovers-board,
html[data-theme="dark"] .noir:has(.creator-profile) .mystery-prize,
html[data-theme="dark"] .noir:has(.creator-profile) .points-rules,
html[data-theme="dark"] .noir:has(.creator-profile) .creator-about,
html[data-theme="dark"] .noir:has(.creator-profile) .member-menu-panel,
html[data-theme="dark"] .noir:has(.creator-profile) .lana-voice-note,
html[data-theme="dark"] .noir .wish-card,
html[data-theme="dark"] .noir .wish-empty,
html[data-theme="dark"] .noir:has(.chat-room) .member-menu-panel,
html[data-theme="dark"] .noir:has(.chat-room) .chat-profile,
html[data-theme="dark"] .noir:has(.chat-room) .chat-stage,
html[data-theme="dark"] .noir:has(.chat-room) .chat-stage-head,
html[data-theme="dark"] .noir:has(.chat-room) .chat-note:not(.sent-gift):not(.chat-image-note),
html[data-theme="dark"] .noir:has(.chat-room) .noir-composer{background:var(--card);color:var(--ink);border-color:var(--line)}
/* buttons / filter chips / menu toggle */
html[data-theme="dark"] .noir:has(.creator-profile) .media-bundles-link,
html[data-theme="dark"] .noir:has(.creator-profile) .media-filterbar button,
html[data-theme="dark"] .noir:has(.chat-room) .member-menu-toggle{background:var(--card);color:var(--ink);border-color:var(--line)}
html[data-theme="dark"] .noir:has(.creator-profile) .member-main-nav a:hover{background:#241820;color:var(--ink)}
/* text inputs */
html[data-theme="dark"] .noir .review-login-form input,
html[data-theme="dark"] .noir:has(.chat-room) .noir-composer input{background:#241820;color:#f3ebe6;border-color:#4a3741}
/* media lightbox stage (the broken-image popup) */
html[data-theme="dark"] .media-lightbox-stage,
html[data-theme="dark"] .media-lightbox-content{background:#140d11}

/* ===== Coins full page (#coins) ===== */
.coins-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px max(5%,16px);background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30}
.coins-page{max-width:900px;margin:0 auto;padding:26px max(5%,16px) 64px;color:var(--ink)}
.coins-hero{text-align:center;padding:18px 0 6px}
.coins-balance-big{display:inline-flex;align-items:center;gap:10px;font-size:42px;font-weight:800;color:var(--ink)}
.coins-balance-big .coin-icon{width:42px;height:42px}
.coins-balance-big small{font-size:16px;opacity:.7;font-weight:600}
.coins-hero h1{margin:12px 0 8px}
.coins-hero p{max-width:560px;margin:0 auto;opacity:.85;line-height:1.5}
.coins-packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:16px;margin:30px 0}
.coins-pack-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:24px 16px 18px;border:1px solid var(--line);border-radius:18px;background:var(--card);box-shadow:0 4px 16px rgba(0,0,0,.12)}
.coins-pack-card .coin-icon{width:40px;height:40px}
.coins-pack-card b{font-size:20px}
.coins-pack-price{font-size:15px;opacity:.8}
.coins-pack-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,#ff9cbd,#e05a86);color:#fff;font-size:11px;font-weight:800;letter-spacing:.3px;padding:4px 12px;border-radius:999px;white-space:nowrap;box-shadow:0 2px 8px rgba(224,90,134,.4)}
.coins-pack-gains{list-style:none;padding:0;margin:4px 0 6px;font-size:13px;opacity:.85;text-align:center;line-height:1.55}
.coins-pack-card .noir-button{margin-top:4px;width:100%}
.coins-value{margin-top:34px;padding:22px;border:1px solid var(--line);border-radius:18px;background:var(--card)}
.coins-value h2{margin:0 0 6px}
.coins-value-note{font-size:12.5px;opacity:.7;margin:0 0 16px;line-height:1.5}
.coins-value-table{width:100%;border-collapse:collapse;font-size:14px}
.coins-value-table th,.coins-value-table td{padding:11px 8px;border-bottom:1px solid var(--line);text-align:left}
.coins-value-table th{opacity:.65;font-weight:700;font-size:12px;letter-spacing:.3px;text-transform:uppercase}
.coins-value-table td:first-child{font-weight:700;white-space:nowrap}
.coins-value-table td .coin-icon{width:16px;height:16px;vertical-align:-3px}
.coins-value-list{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:11px}
.coins-value-list li{display:flex;align-items:center;gap:11px;font-size:14px}
.coins-value-list .coin-icon{width:20px;height:20px;flex:none}
@media(max-width:560px){.coins-balance-big{font-size:34px}.coins-value{padding:16px}.coins-page{padding-bottom:48px}}

/* Coins pack stats card (Nexus-style) + bonus */
.coins-bonus-banner{display:flex;align-items:center;gap:10px;max-width:760px;margin:0 auto 6px;padding:12px 16px;border-radius:14px;background:linear-gradient(135deg,rgba(255,156,189,.18),rgba(224,90,134,.14));border:1px solid rgba(236,106,151,.4);color:var(--ink);font-size:14px}
.coins-bonus-banner .coin-icon{width:24px;height:24px;flex:none}
.coins-pack-head{display:flex;flex-direction:column;align-items:center;gap:5px}
.coins-pack-card .coins-pack-base{font-size:12px;color:#c04f7a;font-weight:700}
.coins-pack-card.has-bonus b{color:#c04f7a}
.coins-pack-stats{width:100%;margin:4px 0 2px;padding:14px 14px 12px;border-radius:14px;background:color-mix(in srgb,var(--accent) 9%,transparent);border:1px solid var(--line)}
.coins-stats-label{display:block;font-size:11px;letter-spacing:.4px;text-transform:uppercase;opacity:.65;font-weight:700;margin-bottom:8px}
.coins-pack-stats ul{list-style:none;padding:0;margin:0;display:grid;gap:7px}
.coins-pack-stats li{font-size:14.5px;line-height:1.3}
.coins-pack-stats li:before{content:"bis zu ";opacity:.55;font-size:12px}
.coins-pack-stats li strong{font-size:16px}
.coins-pack-stats li small{display:block;opacity:.6;font-size:11px;font-weight:500}

.chat-coin-warning{margin:0 max(5%,16px) 8px;padding:10px 14px;border-radius:12px;background:rgba(236,106,151,.14);border:1px solid rgba(236,106,151,.4);color:#c04f7a;font-size:13.5px;text-align:center}
.chat-coin-warning a{color:#c04f7a;font-weight:700;text-decoration:underline}

.coins-pack-badge.bonus{background:linear-gradient(135deg,#ffd98a,#e0a33a);color:#3a2600}

/* ===== Instagram-style post detail ===== */
.ig-post-dialog{width:min(935px,calc(100vw - 20px));max-width:935px;height:min(88vh,760px);max-height:88vh;padding:0;border:none;border-radius:12px;overflow:hidden;background:var(--card);color:var(--ink);box-shadow:0 24px 70px rgba(0,0,0,.55)}
.ig-post-dialog::backdrop{background:rgba(0,0,0,.72)}
.ig-post-close{position:fixed;top:12px;right:16px;z-index:6;background:none;border:0;color:#fff;cursor:pointer;padding:6px;line-height:0}
.ig-post-shell{display:flex;height:100%;min-height:0}
.ig-post-media{position:relative;flex:1 1 60%;min-width:0;background:#000;display:flex;align-items:center;justify-content:center}
.ig-post-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;display:block}
.ig-post-nav{position:absolute;top:50%;transform:translateY(-50%);width:32px;height:32px;place-items:center;border:0;border-radius:50%;background:rgba(255,255,255,.9);color:#222;cursor:pointer;z-index:2;line-height:0}
.ig-post-nav.prev{left:10px}.ig-post-nav.next{right:10px}
.ig-post-side{flex:0 0 405px;max-width:405px;display:flex;flex-direction:column;min-height:0;border-left:1px solid var(--line);background:var(--card)}
.ig-post-head{display:flex;align-items:center;gap:12px;padding:13px 16px;border-bottom:1px solid var(--line)}
.ig-avatar{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,#f58aae,#b23a62);color:#fff;font-weight:700;font-size:15px;flex:none}
.ig-avatar.sm{width:30px;height:30px;font-size:13px}
.ig-avatar.fan{background:linear-gradient(135deg,#8a9bf5,#3a56b2)}
.ig-handle{font-size:14px}
.ig-post-comments{flex:1 1 auto;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:15px;min-height:0}
.ig-comment{display:flex;gap:12px;align-items:flex-start}
.ig-comment-body{font-size:14px;line-height:1.42}
.ig-comment-body p{margin:0}
.ig-comment-body strong{margin-right:5px}
.ig-comment-body time{display:inline-block;margin-top:6px;font-size:12px;opacity:.55}
.ig-no-comments{opacity:.6;font-size:14px;margin:0}
.ig-post-actions{display:flex;align-items:center;justify-content:space-between;padding:8px 12px 2px;border-top:1px solid var(--line)}
.ig-actions-left{display:flex;gap:4px}
.ig-act{background:none;border:0;color:var(--ink);cursor:pointer;padding:6px;line-height:0;transition:transform .12s}
.ig-act:active{transform:scale(.88)}
.ig-act.ig-like.liked svg{fill:#ed4956;stroke:#ed4956}
.ig-act.ig-save.saved svg{fill:var(--ink)}
.ig-post-likes{padding:2px 16px 8px;font-size:14px}
.ig-post-likes time{opacity:.55;font-size:11px;text-transform:uppercase;letter-spacing:.3px}
.ig-post-add{display:flex;align-items:center;gap:10px;padding:11px 16px;border-top:1px solid var(--line)}
.ig-post-add input{flex:1;border:0;background:none;color:var(--ink);font:inherit;outline:none}
.ig-post-add button{background:none;border:0;color:#3a86d6;font-weight:700;cursor:pointer;opacity:.45;padding:0}
.ig-post-add input:not(:placeholder-shown)+button{opacity:1}
@media(max-width:820px){.ig-post-dialog{height:auto;max-height:92vh;width:calc(100vw - 12px)}.ig-post-shell{flex-direction:column}.ig-post-media{max-height:50vh;flex:none}.ig-post-side{flex:none;max-width:none;border-left:0;border-top:1px solid var(--line)}.ig-post-comments{max-height:170px;flex:none}}
