/* App Marketplace v4 — HostGraber Dark #00FF41
   NO external font imports — uses WordPress/system stack
   ============================================================ */

/* ── CSS Variables ─────────────────────────────────────────── */
.hg-wrap {
  --hg-acc:   #00FF41;
  --hg-acc-d: rgba(0,255,65,.1);
  --hg-acc-g: 0 0 22px rgba(0,255,65,.4);
  --hg-acc-b: rgba(0,255,65,.22);
  --hg-bg:    #070707;
  --hg-c1:    #0d0d0d;
  --hg-c2:    #131313;
  --hg-bdr:   #1e1e1e;
  --hg-txt:   #cccccc;
  --hg-mut:   #555555;
  --hg-dim:   #888888;
  --hg-r:     12px;
  --hg-t:     .18s cubic-bezier(.4,0,.2,1);
  /* System font stack — NO Google Fonts */
  --hg-font: 'Montserrat', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, sans-serif;
  --hg-mono: ui-monospace, 'SFMono-Regular', 'Consolas', 'Liberation Mono', monospace;
}

.hg-wrap { font-family:var(--hg-font); color:var(--hg-txt); background:var(--hg-bg); padding:28px 28px 36px; border-radius:16px; position:relative; }
.hg-wrap * { box-sizing:border-box; }
.hg-error-msg { background:rgba(255,60,60,.08); border:1px solid rgba(255,60,60,.25); border-radius:var(--hg-r); padding:18px 22px; color:#ff6464; display:flex; align-items:center; gap:10px; font-size:14px; }

/* ── Header ─────────────────────────────────────────────────── */
.hg-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:22px; border-bottom:1px solid var(--hg-bdr); margin-bottom:22px; flex-wrap:wrap; }
.hg-header-title { font-size:clamp(20px,3.5vw,30px); font-weight:800; letter-spacing:-.025em; line-height:1.15; color:#fff; margin:0 0 6px; background:linear-gradient(130deg,#fff 55%,var(--hg-acc)); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.hg-header-sub { font-size:14px; color:var(--hg-mut); margin:0 0 10px; max-width:520px; line-height:1.6; }
.hg-header-stats { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--hg-mut); }
.hg-header-stats strong { color:var(--hg-acc); font-family:var(--hg-mono); font-size:14px; }
.hg-stat-dot { color:#2a2a2a; }

/* ── Currency Toggle ────────────────────────────────────────── */
.hg-currency-toggle { display:flex; align-items:center; gap:10px; flex-shrink:0; background:#101010; border:1px solid var(--hg-bdr); border-radius:100px; padding:7px 14px; }
.hg-tog-lbl { font-size:12px; font-weight:700; cursor:pointer; color:var(--hg-mut); transition:color var(--hg-t); letter-spacing:.06em; user-select:none; }
.hg-tog-lbl.is-active { color:#fff; }
.hg-tog-track { position:relative; width:44px; height:24px; border-radius:100px; cursor:pointer; transition:background var(--hg-t); flex-shrink:0; background:#1e1e1e; }
.hg-tog-knob { position:absolute; top:3px; left:3px; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 4px rgba(0,0,0,.4); transition:transform var(--hg-t); }
.hg-tog-track.is-right .hg-tog-knob { transform:translateX(20px); }

/* ── Toolbar ─────────────────────────────────────────────────── */
.hg-toolbar { display:flex; gap:10px; margin-bottom:16px; align-items:stretch; }
.hg-search-box-wrap { flex:1; min-width:0; }
.hg-search-box {
  position: relative;
}

/* ICON */
.hg-search-ico {
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  pointer-events: none;
  z-index: 2; /* 🔥 keep above input */
}

/* INPUT */
.hg-search {
  width: 100%;
  height: 47px !important;

  padding-left: 50px !important; /* 🔥 force override */
  padding-right: 40px;

  background: #111;
  border: 1.5px solid var(--hg-bdr);
  border-radius: 10px;

  position: relative;
  z-index: 1;
}
.hg-search:focus { border-color:var(--hg-acc); box-shadow:0 0 0 3px var(--hg-acc-d); background:#141414; }
.hg-search::placeholder { color:var(--hg-mut); }
.hg-search-clear { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:22px; height:22px; background:transparent; border:none; cursor:pointer; color:var(--hg-mut); padding:0; display:flex; align-items:center; justify-content:center; border-radius:50%; transition:all var(--hg-t); }
.hg-search-clear:hover { color:#fff; background:rgba(255,255,255,.1); }
.hg-search-clear svg { width:13px; height:13px; }
.hg-sort-wrap { flex-shrink:0; }
.hg-sort { height:100%; min-height:44px; background:#111; border:1.5px solid var(--hg-bdr); border-radius:10px; padding:10px 32px 10px 14px; color:var(--hg-txt); font-size:13px; font-family:var(--hg-font); outline:none; cursor:pointer; transition:border-color var(--hg-t); -webkit-appearance:none; appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23555' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 10px center; }
.hg-sort:focus { border-color:var(--hg-acc); }
.hg-sort option { background:#141414; }

/* ── Billing Cycle Selector ─────────────────────────────────── */
.hg-cycle-switcher { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:16px; align-items:center; }
.hg-cycle-switcher:not(:empty)::before { content:'Billing:'; font-size:11px; font-weight:700; color:var(--hg-mut); text-transform:uppercase; letter-spacing:.09em; margin-right:2px; flex-shrink:0; }
.hg-cycle-chip { display:inline-flex; align-items:center; gap:6px; padding:7px 16px; background:#111; border:1.5px solid var(--hg-bdr); border-radius:50px; color:var(--hg-mut); font-size:12px; font-weight:600; font-family:var(--hg-font); cursor:pointer; transition:all var(--hg-t); white-space:nowrap; }
.hg-cycle-chip:hover { border-color:var(--hg-acc-b); color:#ccc; }
.hg-cycle-chip.is-active { background:var(--hg-acc-d); border-color:var(--hg-acc); color:var(--hg-acc); font-weight:700; box-shadow:0 0 10px rgba(0,255,65,.12); }
.hg-cycle-save-pill { background:var(--hg-acc); color:#000; font-size:9px; font-weight:900; padding:1px 6px; border-radius:50px; letter-spacing:.03em; }

/* ── Filters ─────────────────────────────────────────────────── */
.hg-filters { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:22px; align-items:center; }
.hg-filter-btn { display:inline-flex; align-items:center; gap:6px; background:#111; border:1.5px solid var(--hg-bdr); border-radius:100px; padding:7px 16px; color:var(--hg-mut); font-size:12px; font-weight:600; font-family:var(--hg-font); cursor:pointer; transition:all var(--hg-t); white-space:nowrap; }
.hg-filter-btn:hover { border-color:var(--hg-acc-b); color:#ccc; }
.hg-filter-btn.is-active { background:var(--hg-acc-d); border-color:var(--hg-acc); color:var(--hg-acc); font-weight:700; }
.hg-filter-ico { font-size:1em; line-height:1; }
.hg-filter-count { background:rgba(255,255,255,.07); border-radius:100px; padding:1px 7px; font-size:10px; font-family:var(--hg-mono); min-width:18px; text-align:center; }
.hg-filter-btn.is-active .hg-filter-count { background:rgba(0,255,65,.2); color:var(--hg-acc); }

/* ── Grid & Card ─────────────────────────────────────────────── */
.hg-market-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.hg-market-grid[data-layout="list"] { grid-template-columns:1fr; }
.hg-card { background:var(--hg-c1); border:1px solid var(--hg-bdr); border-radius:var(--hg-r); display:flex; flex-direction:column; overflow:hidden; position:relative; transition:border-color var(--hg-t),transform var(--hg-t),box-shadow var(--hg-t),background var(--hg-t); animation:hgFadeUp .35s ease both; }
@keyframes hgFadeUp { from{opacity:0;transform:translateY(14px)} to{opacity:1;transform:none} }
/*.hg-card::before { content:''; position:absolute; left:0; top:0; width:2px; height:100%; background:var(--hg-bdr); transition:background var(--hg-t),box-shadow var(--hg-t); z-index:1; }*/ /*gulshan*/
.hg-card::before { content:''; position:absolute; left:0; top:0; width:2px; height:100%; background:#00ff41; transition:background var(--hg-t),box-shadow var(--hg-t); z-index:1; }
.hg-hover-glow .hg-card:hover { background:var(--hg-c2); border-color:rgba(0,255,65,.22); transform:translateY(-4px); box-shadow:0 0 28px rgba(0,255,65,.07),0 12px 40px rgba(0,0,0,.6); }
.hg-hover-glow .hg-card:hover::before { background:var(--hg-acc); box-shadow:var(--hg-acc-g); }
.hg-hover-lift .hg-card:hover { transform:translateY(-8px); box-shadow:0 24px 56px rgba(0,0,0,.7); }
.hg-hover-border .hg-card:hover { border-color:var(--hg-acc); }
.hg-card.is-featured { border-color:rgba(0,255,65,.22); background:#0a110b; }
.hg-card.is-featured::before { background:var(--hg-acc); box-shadow:0 0 12px rgba(0,255,65,.35); }
.hg-card.is-popular { border-color:rgba(255,160,0,.22); }

/* Badges */
.hg-discount-badge { position:absolute; top:12px; right:12px; background:var(--hg-acc); color:#000; font-size:10px; font-weight:900; letter-spacing:.04em; padding:3px 8px; border-radius:6px; z-index:4; }
.hg-ribbon { position:absolute; top:16px; right:-28px; background:#ffa500; color:#000; font-size:9px; font-weight:900; letter-spacing:.07em; text-transform:uppercase; padding:5px 38px; transform:rotate(45deg); z-index:3; white-space:nowrap; }
.hg-badge { position:absolute; top:12px; left:14px; display:inline-flex; align-items:center; gap:4px; font-size:10px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; border-radius:100px; padding:3px 9px; z-index:2; }
.hg-badge-feat { background:rgba(0,255,65,.12); color:var(--hg-acc); border:1px solid rgba(0,255,65,.3); }
.hg-badge-new  { background:rgba(80,180,255,.1); color:#50b4ff; border:1px solid rgba(80,180,255,.25); }
.hg-badge-hot,.hg-badge-popular { background:rgba(255,140,0,.1); color:#ffa040; border:1px solid rgba(255,140,0,.25); }
.hg-badge-sale { background:rgba(255,60,120,.1); color:#ff3c78; border:1px solid rgba(255,60,120,.25); }
.hg-badge-custom { border:1px solid var(--hg-acc); color:var(--hg-acc); background:var(--hg-acc-d); }

/* Card sections */
.hg-card-img { height:160px; background-size:cover; background-position:center; position:relative; flex-shrink:0; }
.hg-img-overlay { position:absolute; inset:0; background:linear-gradient(to bottom,transparent 30%,rgba(0,0,0,.9)); }
.hg-card-body { padding:18px; display:flex; flex-direction:column; gap:12px; flex:1; }
.hg-card-top { display:flex; align-items:center; gap:12px; }
.hg-icon-wrap { flex-shrink:0; }
.hg-app-icon { width:52px; height:52px; border-radius:11px; object-fit:cover; border:1px solid var(--hg-bdr); background:#111; display:block; }
.hg-icon-fallback { width:52px; height:52px; border-radius:11px; background:linear-gradient(135deg,#0e1d10,#102514); border:1px solid rgba(0,255,65,.2); display:flex; align-items:center; justify-content:center; font-size:15px; font-weight:800; color:var(--hg-acc); letter-spacing:.04em; }
.hg-card-title { font-size:14px; font-weight:700; color:#fff; margin:0 0 3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height:1.3; }
.hg-ver { display:block; font-size:10px; color:var(--hg-mut); font-family:var(--hg-mono); margin-bottom:3px; }
.hg-cat-tag { font-size:10px; color:var(--hg-acc); background:var(--hg-acc-d); border:1px solid rgba(0,255,65,.2); border-radius:4px; padding:2px 6px; display:inline-block; font-weight:600; }
.hg-custom-html { font-size:12.5px; color:var(--hg-mut); line-height:1.65; }
.hg-custom-html a { color:var(--hg-acc); }
.hg-custom-html strong { color:#fff; }
.hg-card-desc { font-size:12.5px; color:var(--hg-mut); line-height:1.65; margin:0; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.hg-card-desc-list { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:3px; }
.hg-card-desc-list li { font-size:12px; color:var(--hg-mut); line-height:1.55; }
.hg-specs { display:flex; flex-wrap:wrap; gap:5px; }
.hg-spec { display:inline-flex; align-items:center; gap:4px; background:#111; border:1px solid var(--hg-bdr); border-radius:5px; padding:3px 8px; font-size:11px; color:var(--hg-dim); font-family:var(--hg-mono); }
.hg-spec-ico { font-size:10px; }
.hg-features { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:4px; }
.hg-features li { font-size:12px; color:var(--hg-dim); display:flex; align-items:flex-start; gap:6px; line-height:1.5; }
.hg-chk { color:var(--hg-acc); font-weight:700; font-size:11px; flex-shrink:0; margin-top:1px; }
.hg-card-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:14px 18px; border-top:1px solid var(--hg-bdr); flex-wrap:wrap; background:rgba(0,0,0,.2); }
.hg-pricing { display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.hg-price-row { display:flex; align-items:baseline; gap:2px; }
.hg-price-sym { font-size:13px; color:var(--hg-acc); font-family:var(--hg-mono); font-weight:600; }
.hg-price { font-size:22px; font-weight:700; color:var(--hg-acc); font-family:var(--hg-mono); line-height:1; transition:all .22s; }
.hg-price-per { font-size:11px; color:var(--hg-mut); margin-left:1px; }
.hg-price-cycle { font-size:11px; color:var(--hg-mut); }
.hg-deploys { font-size:11px; color:var(--hg-mut); }

/* Deploy button */
.hg-btn { display:inline-flex; align-items:center; gap:6px; background:var(--hg-acc); color:#000; font-family:var(--hg-font); font-size:12px; font-weight:800; text-decoration:none; border-radius:8px; padding:10px 18px; letter-spacing:.02em; transition:all var(--hg-t); border:none; cursor:pointer; white-space:nowrap; flex-shrink:0; }
.hg-btn:hover { filter:brightness(1.1); box-shadow:var(--hg-acc-g); transform:translateX(2px); color:#000; }
.hg-btn-arr { width:14px; height:14px; transition:transform var(--hg-t); }
.hg-btn:hover .hg-btn-arr { transform:translateX(4px); }

/* List layout */
.hg-market-grid[data-layout="list"] .hg-card { flex-direction:row; flex-wrap:wrap; }
.hg-market-grid[data-layout="list"] .hg-card-img { width:200px; height:auto; flex-shrink:0; }
.hg-market-grid[data-layout="list"] .hg-card-body { flex:1; flex-direction:row; flex-wrap:wrap; align-items:center; }
.hg-market-grid[data-layout="list"] .hg-card-top { flex:0 0 220px; }
.hg-market-grid[data-layout="list"] .hg-card-footer { width:100%; }

/* Empty / pagination */
.hg-empty { text-align:center; padding:60px 20px; }
.hg-empty-ico { font-size:44px; margin-bottom:14px; opacity:.35; }
.hg-empty p { color:var(--hg-mut); font-size:14px; }
.hg-pagination { display:flex; justify-content:center; gap:6px; margin-top:28px; flex-wrap:wrap; }
.hg-page-btn { width:38px; height:38px; display:flex; align-items:center; justify-content:center; background:#111; border:1.5px solid var(--hg-bdr); border-radius:8px; color:var(--hg-mut); font-size:13px; font-family:var(--hg-mono); cursor:pointer; transition:all var(--hg-t); }
.hg-page-btn:hover,.hg-page-btn.is-active { background:var(--hg-acc-d); border-color:var(--hg-acc); color:var(--hg-acc); }
.hg-card.hg-hidden { display:none !important; }

/* ════════════════════════════════════════════════════════════
   CONFIGURATOR MODAL
   ════════════════════════════════════════════════════════════ */
.hg-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.85); z-index:999999; display:flex; align-items:center; justify-content:center; padding:16px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); animation:hgFadeIn .18s ease; }
@keyframes hgFadeIn { from{opacity:0} to{opacity:1} }
.hg-modal-inner { background:#0d0d0d; border:1px solid rgba(0,255,65,.18); border-radius:16px; width:100%; max-width:75%; max-height:80%; overflow-y:auto; position:relative; animation:hgSlideUp .22s ease; scrollbar-width:thin; scrollbar-color:#222 transparent; }
.hg-modal-inner::-webkit-scrollbar { width:4px; }
.hg-modal-inner::-webkit-scrollbar-thumb { background:#222; border-radius:4px; }
@keyframes hgSlideUp { from{transform:translateY(18px);opacity:0} to{transform:none;opacity:1} }
.hg-modal-close { position:absolute; top:14px; right:14px; width:32px; height:32px; background:#181818; border:1px solid #222; border-radius:8px; cursor:pointer; display:flex; align-items:center; justify-content:center; color:var(--hg-mut); transition:all var(--hg-t); z-index:2; }
.hg-modal-close svg { width:16px; height:16px; }
.hg-modal-close:hover { border-color:#ff6464; color:#ff6464; background:rgba(255,80,80,.1); }
.hg-modal-head { display:flex; align-items:center; gap:16px; padding:22px 24px 18px; border-bottom:1px solid #1e1e1e; }
.hg-modal-icon-wrap { position:relative; flex-shrink:0; }
.hg-modal-icon { width:60px; height:60px; border-radius:13px; border:1px solid #1e1e1e; object-fit:cover; background:#111; display:block; }
.hg-modal-icon-fb { display:none; width:60px; height:60px; border-radius:13px; background:linear-gradient(135deg,#0e1d10,#102514); border:1px solid rgba(0,255,65,.2); align-items:center; justify-content:center; font-size:20px; font-weight:800; color:var(--hg-acc); }
.hg-modal-app-name { font-size:20px; font-weight:700; color:#fff; line-height:1.2; margin-bottom:6px; }
.hg-modal-cat-tag { font-size:11px; color:var(--hg-acc); background:var(--hg-acc-d); border:1px solid rgba(0,255,65,.2); border-radius:4px; padding:2px 8px; display:inline-block; font-weight:600; }

/* Domain field */
.hg-domain-row { padding:14px 24px; border-bottom:1px solid #1a1a1a; background:rgba(0,255,65,.03); }
.hg-domain-label { display:flex; align-items:center; gap:7px; font-size:11px; font-weight:700; color:var(--hg-acc); text-transform:uppercase; letter-spacing:.07em; margin-bottom:8px; }
.hg-domain-input { width:100%; background:#111; border:1.5px solid #222; border-radius:8px; color:#fff; padding:10px 14px; font-size:13px; font-family:var(--hg-font); outline:none; transition:border-color var(--hg-t),box-shadow var(--hg-t); }
.hg-domain-input:focus { border-color:var(--hg-acc); box-shadow:0 0 0 3px var(--hg-acc-d); }
.hg-domain-input::placeholder { color:#444; }
.hg-domain-hint { font-size:11px; color:var(--hg-mut); margin-top:5px; }

/* Modal body */
.hg-modal-body { padding:20px 24px; }
.hg-modal-loading { text-align:center; padding:36px 0; color:var(--hg-mut); font-size:13px; }
.hg-spinner { width:32px; height:32px; border:2px solid #1e1e1e; border-top-color:var(--hg-acc); border-radius:50%; animation:hgSpin .7s linear infinite; margin:0 auto 12px; }
@keyframes hgSpin { to{transform:rotate(360deg)} }
.hg-opt-group { margin-bottom:24px; }
.hg-opt-group:last-child { margin-bottom:0; }
.hg-opt-group-title { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.09em; color:var(--hg-acc); margin-bottom:12px; }
.hg-opt-option { margin-bottom:14px; }
.hg-opt-option:last-child { margin-bottom:0; }
.hg-opt-option-title { font-size:11px; color:var(--hg-mut); font-weight:700; margin-bottom:8px; text-transform:uppercase; letter-spacing:.06em; }

/* Billing cycle list in modal */
.hg-cycle-group .hg-opt-items { flex-direction:column; }
.hg-cycle-group .hg-opt-item { flex-direction:row; justify-content:space-between; align-items:center; min-width:0; text-align:left; padding:11px 16px; }
.hg-cycle-save-badge { font-size:10px; font-weight:900; background:var(--hg-acc); color:#000; padding:2px 7px; border-radius:50px; }

/* Option items */
.hg-opt-items { display:flex; flex-wrap:wrap; gap:8px; }
.hg-opt-item { background:#111; border:1.5px solid #1e1e1e; border-radius:8px; padding:9px 14px; cursor:pointer; transition:all var(--hg-t); font-size:13px; color:var(--hg-dim); display:flex; flex-direction:column; align-items:center; gap:3px; min-width:80px; text-align:center; }
.hg-opt-item:hover { border-color:rgba(0,255,65,.35); color:#fff; }
.hg-opt-item.is-selected { background:var(--hg-acc-d); border-color:var(--hg-acc); color:#fff; font-weight:600; box-shadow:0 0 10px rgba(0,255,65,.1); }
.hg-opt-price { font-size:11px; color:var(--hg-acc); font-family:var(--hg-mono); margin-top:2px; font-weight:600; }

/* Qty slider */
.hg-qty-field { padding:12px 16px; border:1.5px solid #1e1e1e; border-radius:10px; background:#111; }
.hg-qty-meta { display:flex; justify-content:space-between; align-items:center; margin-bottom:10px; }
.hg-qty-label { font-size:13px; color:#fff; font-weight:600; }
.hg-qty-control { display:flex; align-items:center; gap:10px; }
.hg-qty-slider { flex:1; -webkit-appearance:none; appearance:none; height:4px; background:#222; border-radius:4px; outline:none; cursor:pointer; }
.hg-qty-slider::-webkit-slider-thumb { -webkit-appearance:none; width:18px; height:18px; border-radius:50%; background:var(--hg-acc); cursor:pointer; box-shadow:0 0 0 3px rgba(0,255,65,.15); }
.hg-qty-value { font-family:var(--hg-mono); font-size:16px; font-weight:700; color:var(--hg-acc); min-width:32px; text-align:center; }

/* Modal footer — sticky */
.hg-modal-footer { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:16px 24px; border-top:1px solid #1a1a1a; background:rgba(0,0,0,.3); flex-wrap:wrap; position:sticky; bottom:0; backdrop-filter:blur(8px); }
.hg-modal-price-label { font-size:11px; color:var(--hg-mut); text-transform:uppercase; letter-spacing:.08em; margin-bottom:3px; }
.hg-modal-total { display:flex; align-items:baseline; gap:2px; }
.hg-modal-sym { font-size:14px; color:var(--hg-acc); font-family:var(--hg-mono); font-weight:700; }
.hg-modal-total-val { font-size:28px; font-weight:800; color:var(--hg-acc); font-family:var(--hg-mono); line-height:1; transition:all .2s; }
.hg-modal-period { font-size:12px; color:var(--hg-mut); margin-left:2px; }
.hg-modal-proceed { font-size:13px; padding:12px 28px; }

/* ════════════════════════════════════════════════════════════
   RESPONSIVE
   ════════════════════════════════════════════════════════════ */
@media(max-width:1024px){
  .hg-market-grid{grid-template-columns:repeat(2,1fr);}
}
@media(max-width:768px){
  .hg-wrap{padding:16px 14px 24px;}
  .hg-market-grid{grid-template-columns:1fr;gap:14px;}
  .hg-header{flex-direction:column;align-items:flex-start;gap:12px;}
  .hg-currency-toggle{align-self:flex-start;}
  .hg-toolbar{flex-direction:column;gap:8px;}
  .hg-search-box-wrap,.hg-sort-wrap{width:100%;}
  .hg-sort{width:100%;}
  .hg-btn .hg-btn-text{display:none;}
  .hg-btn::after{content:attr(data-mobile-text);font-weight:800;}
  .hg-btn-arr{display:none;}
  .hg-cycle-switcher{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:3px;}
  .hg-cycle-switcher::-webkit-scrollbar{display:none;}
  .hg-filters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:3px;}
  .hg-filters::-webkit-scrollbar{display:none;}
  .hg-market-grid[data-layout="list"] .hg-card{flex-direction:column;}
  .hg-market-grid[data-layout="list"] .hg-card-img{width:100%;height:160px;}
  .hg-market-grid[data-layout="list"] .hg-card-body{flex-direction:column;}
  /* Modal full bottom sheet on mobile */
  .hg-modal-overlay{align-items:flex-end;padding:0; z-index:2147483647 !important; overflow: hidden;}
  .hg-modal-inner{max-width:100%;max-height:99%;border-radius:20px 20px 0 0;}
  .hg-modal-head{padding:18px 18px 14px;}
  .hg-modal-body{padding:14px 18px;}
  .hg-modal-footer{padding:12px 18px;}
  .hg-opt-items{gap:6px;}
  .hg-opt-item{min-width:68px;padding:8px 10px;font-size:12px;}
  .hg-cycle-group .hg-opt-item{padding:10px 14px;}
}
@media(max-width:480px){
  .hg-header-title{font-size:20px;}
  .hg-price{font-size:20px;}
  .hg-btn{padding:9px 14px;}
  /* 2-col micro grid on small phones */
  .hg-market-grid{grid-template-columns:repeat(2,1fr);gap:10px;}
  .hg-card-body{padding:12px;gap:8px;}
  .hg-app-icon,.hg-icon-fallback{width:38px;height:38px;}
  .hg-card-title{font-size:12px;}
  .hg-card-footer{padding:10px 12px;}
}
body.hg-modal-open{overflow:hidden;}


/* v3.0.2 visibility and theme-conflict fallback */
.hg-wrap .hg-market-grid {
  display: grid !important;
  visibility: visible !important;
  opacity: 1 !important;
  min-height: 1px;
}
.hg-wrap .hg-card:not(.hg-hidden) {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.hg-wrap .hg-card {
  min-width: 0;
  color: var(--hg-txt);
}
.hg-wrap .hg-card-body,
.hg-wrap .hg-card-footer,
.hg-wrap .hg-card-top,
.hg-wrap .hg-card-meta {
  visibility: visible !important;
  opacity: 1 !important;
}
@media (max-width: 767px) {
  .hg-wrap .hg-market-grid { grid-template-columns: 1fr !important; }
}


/* v3.0.4: persistent server-rendered card visibility */
.hg-wrap .hg-market-grid { display:grid !important; }
.hg-wrap .hg-card { visibility:visible; opacity:1; }
.hg-wrap .hg-card:not(.hg-hidden) { display:flex !important; }
.hg-wrap .hg-card.hg-hidden { display:none !important; }


/* v3.0.5: isolate marketplace grid from page/footer .hg-grid collisions */
.hg-wrap > .hg-market-grid {
  position: relative !important;
  inset: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 1px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  z-index: auto !important;
  transform: none !important;
  animation: none !important;
  background: none !important;
  background-image: none !important;
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

/* ============================================================
   v3.1.0 — PREMIUM HOSTGRABER SAAS THEME
   Dark Black + Neon Green, high visibility and theme isolation
   ============================================================ */
.hg-wrap {
  --hg-acc:#39ff76;
  --hg-acc-2:#00e85a;
  --hg-acc-d:rgba(57,255,118,.10);
  --hg-acc-g:0 0 28px rgba(57,255,118,.30);
  --hg-acc-b:rgba(57,255,118,.36);
  --hg-bg:#030504;
  --hg-c1:rgba(10,14,12,.96);
  --hg-c2:rgba(14,20,16,.98);
  --hg-bdr:rgba(255,255,255,.10);
  --hg-bdr-strong:rgba(57,255,118,.28);
  --hg-txt:#f2f5f3;
  --hg-mut:#a2aaa5;
  --hg-dim:#c8ceca;
  --hg-r:18px;
  --hg-t:.22s cubic-bezier(.2,.8,.2,1);
  background:
    radial-gradient(circle at 12% 0%,rgba(57,255,118,.075),transparent 28%),
    radial-gradient(circle at 95% 18%,rgba(57,255,118,.045),transparent 24%),
    linear-gradient(180deg,#030504 0%,#050806 48%,#020403 100%) !important;
  color:var(--hg-txt) !important;
  padding:34px !important;
  border:1px solid rgba(255,255,255,.075);
  border-radius:24px !important;
  box-shadow:0 35px 100px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.035);
  overflow:hidden;
  isolation:isolate;
}
.hg-wrap::before {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:-1;
  opacity:.32;
  background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);
  background-size:52px 52px;
  -webkit-mask-image:linear-gradient(to bottom,#000,transparent 72%);
  mask-image:linear-gradient(to bottom,#000,transparent 72%);
}
.hg-wrap * { scrollbar-color:rgba(57,255,118,.32) transparent; }
.hg-wrap ::selection { background:rgba(57,255,118,.24); color:#fff; }

/* Header */
.hg-header {
  align-items:center;
  padding:2px 0 26px;
  margin-bottom:22px;
  border-bottom:1px solid rgba(255,255,255,.085);
}
.hg-header-title {
  font-size:clamp(26px,3vw,38px) !important;
  font-weight:850 !important;
  letter-spacing:-.045em !important;
  line-height:1.05 !important;
  margin-bottom:10px !important;
  background:linear-gradient(105deg,#fff 12%,#fff 54%,#74ff9f 100%);
  -webkit-background-clip:text;
  background-clip:text;
}
.hg-header-sub { color:#aeb5b0 !important; font-size:14px !important; line-height:1.75 !important; }
.hg-header-stats { color:#8d9690 !important; }
.hg-header-stats strong { color:var(--hg-acc) !important; text-shadow:0 0 16px rgba(57,255,118,.22); }
.hg-stat-dot { color:rgba(255,255,255,.20) !important; }

/* Currency toggle */
.hg-currency-toggle {
  min-height:46px;
  padding:7px 14px !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(255,255,255,.11) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter:blur(14px);
}
.hg-tog-lbl { color:#8f9892 !important; }
.hg-tog-lbl.is-active { color:#fff !important; }
.hg-tog-track { background:#171c19 !important; border:1px solid rgba(255,255,255,.08); }
.hg-tog-track.is-right { background:rgba(57,255,118,.22) !important; }
.hg-tog-knob { background:var(--hg-acc) !important; box-shadow:0 0 14px rgba(57,255,118,.32) !important; }

/* Toolbar */
.hg-toolbar { gap:12px !important; margin-bottom:18px !important; }
.hg-search-box-wrap,.hg-sort-wrap { position:relative; }
.hg-search,.hg-sort {
  min-height:50px !important;
  color:#f5f7f6 !important;
  background:rgba(10,14,12,.88) !important;
  border:1px solid rgba(255,255,255,.105) !important;
  border-radius:14px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025),0 10px 30px rgba(0,0,0,.16);
  backdrop-filter:blur(14px);
}
.hg-search { padding-left:48px !important; font-size:13px !important; }
.hg-search::placeholder { color:#727b75 !important; opacity:1; }
.hg-search-ico { color:#879089 !important; left:16px !important; width:18px !important; }
.hg-search:focus,.hg-sort:focus {
  border-color:rgba(57,255,118,.62) !important;
  background:rgba(12,18,14,.98) !important;
  box-shadow:0 0 0 4px rgba(57,255,118,.09),0 12px 34px rgba(0,0,0,.22) !important;
}
.hg-search-clear { color:#8d9690 !important; }
.hg-search-clear:hover { color:var(--hg-acc) !important; background:rgba(57,255,118,.09) !important; }
.hg-sort { padding-left:16px !important; padding-right:40px !important; min-width:172px; }
.hg-sort option { background:#0a0e0c !important; color:#fff !important; }

/* Billing and filters */
.hg-cycle-switcher,.hg-filters {
  position:relative;
  gap:9px !important;
  padding:2px 0 4px;
}
.hg-cycle-switcher:not(:empty)::before { color:#939c96 !important; font-size:10px !important; }
.hg-cycle-chip,.hg-filter-btn {
  min-height:37px;
  color:#aab2ad !important;
  background:rgba(255,255,255,.032) !important;
  border:1px solid rgba(255,255,255,.095) !important;
  border-radius:999px !important;
  padding:8px 15px !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
.hg-cycle-chip:hover,.hg-filter-btn:hover {
  color:#fff !important;
  border-color:rgba(57,255,118,.36) !important;
  background:rgba(57,255,118,.065) !important;
  transform:translateY(-1px);
}
.hg-cycle-chip.is-active,.hg-filter-btn.is-active {
  color:#081109 !important;
  background:linear-gradient(135deg,#79ffa5 0%,var(--hg-acc) 50%,#00d852 100%) !important;
  border-color:transparent !important;
  box-shadow:0 8px 24px rgba(57,255,118,.17),inset 0 1px 0 rgba(255,255,255,.48) !important;
  text-shadow:none !important;
}
.hg-cycle-save-pill {
  color:#061008 !important;
  background:rgba(255,255,255,.84) !important;
  box-shadow:none !important;
}
.hg-filter-count {
  color:#dce2de !important;
  background:rgba(255,255,255,.09) !important;
  border:1px solid rgba(255,255,255,.04);
}
.hg-filter-btn.is-active .hg-filter-count {
  color:#041008 !important;
  background:rgba(0,0,0,.15) !important;
}

/* App grid and premium cards */
.hg-wrap > .hg-market-grid { gap:22px !important; }
.hg-card {
  min-height:100%;
  color:#f2f5f3 !important;
  background:linear-gradient(155deg,rgba(15,21,17,.98) 0%,rgba(7,10,8,.99) 62%,rgba(5,8,6,.99) 100%) !important;
  border:1px solid rgba(255,255,255,.095) !important;
  border-radius:18px !important;
  box-shadow:0 16px 44px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.035);
  overflow:hidden;
}
.hg-card::before {
  width:100% !important;
  height:2px !important;
  left:0 !important;
  top:0 !important;
  background:linear-gradient(90deg,transparent,var(--hg-acc),transparent) !important;
  opacity:.58;
  box-shadow:0 0 20px rgba(57,255,118,.20);
}
.hg-hover-glow .hg-card:hover,.hg-hover-lift .hg-card:hover,.hg-hover-border .hg-card:hover {
  background:linear-gradient(155deg,rgba(18,28,21,.99),rgba(8,13,10,.99)) !important;
  border-color:rgba(57,255,118,.38) !important;
  transform:translateY(-7px) !important;
  box-shadow:0 24px 65px rgba(0,0,0,.48),0 0 35px rgba(57,255,118,.085),inset 0 1px 0 rgba(255,255,255,.055) !important;
}
.hg-card.is-featured {
  border-color:rgba(57,255,118,.31) !important;
  background:linear-gradient(150deg,rgba(13,29,18,.98),rgba(6,12,8,.99)) !important;
}
.hg-card.is-popular { border-color:rgba(255,184,77,.30) !important; }
.hg-card-img {
  position:relative;
  background-color:#0a0e0b !important;
  border-bottom:1px solid rgba(255,255,255,.075) !important;
}
.hg-card-img::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(to top,rgba(3,5,4,.52),transparent 52%);
}
.hg-card-body { padding:20px !important; gap:13px !important; }
.hg-app-icon,.hg-icon-fallback {
  border-radius:14px !important;
  border:1px solid rgba(255,255,255,.11) !important;
  background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025)) !important;
  box-shadow:0 10px 28px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06);
}
.hg-card-title { color:#fff !important; font-weight:780 !important; letter-spacing:-.025em !important; }
.hg-ver { color:#89928c !important; }
.hg-cat-tag {
  color:#9dffbd !important;
  background:rgba(57,255,118,.075) !important;
  border-color:rgba(57,255,118,.20) !important;
  border-radius:999px !important;
  padding:4px 9px !important;
}
.hg-card-desc,.hg-card-desc-list li,.hg-custom-html { color:#aab2ad !important; }
.hg-card-desc-list li::marker { color:var(--hg-acc); }
.hg-custom-html strong { color:#fff !important; }
.hg-spec {
  color:#c7ceca !important;
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(255,255,255,.085) !important;
  border-radius:8px !important;
  padding:5px 9px !important;
}
.hg-features li { color:#c4cbc7 !important; }
.hg-chk { color:var(--hg-acc) !important; text-shadow:0 0 12px rgba(57,255,118,.22); }
.hg-card-footer {
  padding:17px 20px !important;
  border-top:1px solid rgba(255,255,255,.075) !important;
  background:rgba(255,255,255,.018) !important;
}
.hg-price-sym,.hg-price { color:var(--hg-acc) !important; text-shadow:0 0 20px rgba(57,255,118,.17); }
.hg-price { font-size:24px !important; font-weight:800 !important; letter-spacing:-.04em; }
.hg-price-per,.hg-price-cycle,.hg-deploys { color:#939c96 !important; }
.hg-btn {
  min-height:42px;
  color:#031008 !important;
  background:linear-gradient(135deg,#7dffa8 0%,var(--hg-acc) 50%,#00d950 100%) !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:11px !important;
  padding:11px 17px !important;
  box-shadow:0 10px 26px rgba(57,255,118,.15),inset 0 1px 0 rgba(255,255,255,.48);
}
.hg-btn:hover {
  color:#031008 !important;
  filter:none !important;
  transform:translateY(-2px) !important;
  box-shadow:0 14px 32px rgba(57,255,118,.25),0 0 24px rgba(57,255,118,.12),inset 0 1px 0 rgba(255,255,255,.55) !important;
}
.hg-discount-badge {
  background:linear-gradient(135deg,#86ffae,var(--hg-acc)) !important;
  border:1px solid rgba(255,255,255,.25);
  border-radius:999px !important;
  box-shadow:0 8px 22px rgba(57,255,118,.20);
}
.hg-badge { backdrop-filter:blur(8px); }

/* Pagination and empty state */
.hg-page-btn {
  color:#aab2ad !important;
  background:rgba(255,255,255,.035) !important;
  border:1px solid rgba(255,255,255,.095) !important;
  border-radius:11px !important;
}
.hg-page-btn:hover,.hg-page-btn.is-active {
  color:#061009 !important;
  background:var(--hg-acc) !important;
  border-color:var(--hg-acc) !important;
  box-shadow:0 10px 25px rgba(57,255,118,.18);
}
.hg-empty p { color:#a8b0ab !important; }
.hg-error-msg { color:#ff9a9a !important; background:rgba(255,70,70,.07) !important; border-color:rgba(255,100,100,.28) !important; }

/* Premium configurator modal */
.hg-modal-overlay { background:rgba(0,0,0,.84) !important; backdrop-filter:blur(14px) !important; }
.hg-modal-inner {
  color:#f2f5f3 !important;
  background:linear-gradient(160deg,rgba(15,21,17,.99),rgba(5,8,6,.995)) !important;
  border:1px solid rgba(57,255,118,.24) !important;
  border-radius:22px !important;
  box-shadow:0 38px 120px rgba(0,0,0,.72),0 0 55px rgba(57,255,118,.07),inset 0 1px 0 rgba(255,255,255,.05);
}
.hg-modal-head,.hg-domain-row,.hg-modal-footer { border-color:rgba(255,255,255,.085) !important; }
.hg-modal-head { background:rgba(255,255,255,.018); }
.hg-modal-app-name { color:#fff !important; font-weight:780 !important; }
.hg-modal-close { color:#a6aea9 !important; background:rgba(255,255,255,.045) !important; border-color:rgba(255,255,255,.10) !important; border-radius:10px !important; }
.hg-domain-row { background:rgba(57,255,118,.035) !important; }
.hg-domain-input,.hg-opt-item,.hg-qty-field {
  color:#f1f4f2 !important;
  background:rgba(255,255,255,.035) !important;
  border-color:rgba(255,255,255,.105) !important;
  border-radius:11px !important;
}
.hg-domain-input::placeholder { color:#747d77 !important; }
.hg-domain-hint,.hg-opt-option-title,.hg-modal-loading,.hg-modal-price-label,.hg-modal-period { color:#969f99 !important; }
.hg-opt-item:hover { border-color:rgba(57,255,118,.38) !important; background:rgba(57,255,118,.055) !important; }
.hg-opt-item.is-selected { color:#fff !important; background:rgba(57,255,118,.09) !important; border-color:var(--hg-acc) !important; box-shadow:0 0 0 3px rgba(57,255,118,.07) !important; }
.hg-modal-footer { background:rgba(4,7,5,.84) !important; }
.hg-modal-total-val,.hg-modal-sym,.hg-opt-group-title,.hg-domain-label,.hg-opt-price { color:var(--hg-acc) !important; }

/* Visibility safeguards against themes */
.hg-wrap,.hg-wrap p,.hg-wrap li,.hg-wrap label,.hg-wrap span,.hg-wrap strong,.hg-wrap h1,.hg-wrap h2,.hg-wrap h3,.hg-wrap h4 { opacity:1; visibility:visible; }
.hg-wrap input,.hg-wrap select,.hg-wrap button { font-family:var(--hg-font) !important; }
.hg-wrap button:focus-visible,.hg-wrap a:focus-visible,.hg-wrap input:focus-visible,.hg-wrap select:focus-visible { outline:2px solid var(--hg-acc) !important; outline-offset:3px; }

@media(max-width:1024px){
  .hg-wrap{padding:26px !important;}
}
@media(max-width:768px){
  .hg-wrap{padding:20px 16px 28px !important;border-radius:18px !important;}
  .hg-header-title{font-size:26px !important;}
  .hg-toolbar{gap:10px !important;}
  .hg-cycle-switcher,.hg-filters{margin-left:-2px;margin-right:-2px;}
  .hg-card-body{padding:18px !important;}
  .hg-card-footer{padding:15px 18px !important;}
  .hg-modal-inner{border-radius:22px 22px 0 0 !important;}
}
@media(max-width:480px){
  .hg-market-grid{grid-template-columns:1fr !important;gap:15px !important;}
  .hg-card-title{font-size:16px !important;}
  .hg-card-body{padding:17px !important;}
  .hg-btn .hg-btn-text{display:inline !important;}
  .hg-btn::after{content:none !important;}
  .hg-btn-arr{display:block !important;}
  .hg-card-footer{align-items:center !important;}
}

/* ============================================================
   v3.1.1 — REMOVE OUTER MARKETPLACE PANEL
   Keep premium controls/cards, but inherit the page background.
   ============================================================ */
.hg-wrap {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  overflow: visible !important;
}
.hg-wrap::before,
.hg-wrap::after {
  content: none !important;
  display: none !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}