/* RUST MARKET: light/dark theme and responsive layout */
html {
    color-scheme: light;
    background: var(--bg, #eef3f9);
}
html[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0a0f17;
    --surface: #121923;
    --surface-soft: #0f1620;
    --surface-strong: #1a2330;
    --text: #f4f7fb;
    --muted: #9aa7b8;
    --muted-2: #718096;
    --line: #263142;
    --line-strong: #354257;
    --primary: #3b82f6;
    --primary-dark: #93c5fd;
    --primary-soft: rgba(59, 130, 246, .16);
    --blue: #67a4ff;
    --green: #4ade80;
    --danger: #fb7185;
    --warning: #fbbf24;
    --shadow-sm: 0 10px 28px rgba(0, 0, 0, .24);
    --shadow-md: 0 20px 54px rgba(0, 0, 0, .34);
}

body,
.site-header,
.site-footer,
.card,
.rm-card,
.dropdown-menu,
.header-search input,
.icon-button,
.field input,
.field select,
.field textarea,
.rm-input,
.btn-secondary,
.rm-btn-ghost,
.message {
    transition: background-color .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease;
}

html[data-theme="dark"] body {
    background:
        radial-gradient(circle at 12% 0%, rgba(37, 99, 235, .10), transparent 32%),
        radial-gradient(circle at 88% 8%, rgba(37, 99, 235, .08), transparent 30%),
        var(--bg);
}
html[data-theme="dark"] .site-header {
    background: rgba(10, 15, 23, .92);
    border-bottom-color: var(--line);
}
html[data-theme="dark"] .site-footer,
html[data-theme="dark"] .dropdown-menu,
html[data-theme="dark"] .card,
html[data-theme="dark"] .rm-card,
html[data-theme="dark"] .message,
html[data-theme="dark"] .filter-bar,
html[data-theme="dark"] .product-card,
html[data-theme="dark"] .inventory-checker,
html[data-theme="dark"] .hero-banner,
html[data-theme="dark"] .auth-card,
html[data-theme="dark"] .order-row {
    background: var(--surface);
    border-color: var(--line);
    color: var(--text);
}
html[data-theme="dark"] .site-footer { border-top-color: var(--line); }
html[data-theme="dark"] .header-link,
html[data-theme="dark"] .icon-button,
html[data-theme="dark"] .dropdown-item,
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .rm-btn-ghost,
html[data-theme="dark"] .field label {
    color: #c9d2df;
}
html[data-theme="dark"] .header-link:hover,
html[data-theme="dark"] .icon-button:hover,
html[data-theme="dark"] .dropdown-item:hover,
html[data-theme="dark"] .btn-secondary:hover,
html[data-theme="dark"] .rm-btn-ghost:hover {
    color: #fff;
    background: var(--primary-soft);
}
html[data-theme="dark"] .icon-button,
html[data-theme="dark"] .btn-secondary,
html[data-theme="dark"] .rm-btn-ghost {
    background: var(--surface-soft);
    border-color: var(--line);
}
html[data-theme="dark"] .icon-button .online-dot { border-color: var(--surface-soft); }
html[data-theme="dark"] .header-search input,
html[data-theme="dark"] .field input,
html[data-theme="dark"] .field select,
html[data-theme="dark"] .field textarea,
html[data-theme="dark"] .rm-input,
html[data-theme="dark"] .steam-control input,
html[data-theme="dark"] .steam-url-input,
html[data-theme="dark"] .secret-input,
html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
    color: var(--text);
    background: var(--surface-soft);
    border-color: var(--line-strong);
}
html[data-theme="dark"] input::placeholder,
html[data-theme="dark"] textarea::placeholder { color: #66758a; }
html[data-theme="dark"] .header-search input:focus,
html[data-theme="dark"] .steam-control input:focus,
html[data-theme="dark"] .field input:focus,
html[data-theme="dark"] .field select:focus,
html[data-theme="dark"] .field textarea:focus,
html[data-theme="dark"] .rm-input:focus {
    background: #111a26;
}
html[data-theme="dark"] .brand-logo { background: transparent; box-shadow: none; }
html[data-theme="dark"] .footer-copy,
html[data-theme="dark"] .site-footer { border-color: var(--line); }
html[data-theme="dark"] .step-indicator {
    color: var(--muted);
    background: var(--surface-soft);
    border-color: var(--line);
}

/* Main catalogue overrides */
html[data-theme="dark"] .steam-topup {
    background:
        radial-gradient(circle at 92% 15%, rgba(67, 117, 255, .17), transparent 35%),
        linear-gradient(135deg, #121923 0%, #101a2a 100%);
}
html[data-theme="dark"] .steam-control label { color: #b8c3d2; }
html[data-theme="dark"] .steam-control input { color: #f8fafc; background: rgba(10, 15, 23, .78); border-color: #334155; }
html[data-theme="dark"] .filter-bar { box-shadow: var(--shadow-sm); }
html[data-theme="dark"] .filter-button { color: #b8c3d2; }
html[data-theme="dark"] .filter-button:hover { color: #fff; }
html[data-theme="dark"] .product-visual { background: #1a2330; }
html[data-theme="dark"] .product-footer { border-top-color: var(--line); }
html[data-theme="dark"] .product-price,
html[data-theme="dark"] .summary-row strong,
html[data-theme="dark"] .summary-row.total,
html[data-theme="dark"] .data-row strong { color: var(--text); }
html[data-theme="dark"] .no-products { background: rgba(18, 25, 35, .7); border-color: var(--line-strong); }
html[data-theme="dark"] .payment-placeholder { background: rgba(59, 130, 246, .10); border-color: rgba(96, 165, 250, .28); }
html[data-theme="dark"] .result { color: #bbf7d0; background: rgba(22, 101, 52, .22); border-color: rgba(74, 222, 128, .28); }
html[data-theme="dark"] .glass { color: #f8fafc; background: #111827; border-color: #2a3648; }
html[data-theme="dark"] .message.success { color: #bbf7d0; background: rgba(22,101,52,.20); border-color: rgba(74,222,128,.30); }
html[data-theme="dark"] .message.error { color: #fecaca; background: rgba(127,29,29,.22); border-color: rgba(248,113,113,.30); }


html[data-theme="dark"] .inventory-check-form input {
    color: var(--text);
    background: var(--surface-soft);
    border-color: var(--line-strong);
}
html[data-theme="dark"] .inventory-check-error {
    color: #fecaca;
    background: rgba(127,29,29,.22);
    border-color: rgba(248,113,113,.30);
}
html[data-theme="dark"] .round-result {
    background: var(--surface-soft);
    border-color: var(--line);
}
html[data-theme="dark"] .round-result.complete {
    background: rgba(22,101,52,.16);
    border-color: rgba(74,222,128,.24);
}
html[data-theme="dark"] .round-result.missing {
    background: rgba(146,64,14,.15);
    border-color: rgba(251,191,36,.22);
}
html[data-theme="dark"] .round-state.complete { color: #bbf7d0; background: rgba(22,101,52,.34); }
html[data-theme="dark"] .round-state.missing { color: #fde68a; background: rgba(146,64,14,.34); }
html[data-theme="dark"] .round-state.unconfigured { color: #cbd5e1; background: #263142; }
html[data-theme="dark"] .missing-item { color: #fde68a; background: rgba(146,64,14,.22); border-color: rgba(251,191,36,.20); }

/* Utility pages with their own embedded styles */
html[data-theme="dark"] .converter-card,
html[data-theme="dark"] .generator-card,
html[data-theme="dark"] .instruction-card,
html[data-theme="dark"] .steps-panel,
html[data-theme="dark"] .info-tile,
html[data-theme="dark"] .final-tile,
html[data-theme="dark"] .instruction-list > li {
    background: var(--surface) !important;
    border-color: var(--line) !important;
    color: var(--text);
}
html[data-theme="dark"] .steam-id-title,
html[data-theme="dark"] .rm-title,
html[data-theme="dark"] .step-title,
html[data-theme="dark"] .generator-label,
html[data-theme="dark"] .info-tile h3,
html[data-theme="dark"] .final-tile h3 { color: var(--text) !important; }
html[data-theme="dark"] .steam-id-subtitle,
html[data-theme="dark"] .rm-subtitle,
html[data-theme="dark"] .instruction-content,
html[data-theme="dark"] .helper-text,
html[data-theme="dark"] .info-tile p { color: var(--muted) !important; }
html[data-theme="dark"] .steam-url-input,
html[data-theme="dark"] .secret-input { background: var(--surface-soft) !important; border-color: var(--line-strong) !important; }
html[data-theme="dark"] .output-value,
html[data-theme="dark"] .code-box { background: #080d14 !important; border-color: var(--line) !important; }

/* Theme switch */
.theme-toggle .theme-icon-sun { display: none; }
.theme-toggle .theme-icon-moon { display: inline-block; }
html[data-theme="dark"] .theme-toggle .theme-icon-sun { display: inline-block; }
html[data-theme="dark"] .theme-toggle .theme-icon-moon { display: none; }
.theme-label { white-space: nowrap; }

/* Safer responsive defaults */
html, body { max-width: 100%; overflow-x: hidden; }
img, video, iframe { max-width: 100%; height: auto; }
button, a, input, select, textarea { min-width: 0; }
.table-scroll, .responsive-table { overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 1180px) {
    .container, .rm-container { width: min(100% - 28px, 1220px); }
    .products-grid { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
}

@media (max-width: 980px) {
    .header-actions .desktop-only { display: none !important; }
    .mobile-toggle { display: inline-flex !important; }
    .hero-grid { grid-template-columns: 1fr !important; }
    .hero-banner { min-height: 220px; }
    .category-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .product-page { grid-template-columns: 1fr !important; }
    .product-visual { min-height: 300px !important; }
    .footer-inner { grid-template-columns: 1fr !important; text-align: center; }
    .footer-links { justify-content: center !important; }
}

@media (max-width: 760px) {
    .container, .rm-container { width: min(100% - 22px, 1220px); }
    .site-header { position: sticky; }
    .header-inner {
        min-height: auto !important;
        padding: 10px 0 !important;
        grid-template-columns: auto 1fr auto !important;
        gap: 9px !important;
    }
    .brand-name { display: none !important; }
    .brand-logo { width: 40px !important; height: 40px !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
    .header-search { grid-column: 1 / -1; grid-row: 2; }
    .header-search input { height: 42px !important; }
    .header-actions { gap: 6px; }
    .icon-button, .mobile-toggle { width: 40px !important; min-height: 40px !important; }
    .mobile-menu { max-height: calc(100vh - 120px); overflow-y: auto; }
    .catalog-page, .account-page, .checkout-page, .order-page, .product-wrap { padding-top: 16px !important; padding-bottom: 46px !important; }
    .hero-grid { gap: 12px !important; }
    .steam-topup, .drops-copy { padding: 18px !important; }
    .steam-form { grid-template-columns: 1fr !important; }
    .steam-submit, .steam-errors { grid-column: auto !important; }
    .category-cards { grid-template-columns: 1fr !important; }
    .category-card { min-height: 108px !important; }
    .category-content { min-height: 76px !important; }
    .products-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 10px !important; }
    .product-body { padding: 12px !important; }
    .product-name { min-height: 0 !important; font-size: 14px !important; }
    .product-price { font-size: 18px !important; }
    .section-title { align-items: flex-start !important; flex-direction: column !important; }
    .account-head { align-items: stretch !important; }
    .account-actions { width: 100%; }
    .account-actions .btn { flex: 1; }
    .order-row { grid-template-columns: minmax(0,1fr) auto !important; gap: 10px !important; }
    .order-price, .order-status { display: none !important; }
    .checkout, .order-card, .product-info, .auth-card { padding: 20px !important; }
    .summary-row, .data-row { gap: 12px; }
    .instruction-shell, .generator-shell, .steam-id-shell { padding-left: 12px !important; padding-right: 12px !important; }
    .steps-row, .info-grid, .final-grid { grid-template-columns: 1fr !important; }
    .input-row { grid-template-columns: 1fr !important; }
    .nav-bottom, .code-actions, .result-head { flex-direction: column !important; align-items: stretch !important; }
    .nav-bottom a, .code-actions a, .code-actions button, .copy-btn, .convert-btn { width: 100% !important; }
    .terms-page, .container.mx-auto { max-width: 100%; }
}

@media (max-width: 520px) {
    .container, .rm-container { width: min(100% - 16px, 1220px); }
    .header-actions { gap: 4px; }
    .icon-button, .mobile-toggle { width: 38px !important; min-height: 38px !important; border-radius: 10px !important; }
    .theme-label { display: none; }
    .hero-banner { min-height: 210px !important; border-radius: 16px !important; }
    .steam-title { font-size: 19px !important; }
    .drops-copy h1 { font-size: 30px !important; }
    .filter-bar { margin-left: -2px; margin-right: -2px; }
    .products-grid { grid-template-columns: 1fr !important; }
    .product-visual { aspect-ratio: 1.55 / 1 !important; }
    .account-actions { flex-direction: column; }
    .account-actions .btn, .account-actions form, .account-actions form .btn { width: 100%; }
    .buy-line { align-items: stretch !important; flex-direction: column !important; }
    .buy-line .btn { width: 100%; }
    .rm-title, .steam-id-title { font-size: clamp(30px, 10vw, 42px) !important; }
    .instruction-list > li { padding-left: 50px !important; }
}

@media (max-width: 360px) {
    .container, .rm-container { width: min(100% - 12px, 1220px); }
    .brand-logo { width: 36px !important; height: 36px !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; }
    .icon-button, .mobile-toggle { width: 36px !important; min-height: 36px !important; }
    .header-search input { font-size: 12px !important; }
}