/*
Theme Name: Yellow Host Premium Marketplace
Theme URI: https://yellowhost.com/
Author: Yellow Host
Description: Premium WordPress theme marketplace for showcasing, demoing and ordering news themes.
Version: 2.1.0
Requires at least: 5.8
Tested up to: 6.9
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: yh-marketplace
*/
:root{--yh:#f5b400;--yh2:#ffcf33;--ink:#111827;--muted:#667085;--bg:#f5f7fa;--card:#fff;--line:#e6e9ee;--dark:#111827;--green:#087f5b;--danger:#d92d20}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.6}a{text-decoration:none;color:inherit}.wrap{width:min(1200px,92%);margin:auto}
.header{position:sticky;top:0;z-index:100;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 5px 20px #1118270b}.head{min-height:72px;display:flex;align-items:center;justify-content:space-between;gap:24px}.logo{font-size:25px;font-weight:900}.logo b{color:var(--yh)}.nav{display:flex;gap:20px;align-items:center;font-weight:700}.nav a:hover{color:#b27b00}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid transparent;border-radius:10px;padding:11px 18px;font-weight:800;cursor:pointer;transition:.2s}.btn-yellow{background:var(--yh);color:#111}.btn-yellow:hover{background:var(--yh2)}.btn-dark{background:var(--dark);color:#fff}.btn-outline{background:#fff;border-color:var(--line)}.btn-green{background:var(--green);color:#fff}.btn-danger{background:var(--danger);color:#fff}
.hero{background:radial-gradient(circle at 85% 20%,#ffe8a0 0,#ffd45a22 28%,transparent 45%),linear-gradient(135deg,#111827,#202938);color:#fff;padding:82px 0}.hero-grid{display:grid;grid-template-columns:1.2fr .8fr;gap:55px;align-items:center}.badge{display:inline-block;border:1px solid #ffffff28;background:#ffffff12;padding:6px 12px;border-radius:99px;font-size:13px;font-weight:800}.hero h1{font-size:clamp(40px,5vw,66px);line-height:1.04;margin:18px 0}.hero p{font-size:18px;color:#d0d5dd;max-width:680px}.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:26px}.hero-panel{background:#ffffff0d;border:1px solid #ffffff1c;border-radius:22px;padding:26px}.hero-panel .big{font-size:44px;font-weight:900}.hero-panel li{margin:10px 0;color:#e5e7eb}
.section{padding:65px 0}.title-row{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:25px}.title-row h2{font-size:32px;margin:0}.muted{color:var(--muted)}
.toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:25px}.toolbar input,.toolbar select{padding:11px 13px;border:1px solid var(--line);background:#fff;border-radius:9px;font:inherit}.toolbar input{min-width:260px}.cats{display:flex;gap:8px;flex-wrap:wrap}.cat{padding:8px 13px;background:#fff;border:1px solid var(--line);border-radius:99px;font-weight:700}.cat.active,.cat:hover{background:var(--dark);color:#fff}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.card{background:#fff;border:1px solid var(--line);border-radius:16px;overflow:hidden;box-shadow:0 8px 25px #1118270a;position:relative}.thumb{aspect-ratio:16/10;background:#eef1f5;overflow:hidden;position:relative}.thumb img{width:100%;height:100%;object-fit:cover}.sale{position:absolute;top:12px;left:12px;background:var(--danger);color:#fff;border-radius:7px;padding:5px 9px;font-size:12px;font-weight:900}.body{padding:19px}.body h3{margin:0;font-size:20px}.meta{font-size:13px;color:var(--muted);margin-top:4px}.price{margin:13px 0;font-size:21px;font-weight:900}.old{text-decoration:line-through;color:#98a2b3;font-size:14px;margin-right:6px}.card-actions{display:grid;grid-template-columns:1fr 1fr;gap:9px}.card-actions .btn:last-child{grid-column:1/-1}
.features{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.feature{background:#fff;border:1px solid var(--line);padding:24px;border-radius:15px}.feature-icon{font-size:28px}
.cta{background:var(--dark);color:#fff;padding:40px;border-radius:20px;display:flex;align-items:center;justify-content:space-between;gap:20px}.cta p{color:#cbd5e1}
.footer{background:#0b111b;color:#aeb8c5;padding:45px 0}.foot-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:35px}.footer h3{color:#fff}.copy{border-top:1px solid #ffffff15;margin-top:30px;padding-top:20px;font-size:13px}
.single{padding:42px 0}.single-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(300px,.55fr);gap:28px;align-items:start}.preview{background:#0b1220;border-radius:18px;padding:13px;box-shadow:0 14px 35px #11182722}.preview iframe{width:100%;height:700px;border:0;background:#fff;border-radius:10px;display:block}.preview-tools{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 2px 1px;color:#d0d5dd;font-size:12px}.mockup{display:flex;justify-content:center;padding:30px 15px 20px;background:linear-gradient(#f8fafc,#fff)}.phone{width:335px;background:#111;border:10px solid #111;border-radius:38px;padding:7px;box-shadow:0 18px 45px #0003;position:relative}.phone:before{content:"";position:absolute;top:4px;left:50%;transform:translateX(-50%);width:90px;height:7px;background:#000;border-radius:20px;z-index:2}.phone iframe{width:100%;height:620px;border:0;background:#fff;border-radius:25px;display:block}.sticky-box{position:sticky;top:95px}.theme-kicker{font-size:13px;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.05em}.theme-summary{color:var(--muted);margin:8px 0 16px}.purchase-price{font-size:34px;font-weight:950;line-height:1.1;margin:15px 0}.purchase-price .old{font-size:16px}.trust-list{list-style:none;padding:0;margin:18px 0}.trust-list li{padding:8px 0;border-bottom:1px solid var(--line)}.trust-list li:before{content:"✓";color:var(--green);font-weight:900;margin-right:8px}.demo-open{display:inline-flex;padding:7px 10px;border:1px solid #ffffff25;border-radius:8px;color:#fff;background:#ffffff0d}.about-box{margin-top:20px}.empty-about{padding:18px;background:#f8fafc;border:1px dashed #d0d5dd;border-radius:10px;color:var(--muted)}.box{background:#fff;border:1px solid var(--line);padding:24px;border-radius:15px}.box h1{margin-top:0}.row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--line)}.features-list{padding-left:22px}.features-list li{margin:7px 0}
.form{max-width:820px;margin:auto;background:#fff;border:1px solid var(--line);padding:30px;border-radius:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.field{display:flex;flex-direction:column;gap:6px}.field.full{grid-column:1/-1}.field input,.field textarea,.field select{font:inherit;padding:12px;border:1px solid #d0d5dd;border-radius:9px}.field textarea{min-height:120px}.payment{background:#fffaf0;border:1px solid #f4d27a;border-radius:12px;padding:17px}.order-id{font-size:25px;font-weight:900;letter-spacing:1px;background:#f2f4f7;padding:12px;border-radius:10px;text-align:center}
.dashboard-nav{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.dash-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line)}.dash-table th,.dash-table td{text-align:left;padding:12px;border-bottom:1px solid var(--line)}
.notice{padding:15px;border-radius:10px;background:#ecfdf3;border:1px solid #abefc6;color:#067647;margin-bottom:18px}.error{background:#fef3f2;border-color:#fecdca;color:#b42318}
@media(max-width:950px){.grid{grid-template-columns:repeat(2,1fr)}.hero-grid,.single-grid{grid-template-columns:1fr}.features{grid-template-columns:1fr 1fr}.foot-grid{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.nav{display:none}.grid,.features,.form-grid,.foot-grid{grid-template-columns:1fr}.hero{padding:55px 0}.hero h1{font-size:42px}.section{padding:45px 0}.preview iframe{height:480px}.phone{width:275px}.phone iframe{height:500px}.toolbar input{min-width:100%}.cta{display:block}.cta .btn{margin-top:12px}}

/* Exact responsive demo viewport controls */
.preview-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:16px 0 12px}.device-switch{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.device-btn{border:1px solid var(--line);background:#fff;padding:8px 12px;border-radius:8px;font-weight:800;cursor:pointer}.device-btn.active,.device-btn:hover{background:var(--dark);color:#fff}.device-stage{background:#eef1f5;border:1px solid var(--line);border-radius:14px;padding:18px;display:flex;justify-content:center;overflow:auto}.desktop-frame{width:100%;background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 12px 35px #11182720}.desktop-frame iframe{display:block;width:100%;height:760px;border:0;background:#fff}.device-stage.tablet .desktop-frame{width:768px;max-width:100%}.device-stage.tablet .desktop-frame iframe{height:1024px}.device-stage.mobile .desktop-frame{width:390px;max-width:390px;border:10px solid #111;border-radius:28px}.device-stage.mobile .desktop-frame iframe{height:844px}.mobile-note{text-align:center;margin-top:5px}

/* Exact responsive demo preview */
.demo-switcher{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}
.demo-switcher button{border:1px solid var(--line);background:#fff;border-radius:9px;padding:9px 14px;font-weight:800;cursor:pointer}
.demo-switcher button.active{background:var(--dark);color:#fff}
.demo-stage{width:100%;overflow:hidden;background:#e9edf2;border:1px solid var(--line);border-radius:14px;padding:12px}
.demo-viewport{position:relative;width:100%;overflow:hidden;background:#fff;border-radius:8px}
.demo-viewport.desktop{height:auto;min-height:620px}
.demo-viewport.tablet{height:900px}
.demo-viewport.mobile{height:760px;max-width:430px;margin:auto;border:8px solid #111;border-radius:30px;padding:0}
.demo-iframe{display:block;border:0;background:#fff}
.demo-viewport.desktop .demo-iframe{width:1280px;height:760px;transform-origin:top left}
.demo-viewport.tablet .demo-iframe{width:768px;height:900px}
.demo-viewport.mobile .demo-iframe{width:390px;height:760px}
.demo-scale-holder{position:relative;width:100%;overflow:hidden}
.demo-open{display:flex;justify-content:flex-end;margin-top:10px}
@media(max-width:650px){
 .demo-viewport.desktop{min-height:0}
 .demo-viewport.desktop .demo-iframe{width:1280px;height:760px}
}

/* v2.3 — true viewport rendering: no CSS scaling */
.demo-stage{width:100%;overflow:auto;background:#e9edf2;border:1px solid var(--line);border-radius:14px;padding:12px}
.demo-viewport.desktop{width:100%;height:800px;min-height:800px;margin:0;border:0;border-radius:8px;overflow:auto;background:#fff}
.demo-viewport.desktop .demo-iframe{width:100%;height:800px;transform:none!important;display:block}
.demo-viewport.tablet{width:768px;height:900px;margin:0 auto;overflow:auto}
.demo-viewport.tablet .demo-iframe{width:768px;height:900px;transform:none!important}
.demo-viewport.mobile{width:390px;height:760px;margin:0 auto;border:8px solid #111;border-radius:30px;overflow:auto;padding:0}
.demo-viewport.mobile .demo-iframe{width:390px;height:760px;transform:none!important}
@media(max-width:650px){
 .demo-viewport.desktop{height:650px;min-height:650px}
 .demo-viewport.desktop .demo-iframe{height:650px;width:100%}
 .demo-stage{padding:8px}
}
