/* ══════════════════════════════════════════════════════════════════
   SEO Page Checker v1.3
   Тема: web-seo.by | Raleway | --main-color:#31B939 | фон #F5F5F5
   ══════════════════════════════════════════════════════════════════ */

/* ── Секция и заголовок страницы ──────────────────────────────── */

.spc-tool-section { padding-bottom: 4.167vw; }

.spc-page-title {
    font-family: "Raleway", sans-serif;
    font-weight: 800;
    font-size: 2.604vw;
    color: var(--text-main-color, #1C1C1C);
    margin: 2.5vw 0 0.5vw;
    line-height: 1.2;
}

.spc-page-sub {
    font-family: "Raleway", sans-serif;
    font-size: 0.938vw;
    color: #6B7280;
    margin: 0 0 2vw;
    line-height: 1.6;
}

/* ── Форма ────────────────────────────────────────────────────── */

.spc-form-card {
    background: #fff;
    border-radius: 1.563vw;
    padding: 2.083vw 2.604vw;
    margin-bottom: 1.563vw;
}

.spc-form-label {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw;
    font-weight: 700;
    color: #9CA3AF;
    margin: 0 0 1.25vw;
    text-transform: uppercase;
    letter-spacing: 0.08em;
}

.spc-url-list   { margin-bottom: 0.833vw; }

.spc-url-row {
    display: flex;
    align-items: center;
    gap: 0.625vw;
    margin-bottom: 0.521vw;
}

.spc-url-num {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw;
    font-weight: 700;
    color: var(--main-color, #31B939);
    width: 1.25vw;
    text-align: center;
    flex-shrink: 0;
}

.spc-url-input {
    flex: 1;
    height: 2.917vw;
    padding: 0 1.042vw;
    font-family: "Raleway", sans-serif;
    font-size: 0.833vw;
    border: 1.5px solid rgba(28,28,28,.15);
    border-radius: 0.781vw;
    background: #F9FAFB;
    color: var(--text-main-color, #1C1C1C);
    outline: none;
    transition: border-color .2s, background .2s;
    box-sizing: border-box;
}
.spc-url-input:focus { border-color: var(--main-color,#31B939); background:#fff; }
.spc-url-input::placeholder { color: #C0C3C8; }

.spc-rm-btn {
    width: 2.083vw; height: 2.083vw;
    border: none; background: #F3F4F6;
    cursor: pointer; border-radius: 0.417vw;
    display: flex; align-items: center; justify-content: center;
    color: #9CA3AF; flex-shrink: 0;
    transition: background .15s, color .15s; padding: 0;
}
.spc-rm-btn:hover { background: #E5E7EB; color: #374151; }

.spc-add-btn {
    display: inline-flex; align-items: center; gap: 0.417vw;
    font-family: "Raleway", sans-serif;
    font-size: 0.729vw; font-weight: 700;
    color: var(--main-color,#31B939);
    background: none; border: none; cursor: pointer;
    padding: 0; margin-bottom: 1.563vw;
    transition: opacity .15s; line-height: 1;
}
.spc-add-btn:hover { opacity: .7; }

.spc-go-btn {
    display: flex; align-items: center; gap: 0.625vw;
    font-family: "Raleway", sans-serif;
    font-size: 0.938vw; font-weight: 700;
    color: #fff; background: var(--main-color,#31B939);
    border: none; border-radius: 0.781vw;
    padding: 0.938vw 2.083vw; cursor: pointer;
    transition: background .2s, transform .1s;
}
.spc-go-btn:hover:not(:disabled) { background: var(--main-color-darken,#1f9f27); }
.spc-go-btn:active:not(:disabled) { transform: scale(0.99); }
.spc-go-btn:disabled { opacity: .55; cursor: default; }

/* ── Блок результата ──────────────────────────────────────────── */

.spc-results { margin-top: 1.563vw; }

.spc-block {
    background: #fff;
    border-radius: 1.563vw;
    overflow: hidden;
    margin-bottom: 1.25vw;
    box-shadow: 0 1px 4px rgba(0,0,0,.04);
}

/* ── Шапка блока ──────────────────────────────────────────────── */

.spc-block-header {
    display: flex; align-items: center;
    justify-content: space-between; gap: 1.25vw;
    padding: 1.042vw 1.563vw;
    background: var(--text-main-color,#1C1C1C);
}

.spc-block-header-left { flex: 1; min-width: 0; }

.spc-block-url {
    font-family: "Raleway", sans-serif;
    font-size: 0.729vw; font-weight: 600;
    color: rgba(255,255,255,.9);
    word-break: break-all; display: block;
}

/* Циферблат общего балла */
.spc-gauge {
    display: flex; align-items: baseline; gap: 0.156vw;
    padding: 0.417vw 0.938vw;
    border-radius: 0.625vw; flex-shrink: 0;
}
.spc-gauge-val {
    font-family: "Raleway", sans-serif;
    font-size: 1.667vw; font-weight: 800; line-height: 1;
}
.spc-gauge-max {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; font-weight: 600; opacity: .7;
}
.spc-gauge-good { background: rgba(49,185,57,.18); color: #31B939; }
.spc-gauge-warn { background: rgba(202,138,4,.18);  color: #CA8A04; }
.spc-gauge-bad  { background: rgba(220,38,38,.18);  color: #DC2626; }
.spc-gauge-na   { background: rgba(255,255,255,.1); color: rgba(255,255,255,.5); }

/* ── Табы ─────────────────────────────────────────────────────── */

.spc-tabs {
    display: flex;
    border-bottom: 1.5px solid #F0F0F0;
    background: #FAFAFA;
    padding: 0 1.563vw;
    gap: 0;
}

.spc-tab {
    font-family: "Raleway", sans-serif;
    font-size: 0.729vw; font-weight: 700;
    color: #9CA3AF;
    background: none; border: none;
    border-bottom: 2px solid transparent;
    padding: 0.833vw 1.042vw;
    cursor: pointer;
    display: flex; align-items: center; gap: 0.417vw;
    transition: color .15s, border-color .15s;
    margin-bottom: -1.5px;
    white-space: nowrap;
}
.spc-tab:hover { color: var(--text-main-color,#1C1C1C); }
.spc-tab--active {
    color: var(--text-main-color,#1C1C1C);
    border-bottom-color: var(--main-color,#31B939);
}

.spc-tab-badge {
    font-family: "Raleway", sans-serif;
    font-size: 0.573vw; font-weight: 700;
    background: #FEE2E2; color: #DC2626;
    padding: 0.104vw 0.417vw;
    border-radius: 20px; line-height: 1.4;
}
.spc-tab--active .spc-tab-badge {
    background: #FEE2E2; color: #DC2626;
}
.spc-tab-ok {
    font-size: 0.625vw; color: var(--main-color,#31B939); font-weight: 800;
}

/* ── Панель таба ──────────────────────────────────────────────── */

.spc-tab-panel { display: none; }
.spc-tab-panel--active { display: block; }

/* ══ РЕДИРЕКТЫ ════════════════════════════════════════════════ */

.spc-redir-group { padding: 0.833vw 1.563vw 0; }
.spc-redir-group:last-of-type { padding-bottom: 0.833vw; }

.spc-redir-group-title {
    font-family: "Raleway", sans-serif;
    font-size: 0.625vw; font-weight: 700;
    text-transform: uppercase; letter-spacing: 0.08em;
    color: #9CA3AF;
    padding: 0.625vw 0 0.417vw;
    border-bottom: 1px solid #F3F4F6;
    margin-bottom: 0.208vw;
}

.spc-redir-row {
    display: grid;
    grid-template-columns: 1.25vw 1fr auto auto;
    gap: 0.625vw;
    align-items: start;
    padding: 0.573vw 0;
    border-bottom: 1px solid #FAFAFA;
}
.spc-redir-row:last-child { border-bottom: none; }

.spc-redir-status { padding-top: 0.1vw; }

.spc-redir-body { min-width: 0; }

.spc-redir-label {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; font-weight: 700;
    color: var(--text-main-color,#1C1C1C);
    margin-bottom: 0.156vw;
}

.spc-redir-url {
    font-family: 'Courier New', monospace;
    font-size: 0.573vw; color: #9CA3AF;
    word-break: break-all;
}

.spc-redir-chain {
    display: flex; align-items: center;
    gap: 0.208vw; flex-wrap: wrap;
    padding-top: 0.1vw; flex-shrink: 0;
}

.spc-redir-verdict { min-width: 10vw; max-width: 18vw; }

.spc-redir-text {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; line-height: 1.45;
    margin-bottom: 0.156vw;
}
.spc-redir-text--ok   { color: #166534; }
.spc-redir-text--err  { color: #991B1B; }
.spc-redir-text--warn { color: #854D0E; }
.spc-redir-text--info { color: #6B7280; }

.spc-fix-text {
    font-family: "Raleway", sans-serif;
    font-size: 0.573vw; color: #1D4ED8; line-height: 1.4;
}

.spc-chain-arr { color: #D1D5DB; font-size: 0.521vw; }

.spc-code {
    display: inline-block;
    font-family: "Raleway", sans-serif;
    font-size: 0.573vw; font-weight: 700;
    padding: 0.156vw 0.521vw; border-radius: 20px; white-space: nowrap;
}
.spc-c200 { background: rgba(49,185,57,.12); color: #166534; }
.spc-c301 { background: #DBEAFE; color: #1D4ED8; }
.spc-c302 { background: #FEF3C7; color: #92400E; }
.spc-c404 { background: #FEE2E2; color: #991B1B; }
.spc-c0   { background: #F3F4F6; color: #6B7280; }

.spc-redirect-note {
    font-family: "Raleway", sans-serif;
    font-size: 0.573vw; color: #9CA3AF;
    padding: 0.417vw 1.563vw 0.833vw; font-style: italic; margin: 0;
    border-top: 1px solid #F3F4F6;
}

/* ══ ЧЕКЛИСТЫ (SEO / Контент / Техника) ═══════════════════════ */

.spc-checks-wrap { padding: 1.042vw 1.563vw; }

/* Прогресс-бар балла */
.spc-score-bar-wrap {
    display: flex; align-items: center; gap: 0.833vw;
    margin-bottom: 1.25vw;
}
.spc-score-bar-track {
    flex: 1; height: 0.417vw;
    background: #F3F4F6; border-radius: 20px; overflow: hidden;
}
.spc-score-bar {
    height: 100%; border-radius: 20px;
    transition: width .6s ease;
}
.spc-bar-good { background: var(--main-color,#31B939); }
.spc-bar-warn { background: #CA8A04; }
.spc-bar-bad  { background: #DC2626; }
.spc-score-bar-val {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; font-weight: 700;
    color: var(--text-main-color,#1C1C1C);
    white-space: nowrap; flex-shrink: 0;
}

/* Группа по статусу */
.spc-check-group {
    margin-bottom: 0.833vw;
    border-radius: 0.625vw;
    overflow: hidden;
    border: 1px solid transparent;
}
.spc-check-group--err  { border-color: #FECACA; }
.spc-check-group--warn { border-color: #FDE68A; }
.spc-check-group--ok   { border-color: #BBF7D0; }
.spc-check-group--info { border-color: #E5E7EB; }

.spc-check-group-hdr {
    display: flex; align-items: center; gap: 0.521vw;
    padding: 0.573vw 0.833vw;
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; font-weight: 700;
}
.spc-check-group--err  .spc-check-group-hdr { background: #FEF2F2; color: #991B1B; }
.spc-check-group--warn .spc-check-group-hdr { background: #FFFBEB; color: #92400E; }
.spc-check-group--ok   .spc-check-group-hdr { background: #F0FDF4; color: #166534; }
.spc-check-group--info .spc-check-group-hdr { background: #F9FAFB; color: #374151; }

.spc-check-group-cnt {
    margin-left: auto;
    font-family: "Raleway", sans-serif;
    font-size: 0.573vw; font-weight: 700;
    background: rgba(0,0,0,.08);
    padding: 0.104vw 0.417vw; border-radius: 20px;
}

/* Элемент чеклиста */
.spc-check-item {
    padding: 0.625vw 0.833vw;
    border-top: 1px solid rgba(0,0,0,.04);
}

.spc-check-item-name {
    font-family: "Raleway", sans-serif;
    font-size: 0.729vw; font-weight: 700;
    color: var(--text-main-color,#1C1C1C);
    margin-bottom: 0.156vw;
}

.spc-check-item-detail {
    font-family: "Raleway", sans-serif;
    font-size: 0.677vw; color: #6B7280; line-height: 1.5;
}

.spc-check-item-fix {
    font-family: "Raleway", sans-serif;
    font-size: 0.625vw; color: #1D4ED8;
    margin-top: 0.208vw; line-height: 1.4;
}

/* Иконки-кружки */
.spc-ico-circle {
    display: inline-flex; align-items: center; justify-content: center;
    width: 1.042vw; height: 1.042vw;
    border-radius: 50%; font-size: 0.573vw; font-weight: 800;
    flex-shrink: 0; line-height: 1;
}
.spc-ico-ok   { background: rgba(49,185,57,.15); color: #166534; }
.spc-ico-err  { background: #FEE2E2; color: #DC2626; }
.spc-ico-warn { background: #FEF3C7; color: #CA8A04; }
.spc-ico-info { background: #F3F4F6; color: #6B7280; }

/* ── Загрузка / ошибка ────────────────────────────────────────── */

.spc-loading {
    padding: 2.604vw 1.563vw; text-align: center;
    font-family: "Raleway", sans-serif;
    color: #9CA3AF; font-size: 0.729vw;
}
.spc-spinner {
    display: inline-block; width: 0.833vw; height: 0.833vw;
    border: 2px solid #E5E7EB;
    border-top-color: var(--main-color,#31B939);
    border-radius: 50%;
    animation: spc-spin .7s linear infinite;
    vertical-align: middle; margin-right: 0.417vw;
}
@keyframes spc-spin { to { transform: rotate(360deg); } }

.spc-err {
    font-family: "Raleway", sans-serif;
    padding: 0.781vw 1.25vw; background: #FEE2E2;
    color: #991B1B; font-size: 0.729vw; font-weight: 700;
    border-radius: 0.781vw; margin-bottom: 0.833vw;
}

.spc-empty {
    padding: 1.563vw; text-align: center;
    font-family: "Raleway", sans-serif;
    font-size: 0.729vw; color: #9CA3AF;
}

/* ══ АДАПТИВ ══════════════════════════════════════════════════ */

@media (max-width: 992px) {
    .spc-page-title     { font-size: 4vw; margin: 4vw 0 1vw; }
    .spc-page-sub       { font-size: 1.8vw; margin-bottom: 3vw; }
    .spc-form-card      { border-radius: 3vw; padding: 3vw 4vw; margin-bottom: 3vw; }
    .spc-form-label     { font-size: 1.4vw; margin-bottom: 2vw; }
    .spc-url-num        { font-size: 1.4vw; width: 2vw; }
    .spc-url-input      { height: 5.5vw; font-size: 1.6vw; border-radius: 1.5vw; padding: 0 2vw; }
    .spc-rm-btn         { width: 4vw; height: 4vw; }
    .spc-add-btn        { font-size: 1.4vw; margin-bottom: 2.5vw; }
    .spc-go-btn         { font-size: 1.6vw; padding: 1.5vw 3vw; border-radius: 1.5vw; }
    .spc-block          { border-radius: 3vw; margin-bottom: 2vw; }
    .spc-block-header   { padding: 1.8vw 3vw; }
    .spc-block-url      { font-size: 1.4vw; }
    .spc-gauge-val      { font-size: 3vw; }
    .spc-gauge-max      { font-size: 1.2vw; }
    .spc-tabs           { padding: 0 3vw; }
    .spc-tab            { font-size: 1.4vw; padding: 1.5vw 2vw; }
    .spc-tab-badge      { font-size: 1.1vw; padding: 0.2vw 0.8vw; }
    .spc-tab-ok         { font-size: 1.2vw; }
    .spc-redir-group    { padding: 1.5vw 3vw 0; }
    .spc-redir-group-title { font-size: 1.2vw; }
    .spc-redir-row      { grid-template-columns: 2.5vw 1fr auto auto; gap: 1vw; padding: 1vw 0; }
    .spc-redir-label    { font-size: 1.3vw; }
    .spc-redir-url      { font-size: 1.1vw; }
    .spc-redir-text     { font-size: 1.3vw; }
    .spc-fix-text       { font-size: 1.1vw; }
    .spc-redir-verdict  { min-width: 18vw; max-width: 30vw; }
    .spc-code           { font-size: 1.1vw; padding: 0.3vw 1vw; }
    .spc-redirect-note  { font-size: 1.1vw; padding: 1vw 3vw 1.5vw; }
    .spc-checks-wrap    { padding: 2vw 3vw; }
    .spc-score-bar-track { height: 0.8vw; }
    .spc-score-bar-val  { font-size: 1.3vw; }
    .spc-check-group    { border-radius: 1.2vw; margin-bottom: 1.5vw; }
    .spc-check-group-hdr { padding: 1vw 1.5vw; font-size: 1.3vw; }
    .spc-check-item     { padding: 1.2vw 1.5vw; }
    .spc-check-item-name { font-size: 1.4vw; }
    .spc-check-item-detail { font-size: 1.3vw; }
    .spc-check-item-fix { font-size: 1.2vw; }
    .spc-ico-circle     { width: 2vw; height: 2vw; font-size: 1.1vw; }
    .spc-loading        { font-size: 1.4vw; padding: 4vw; }
    .spc-spinner        { width: 1.6vw; height: 1.6vw; }
}

@media (max-width: 768px) {
    .spc-tool-section   { padding-bottom: 10vw; }
    .spc-page-title     { font-size: 6.5vw; margin: 6vw 0 2vw; }
    .spc-page-sub       { font-size: 3.2vw; margin-bottom: 4vw; }
    .spc-form-card      { border-radius: 5vw; padding: 5vw; margin-bottom: 4vw; }
    .spc-form-label     { font-size: 2.5vw; margin-bottom: 3vw; }
    .spc-url-num        { font-size: 2.8vw; width: 4vw; }
    .spc-url-input      { height: 11vw; font-size: 3.2vw; border-radius: 2.5vw; padding: 0 3.5vw; }
    .spc-rm-btn         { width: 8vw; height: 8vw; border-radius: 2vw; }
    .spc-add-btn        { font-size: 3vw; margin-bottom: 4.5vw; }
    .spc-go-btn         { font-size: 3.8vw; padding: 3vw 5vw; border-radius: 3vw; }
    .spc-block          { border-radius: 5vw; margin-bottom: 4vw; }
    .spc-block-header   { padding: 3.5vw 4.5vw; flex-wrap: wrap; gap: 2vw; }
    .spc-block-url      { font-size: 2.8vw; }
    .spc-gauge-val      { font-size: 6vw; }
    .spc-gauge-max      { font-size: 2.5vw; }
    .spc-tabs           { padding: 0 4.5vw; overflow-x: auto; }
    .spc-tab            { font-size: 2.8vw; padding: 2.5vw 3vw; }
    .spc-tab-badge      { font-size: 2.2vw; }
    .spc-redir-row      { grid-template-columns: 5vw 1fr; gap: 1.5vw; }
    .spc-redir-chain    { display: none; }
    .spc-redir-verdict  { grid-column: 2; max-width: none; min-width: 0; }
    .spc-redir-label    { font-size: 2.8vw; }
    .spc-redir-url      { font-size: 2.2vw; }
    .spc-redir-text     { font-size: 2.5vw; }
    .spc-fix-text       { font-size: 2.2vw; }
    .spc-checks-wrap    { padding: 3vw 4.5vw; }
    .spc-score-bar-track { height: 1.5vw; }
    .spc-score-bar-val  { font-size: 2.8vw; }
    .spc-check-group    { border-radius: 2.5vw; margin-bottom: 2.5vw; }
    .spc-check-group-hdr { padding: 2.5vw 3vw; font-size: 2.8vw; }
    .spc-check-item     { padding: 2.5vw 3vw; }
    .spc-check-item-name { font-size: 3vw; }
    .spc-check-item-detail { font-size: 2.8vw; }
    .spc-check-item-fix { font-size: 2.5vw; }
    .spc-ico-circle     { width: 4.5vw; height: 4.5vw; font-size: 2.2vw; }
    .spc-loading        { font-size: 3vw; padding: 8vw; }
    .spc-spinner        { width: 4vw; height: 4vw; }
    .spc-err            { font-size: 3vw; border-radius: 3vw; }
}
