/* Стили страницы поиска товара в М.Косметик. */
:root { color-scheme:light; --red:#ed1c24; --ink:#222; --muted:#6b7280; --line:#e5e7eb; }
* { box-sizing:border-box; }
[hidden] { display:none !important; }
body { margin:0; font:16px/1.45 system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:#f6f7f9; }
main { width:min(760px,calc(100% - 28px)); margin:40px auto; }
.card { background:#fff; border:1px solid var(--line); border-radius:16px; padding:24px; box-shadow:0 8px 28px rgba(0,0,0,.05); }
h1 { margin:0 0 8px; font-size:clamp(24px,5vw,34px); line-height:1.15; }
h2 { margin:0 0 14px; font-size:22px; }
p { margin:8px 0 18px; } .muted { color:var(--muted); }
label { display:block; font-weight:650; margin:16px 0 6px; }
input[type=text] { width:100%; padding:12px 14px; border:1px solid #cbd0d8; border-radius:10px; font:inherit; }
input[type=text]:focus { outline:3px solid rgba(237,28,36,.14); border-color:var(--red); }
button,.button { display:inline-block; margin-top:20px; border:0; border-radius:10px; padding:12px 18px; color:#fff; background:var(--red); font:700 16px/1 system-ui; cursor:pointer; text-decoration:none; }
button:disabled { background:#c9ccd1; cursor:not-allowed; }
.secondary { color:var(--ink); background:#eceff3; margin-left:8px; }
.check { display:flex; gap:9px; align-items:flex-start; font-weight:400; }
.check input { margin-top:5px; }
.error,.warning { border-radius:10px; padding:12px 14px; margin:0 0 18px; }
.error { color:#8b1015; background:#fff0f0; border:1px solid #ffc7c9; }
.warning { color:#684a00; background:#fff8df; border:1px solid #f4dc8a; }
.choices { display:grid; gap:10px; margin-top:16px; }
.choice { display:flex; gap:11px; padding:13px; border:1px solid var(--line); border-radius:10px; cursor:pointer; font-weight:400; margin:0; }
.choice:has(input:checked) { border-color:var(--red); background:#fff7f7; }
.choice input { margin-top:5px; } .choice b,.choice span { display:block; }
.summary { display:flex; flex-wrap:wrap; gap:10px; margin:16px 0 22px; }
.pill { padding:7px 11px; background:#f0f2f5; border-radius:999px; }
.store { border-top:1px solid var(--line); padding:18px 0 2px; }
.store h3 { margin:0 0 7px; font-size:17px; }
.store a { margin-right:14px; color:#b4131a; }
.product-card { display:grid; grid-template-columns:minmax(180px,280px) 1fr; gap:24px; align-items:start; }
.product-photo { width:100%; aspect-ratio:1; object-fit:contain; border:1px solid var(--line); border-radius:12px; }
.thumbs { display:flex; gap:8px; overflow:auto; margin-top:8px; }
.thumbs img { width:64px; height:64px; object-fit:contain; border:1px solid var(--line); border-radius:8px; }
.facts { width:100%; border-collapse:collapse; margin-top:12px; }
.facts th,.facts td { padding:8px 6px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; }
.facts th { width:42%; color:var(--muted); font-weight:500; }
details { margin-top:18px; } summary { cursor:pointer; font-weight:700; }
.hint { font-size:14px; margin:6px 0 0; }
.products { display:grid; gap:10px; margin-top:16px; }
.pick { display:flex; gap:12px; align-items:flex-start; width:100%; margin:0; padding:12px; text-align:left; color:var(--ink); background:#fff; border:1px solid var(--line); font:inherit; font-weight:400; line-height:1.4; }
.pick:hover,.pick:focus-visible { border-color:var(--red); background:#fff7f7; outline:none; }
.pick img,.noimg { flex:0 0 72px; width:72px; height:72px; object-fit:contain; border-radius:8px; border:1px solid var(--line); }
.pick-text { display:block; min-width:0; } .pick-text b,.pick-text .muted,.pick-text .desc { display:block; }
.desc { font-size:14px; color:#444; margin-top:4px; }
.progress { margin:0 0 18px; padding:16px; border:1px solid var(--line); border-radius:12px; background:#fafbfc; }
.progress .phase { font-weight:650; margin-bottom:10px; overflow-wrap:anywhere; }
.progress .bar { height:12px; border-radius:999px; background:#e8ebef; overflow:hidden; }
.progress .bar i { display:block; height:100%; width:0; background:var(--red); border-radius:999px; transition:width .2s; }
.progress .bar.wait i { width:35%; animation:mcslide 1.2s ease-in-out infinite alternate; }
.progress.done .bar i { background:#2e9e5b; }
@keyframes mcslide { from { margin-left:0 } to { margin-left:65% } }
.progress .meta { margin-top:8px; color:var(--muted); font-size:14px; }
.field { position:relative; }
.suggest { position:absolute; top:calc(100% + 4px); left:0; right:0; z-index:10; background:#fff; border:1px solid var(--line); border-radius:10px; box-shadow:0 10px 28px rgba(0,0,0,.12); max-height:320px; overflow:auto; }
.suggest button { display:block; width:100%; margin:0; padding:10px 14px; border-radius:0; text-align:left; color:var(--ink); background:none; font:inherit; font-weight:400; line-height:1.35; }
.suggest button:hover,.suggest button.active { background:#fff7f7; }
.suggest button b,.suggest button span { display:block; }
.suggest .muted { padding:10px 14px; font-size:14px; }
.actions button { margin-right:8px; } .actions .secondary { margin-left:0; }
footer { color:var(--muted); font-size:12px; line-height:1.45; margin:14px 4px; }
footer p { margin:0 0 8px; }
@media (max-width:520px) { main{margin:16px auto}.card{padding:18px}.secondary{margin-left:0}.product-card{grid-template-columns:1fr} }
body.deals main { width:min(1180px,calc(100% - 28px)); }
.deals-tools { display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:0 0 12px; }
.deals-tools input { flex:1 1 220px; }
#dealsTable { margin:0 0 18px; font-size:14px; border-radius:10px; }
#dealsTable .tabulator-cell { white-space:normal; }
/* Подвал таблицы: сбрасываем общие стили страницы для button/label, иначе кнопки страниц белые на белом. */
#dealsTable .tabulator-footer label { display:inline; margin:0 6px 0 0; font-weight:500; }
#dealsTable .tabulator-footer select { padding:4px 6px; border:1px solid #cbd0d8; border-radius:6px; font:inherit; }
#dealsTable .tabulator-footer button.tabulator-page { margin:0 2px; padding:5px 10px; min-width:32px; border:1px solid #cbd0d8; border-radius:6px; background:#fff; color:var(--ink); font:500 14px/1.2 system-ui,sans-serif; }
#dealsTable .tabulator-footer button.tabulator-page:not(.active):not(:disabled):hover { border-color:var(--red); color:var(--red); background:#fff; }
#dealsTable .tabulator-footer button.tabulator-page.active { background:var(--red); border-color:var(--red); color:#fff; }
#dealsTable .tabulator-footer button.tabulator-page:disabled { opacity:.45; background:#fff; color:var(--ink); cursor:default; }
.deal-img { width:48px; height:48px; object-fit:contain; display:block; }
.deal-name b { display:block; font-weight:600; }
.deal-name small, .deal-store small { color:var(--muted); display:block; }
.deal-store a { color:#b4131a; margin-right:10px; }
.deal-off { color:#b4131a; font-weight:700; }
.deal-old { color:var(--muted); text-decoration:line-through; }
.tabs { display:flex; gap:6px; margin:4px 0 18px; border-bottom:1px solid var(--line); }
.tabs button { margin:0 0 -1px; padding:10px 14px; border:1px solid transparent; border-bottom:none; border-radius:10px 10px 0 0; background:none; color:var(--muted); font:600 15px/1.2 system-ui,sans-serif; }
.tabs button:hover { color:var(--ink); }
.tabs button[aria-selected="true"] { color:var(--red); background:#fff; border-color:var(--line); border-bottom:1px solid #fff; }
.tabs .beta { font-size:11px; font-weight:700; color:#b4131a; background:#fff0f0; border-radius:999px; padding:1px 6px; margin-left:4px; vertical-align:2px; }
body:not(.deals) .only-deals, body.deals .only-search { display:none !important; }
#shopMap { position:relative; height:min(65vh,560px); border:1px solid var(--line); border-radius:12px; margin:14px 0 4px; overflow:hidden; }
.map-popup { position:relative; max-width:240px; padding:8px 28px 8px 10px; background:#fff; border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,.18); font-size:14px; line-height:1.35; }
.map-popup::after { content:""; position:absolute; left:50%; bottom:-7px; margin-left:-7px; border:7px solid transparent; border-bottom:0; border-top-color:#fff; }
.map-popup button { position:absolute; top:4px; right:4px; margin:0; padding:2px 7px; background:none; color:var(--muted); font:700 16px/1 system-ui; }
.map-actions { display:flex; flex-wrap:wrap; gap:8px; }
.map-actions .button, .map-actions button { margin-top:12px; margin-left:0; }
.run-head { display:flex; gap:12px; align-items:flex-start; justify-content:space-between; }
.run-head h2 { flex:1 1 auto; min-width:0; overflow-wrap:anywhere; }
.run-head button { flex:0 0 auto; }
.stores-box { border:1px solid var(--line); border-radius:12px; padding:12px 14px; background:#fafbfc; }
.stores-head { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.stores-head #storesSummary { flex:1 1 200px; }
.small { margin:0; padding:9px 12px; font-size:14px; }
.stores-panel { margin-top:12px; }
.stores-panel input[type=text] { padding:10px 12px; }
.stores-actions { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.stores-actions button { margin:0; }
.stores-list { max-height:min(55vh,420px); overflow:auto; border:1px solid var(--line); border-radius:10px; background:#fff; -webkit-overflow-scrolling:touch; }
.stores-list label { display:flex; gap:12px; align-items:flex-start; margin:0; padding:11px 12px; min-height:44px; border-bottom:1px solid var(--line); font-weight:400; cursor:pointer; }
.stores-list label:last-child { border-bottom:none; }
.stores-list label:has(input:checked) { background:#fff7f7; }
.stores-list input { flex:0 0 auto; width:20px; height:20px; margin:1px 0 0; accent-color:var(--red); }
.stores-list small { display:block; color:var(--muted); }
.stores-done { margin-top:12px; }
.deal-mode { display:inline-block; margin:0 0 12px; padding:4px 10px; border-radius:999px; background:#fff0f0; color:#b4131a; font-size:13px; font-weight:700; }

/* Рекламный баннер: 50% ширины блока на компьютере, 75% на телефоне; больше своего реального размера (--ad-w) не растягивается. */
.ad { margin:5px 0 0; padding:5px 0 8px; border-top:0px solid var(--line); text-align:center; }
.ad a { display:block; }
.ad img { display:block; width:50%; max-width:min(100%, var(--ad-w, 100%)); height:auto; margin:0 auto; border-radius:12px; }
@media (max-width:700px) { .ad img { width:90%; } }

/* Пейджер над таблицей скидок (повторяет нижний). */
.deals-pager { display:flex; flex-wrap:wrap; gap:6px; align-items:center; margin:0 0 10px; font-size:14px; }
.deals-pager button { margin:0; padding:5px 10px; min-width:32px; border:1px solid #cbd0d8; border-radius:6px; background:#fff; color:var(--ink); font:500 14px/1.2 system-ui,sans-serif; }
.deals-pager button:not(:disabled):hover { border-color:var(--red); color:var(--red); }
.deals-pager button:disabled { opacity:.45; background:#fff; color:var(--ink); }
.deals-pager-info { margin:0 6px; color:var(--muted); }
.deals-pager label { display:inline; margin:0 0 0 auto; font-weight:500; }
.deals-pager select { margin-left:6px; padding:4px 6px; border:1px solid #cbd0d8; border-radius:6px; font:inherit; }

/* Карточка товара: адрес магазина и цены со скидкой. */
.store-line { margin:0 0 14px; }
.store-line a { margin-left:10px; color:#b4131a; white-space:nowrap; }
.photo-wrap { position:relative; }
.sale-badge { position:absolute; top:10px; left:10px; padding:6px 12px; border-radius:999px; background:var(--red); color:#fff; font:800 20px/1 system-ui,sans-serif; box-shadow:0 4px 12px rgba(237,28,36,.35); }
.sale-strip { margin:0 0 14px; padding:10px 14px; border-radius:10px; background:linear-gradient(90deg,#ed1c24,#ff5a3c); color:#fff; font-weight:700; }
.price-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:12px; margin:0 0 14px; }
.price-box { padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:#fafbfc; }
.price-box.sale { border-color:#ffc7c9; background:#fff5f5; }
.price-label { color:var(--muted); font-size:14px; margin-bottom:4px; }
.price-row { display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 12px; }
.price-now { font-size:30px; font-weight:800; line-height:1.1; }
.price-box.sale .price-now { color:var(--red); }
.price-old { color:var(--muted); font-size:18px; text-decoration:line-through; }
.price-off { padding:3px 9px; border-radius:8px; background:var(--red); color:#fff; font-weight:800; font-size:16px; }
.price-save { margin-top:6px; color:#2e9e5b; font-weight:700; }
.price-note, .price-none { margin-top:4px; color:var(--muted); font-size:14px; }
.price-none { font-size:18px; }

/* Цена со скидкой в списках: текущая крупнее, прежняя зачёркнута, значок −N%. */
.pr { display:inline-flex; flex-wrap:wrap; align-items:baseline; gap:2px 8px; vertical-align:baseline; }
.pr-now { font-size:1.15em; font-weight:800; }
.pr-now.sale { color:var(--red); }
.pr-old { color:var(--muted); text-decoration:line-through; font-size:.92em; }
.pr-off { padding:1px 7px; border-radius:6px; background:var(--red); color:#fff; font-weight:800; font-size:.9em; }
.pr-save { color:#2e9e5b; font-weight:700; font-size:.9em; }
.pick-text .pick-meta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin:4px 0; }
.stock-chip { padding:2px 9px; border-radius:999px; background:#eef6f0; color:#216e3f; font-size:13px; font-weight:600; }
.only-mobile { display:none; }
.deals-tools select { padding:10px 12px; border:1px solid #cbd0d8; border-radius:10px; font:inherit; background:#fff; }
.deal-card { display:flex; gap:10px; align-items:flex-start; }
.deal-card .deal-img, .deal-card .noimg { flex:0 0 64px; width:64px; height:64px; }
.deal-card-info { min-width:0; flex:1 1 auto; display:flex; flex-direction:column; gap:3px; }
.deal-card-info b { font-weight:600; overflow-wrap:anywhere; }
.deal-card-info small { color:var(--muted); }
.deal-card-info .deal-store { margin-top:4px; padding-top:6px; border-top:1px dashed var(--line); }
.deals-pager, #dealsBox { scroll-margin-top:8px; }
@media (max-width:960px) {
    .only-mobile { display:block; flex:1 1 100%; }
    #dealsTable .tabulator-header { display:none; }
    #dealsTable .tabulator-cell { padding:10px 8px; }
    #dealsTable .tabulator-footer-contents { flex-wrap:wrap; gap:6px; }
    .deals-pager label { margin-left:0; }
}

.sort-bar { display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; margin:14px 0 4px; }
.sort-bar label { margin:0; }
.sort-bar select { padding:9px 12px; border:1px solid #cbd0d8; border-radius:10px; font:inherit; background:#fff; max-width:100%; }

.deal-prices { display:flex; flex-wrap:wrap; gap:6px 18px; margin:4px 0; }
.deal-prices > div { display:flex; flex-direction:column; }
.deal-prices small { font-size:12px; }

/* Карта результатов поиска товара. */
.view-switch { display:inline-flex; gap:6px; margin-left:auto; }
.view-switch button { margin:0; }
.view-switch button[aria-pressed="true"] { background:var(--red); color:#fff; }
#resultsMap { position:relative; height:min(65vh,520px); border:1px solid var(--line); border-radius:12px; margin:8px 0 4px; overflow:hidden; }
.map-popup div + div { margin-top:2px; }
.map-popup .map-popup-links a { margin-right:12px; color:#b4131a; }
@media (max-width:520px) { #resultsMap { height:min(60vh,420px); } .view-switch { margin-left:0; } }

/* Вкладки сетей магазинов (над вкладками режимов). */
.net-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:6px 0 16px; }
.net-tabs button { margin:0; padding:10px 16px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--ink); font:700 15px/1.2 system-ui,sans-serif; }
.net-tabs button:hover:not(:disabled) { border-color:var(--red); color:var(--red); }
.net-tabs button[aria-selected="true"] { background:var(--red); border-color:var(--red); color:#fff; }
.net-tabs button:disabled { background:#f3f4f6; color:#9aa0a6; cursor:not-allowed; }
.net-tabs .soon { margin-left:6px; padding:2px 8px; border-radius:999px; background:#fff0e0; color:#b45f06; font-size:11px; font-weight:800; text-transform:uppercase; letter-spacing:.03em; vertical-align:1px; }
.net-stub { padding:28px 18px; text-align:center; border:1px dashed #cbd0d8; border-radius:12px; background:#fafbfc; }
.net-stub h2 { margin:0 0 8px; }