/*
 * Copyright (c) 2026 PsyGioX. Licensed under the MIT License.
 * Source: https://github.com/PsyGioX/PsyGioX-website — Site: https://psygiox-dev.vercel.app/
 *
 * Copyright (c) 2026 PsyGioX. Лицензия MIT.
 * Исходники: https://github.com/PsyGioX/PsyGioX-website — Сайт: https://psygiox-dev.vercel.app/
 */
/* ==========================================================================
   Внутренние страницы (услуги, калькулятор, инструменты, политики):
   подстройка под lo-fi поверх их собственных стилей.
   ========================================================================== */
body { padding-top: var(--header-h); background: transparent !important; color: var(--star); }
html { background: var(--void); }

/* шапка на страницах без бургера (инструменты) */
.nav-always { display: flex; }
.header__right { display: flex; align-items: center; gap: 12px; }
.lang-switch { display: flex; gap: 6px; padding: 4px; background: rgba(var(--cyan-rgb), 0.1); border-radius: 999px; }

/* вторичные кнопки старых страниц */
.lang-btn,
.tab-btn,
.copy-btn,
.icon-btn,
.prompt-btn {
  font-family: var(--f-display);
  font-weight: 800;
  color: var(--star) !important;
  background: var(--glass) !important;
  border: 2px solid rgba(var(--ink-rgb), 0.14) !important;
  border-radius: 999px !important;
  box-shadow: 0 3px 0 rgba(var(--ink-rgb), 0.08);
  cursor: pointer;
  transition: transform 0.25s var(--spring), border-color 0.2s, color 0.2s, background-color 0.2s, box-shadow 0.2s;
}
.lang-btn { padding: 6px 14px; font-size: 12.5px; font-weight: 800; }
.lang-switch .lang-btn { box-shadow: none; border-color: transparent !important; background: transparent !important; }
.lang-btn:hover, .tab-btn:hover, .copy-btn:hover, .icon-btn:hover, .prompt-btn:hover {
  color: var(--cyan) !important;
  border-color: rgba(var(--cyan-rgb), 0.5) !important;
  background: var(--panel-hi) !important;
  transform: translateY(-2px);
}
.lang-btn.active, .tab-btn.active, .prompt-btn.active {
  color: var(--on-pastel) !important;
  border-color: rgba(255, 255, 255, 0.8) !important;
  background: linear-gradient(135deg, var(--p-lav), var(--p-pink)) !important;
  box-shadow: 0 3px 0 rgba(150, 100, 200, 0.4);
}
.btn--danger { --c: var(--hot); --c-rgb: var(--hot-rgb); }
.btn-wide { width: 100%; }

/* поля форм */
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]),
textarea,
select {
  color: var(--star) !important;
  background: var(--field) !important;
  border: 2px solid rgba(var(--cyan-rgb), 0.22) !important;
  border-radius: 16px !important;
  font-family: var(--f-body);
  transition: border-color 0.2s, box-shadow 0.2s;
}
input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="color"]):not([type="file"]):focus,
textarea:focus,
select:focus {
  outline: none;
  border-color: var(--ion) !important;
  box-shadow: 0 0 0 4px rgba(var(--ion-rgb), 0.18);
}
input[type="checkbox"], input[type="radio"], input[type="range"] { accent-color: var(--ion); }
::placeholder { color: var(--faint); opacity: 1; }
option { background: var(--space); color: var(--star); }

/* текст и код */
code, pre, kbd, samp, textarea { font-family: var(--f-mono); }
textarea.tool-textarea, textarea.textarea-field, textarea.result-textarea { font-size: 13px; }
pre, code { color: var(--star); }
table { border-collapse: collapse; }
th, td { border-color: var(--line-dim); }
hr { border: 0; border-top: 3px dashed var(--line-dim); }
h1, h2, h3, h4 { color: var(--star); }
a:hover { color: var(--ion); }

.footer, footer { border-color: var(--line-dim); }

/* калькулятор */
.calc-icon {
  background: linear-gradient(135deg, var(--p-lav), var(--p-pink)) !important;
  border: 3px solid rgba(255, 255, 255, 0.85);
  color: var(--on-pastel) !important;
  box-shadow: 0 14px 30px -10px rgba(var(--shadow-rgb), 0.6) !important;
}

:root { --radius: 18px; }

.calc-hero { background: transparent !important; }

/* ==========================================================================
   Слой совместимости: у старых страниц свои <style> с острыми углами и тонкими рамками.
   Здесь — общая «мягкая» форма для их карточек, плашек и таблеток.
   ========================================================================== */
.glass, .policy-card, .calc-card, .price-card, .result-card, .prompt-card, .contact-block, .modal-content,
.service-card:not(.panel), .seo-block, .mini-card, .hero-orbit, .drop-zone, .export-preview, .v5-settings {
  border-radius: var(--r-lg) !important;
  border: 2px solid var(--white-border) !important;
  box-shadow: 0 14px 34px -18px rgba(var(--shadow-rgb), 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.qa, .note, .quick, .payment-method, .option-card, .range-group, .output-item, .result-item, .feature-item,
.faq-item:not(.panel), .calc-note, .breakdown li, .md-preview, .warning, .stat, .prompt-header, .prompt-actions {
  border-radius: var(--r-md) !important;
}
.glass, .policy-card, .calc-card, .price-card, .result-card, .prompt-card, .service-card:not(.panel), .seo-block, .qa, .modal-content {
  -webkit-backdrop-filter: blur(12px) saturate(1.2);
  backdrop-filter: blur(12px) saturate(1.2);
}
/* таблетки */
.badge, .chip, .toc a, .pill, .seg, .tag, .prompt-tag, .prompt-badge, .stats-badge, .calc-badge, .deadline,
.quick a, .check, .payment-method .tag {
  border-radius: 999px !important;
}
.pill, .chip, .tag, .prompt-tag, .toc a, .quick a, .stats-badge, .calc-badge {
  font-weight: 700;
  color: var(--star) !important;
  background: rgba(var(--cyan-rgb), 0.13) !important;
  border-color: transparent !important;
}
.toc a:hover, .quick a:hover { background: rgba(var(--ion-rgb), 0.2) !important; }
.service-card:not(.panel):hover { transform: translateY(-3px); }
.breakdown-remove, .prompt-btn, .btn-danger { border-radius: 999px !important; }
.swatch, .color-chip, .preview-swatch, .output-item { border-radius: var(--r-sm) !important; }
.strength-bar, .strength-fill { border-radius: 999px !important; }
::-webkit-scrollbar-thumb { border-radius: 999px; }

/* ---------- Документы (privacy, terms, cookies, offer): читаемость и печать ---------- */
.policy-card h2, .policy-header h1 { text-wrap: balance; overflow-wrap: anywhere; }
.policy-card p, .policy-card li { max-width: 72ch; line-height: 1.7; overflow-wrap: break-word; hyphens: auto; text-wrap: pretty; }
.policy-card li + li { margin-top: 0.35em; }
/* карточки лежат внутри <section class="lang">, поэтому gap у .policy-body на них не действовал — блоки слипались */
.policy-body .lang:not(.hidden) { display: flex; flex-direction: column; gap: clamp(1rem, 2.4vw, 1.5rem); }
.policy-body .lang:not(.hidden) > .policy-card { margin-bottom: 0; }
.policy-card > :last-child { margin-bottom: 0; }
.policy-card h2 { margin-bottom: 0.9rem; line-height: 1.3; }
.policy-card p + p { margin-top: 0.25rem; }
.policy-card ul { margin: 0.9rem 0 1rem; }
.policy-card .contact-block, .policy-card .note { margin-top: 1rem; }
.policy-card a { text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.policy-card a:hover { text-decoration-thickness: 2.5px; }
.policy-card a:focus-visible, .policy-controls button:focus-visible, .policy-controls a:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; border-radius: 6px; }
.policy-card :is(h2, h3), .lang[id] { scroll-margin-top: calc(var(--header-h) + 16px); }
.policy-card table { display: block; max-width: 100%; overflow-x: auto; border-collapse: collapse; }
.policy-card :is(th, td) { padding: 8px 12px; border: 1px solid var(--line-dim); text-align: left; vertical-align: top; }
.policy-card code { padding: 1px 6px; font-size: 0.92em; border-radius: 6px; background: rgba(var(--void-rgb), 0.55); overflow-wrap: anywhere; }

@media (prefers-reduced-motion: reduce) {
  .policy-card, .policy-card:hover { transition: none; transform: none; }
}

@media print {
  html, body { background: #fff !important; color: #000 !important; padding-top: 0 !important; }
  .header, header, .footer, footer, .policy-controls, .nav-always, .bg-veil, .bg-stars, .music-toggle, [data-music-toggle] { display: none !important; }
  .glass, .policy-card, .policy-header { background: none !important; box-shadow: none !important; border: 0 !important; backdrop-filter: none !important; color: #000 !important; transform: none !important; }
  .policy-card { break-inside: avoid-page; padding: 0 0 12px !important; }
  .policy-card h2 { break-after: avoid; color: #000 !important; }
  .policy-card p, .policy-card li { max-width: none; color: #000 !important; font-size: 11pt; line-height: 1.5; }
  .policy-card a { color: #000 !important; text-decoration: underline; }
  .policy-card a[href^="http"]::after { content: " (" attr(href) ")"; font-size: 9pt; }
  .lang.hidden { display: none !important; }
}

/* шапка документа: плашки быстрых ссылок и бейджи не должны слипаться */
.policy-header .quick { border: 0; background: none; box-shadow: none; padding-left: 0; padding-right: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.6rem; margin-top: 1rem; padding-top: 0.2rem; padding-bottom: 0.2rem; }
.policy-header .quick a { padding: 0.3rem 0.8rem; }
.policy-header .badge-row { display: flex; flex-wrap: wrap; gap: 0.5rem 0.6rem; }
.policy-header .updated { margin-bottom: 0.9rem; }
