/*
Theme Name: CS2 Marketplace
Author: Marketplace Theme
Description: RTL-first storefront theme for the configurable CS2 marketplace plugin.
Version: 1.1.0
Requires at least: 6.2
Requires PHP: 7.4
Text Domain: skinroom-market
*/

:root {
  --sr-ink: #11140f;
  --sr-paper: #f2f3ec;
  --sr-lime: #d5ff58;
  --sr-muted: #777b70;
  --sr-line: #dedfd5;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--sr-paper);
  color: var(--sr-ink);
  font: 15px/1.7 Vazirmatn, Tahoma, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
}
body, button, input, select, textarea { font-family: Vazirmatn, Tahoma, Arial, sans-serif; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.sr-skip-link { position: absolute; top: -80px; right: 12px; z-index: 99; padding: 10px 14px; background: var(--sr-lime); color: var(--sr-ink); }
.sr-skip-link:focus { top: 12px; }
.sr-site-header { position: relative; z-index: 10; background: var(--sr-ink); color: #fff; border-bottom: 1px solid #ffffff20; }
.sr-header-inner { width: min(1240px, calc(100% - 44px)); min-height: 74px; margin: auto; display: flex; align-items: center; gap: 30px; }
.sr-brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; font-weight: 800; }
.sr-brand-mark { width: 38px; height: 38px; display: grid; place-items: center; background: var(--sr-lime); color: var(--sr-ink); font-size: 19px; clip-path: polygon(0 0,100% 0,100% 72%,70% 100%,0 100%); }
.sr-brand-name { font-size: 16px; line-height: 1.1; direction: ltr; text-align: left; letter-spacing: .03em; }
.sr-brand-name small { display: block; margin-top: 4px; color: #a1aa95; font: 9px/1.2 monospace; letter-spacing: .16em; }
.sr-site-header .custom-logo-link { display: inline-flex; align-items: center; max-width: 240px; }
.sr-site-header .custom-logo { display: block; width: auto; max-width: 240px; max-height: 52px; }
.sr-header-nav { display: flex; align-items: center; justify-content: center; gap: clamp(14px, 2vw, 28px); margin-inline: auto; color: #c3c6bd; font-size: 12px; }
.sr-header-nav a:hover, .sr-header-nav a:focus-visible { color: var(--sr-lime); }
.sr-header-actions { display: flex; align-items: center; gap: 9px; }
.sr-header-account { border: 1px solid #ffffff42; border-radius: 8px; padding: 9px 13px; background: transparent; color: #fff; cursor: pointer; font-size: 11px; font-weight: 700; }
.sr-header-account:hover, .sr-header-account:focus-visible { border-color: var(--sr-lime); color: var(--sr-lime); }
.sr-site-main { min-height: 65vh; }
.sr-site-footer { padding: 20px 22px; background: var(--sr-ink); color: #b7bcad; font-size: 11px; }
.sr-footer-inner { width: min(1240px, 100%); margin: auto; display: flex; justify-content: space-between; align-items: center; gap: 14px; }
.sr-site-footer strong { color: #fff; }
.sr-content-page { width: min(900px, calc(100% - 36px)); margin: 52px auto 72px; }
.sr-content-page h1, .sr-content-page h2 { line-height: 1.35; }
.sr-content-page a { color: #4f6723; text-decoration: underline; }
@media (max-width: 720px) {
  .sr-header-inner { width: min(100% - 30px, 560px); min-height: 66px; gap: 10px; }
  .sr-header-nav { display: none; }
  .sr-header-actions { margin-right: auto; }
  .sr-header-account { width: 40px; height: 40px; padding: 6px; font-size: 0; }
  .sr-header-account::after { content: "◉"; font-size: 19px; }
  .sr-footer-inner { align-items: flex-start; flex-direction: column; }
}