/* Stage 2: magic_pool_dev inner pages, existing component markup and state hooks.
   Match magic_pool_dev: Arial, navy #102a50, 2px buttons, 4px cards.
   All rules are scoped; no checkout, account or home restyling. */
.mp-dev .mp-stage2 {
    --mp-ink: #16263b;
    --mp-blue: #102a50;
    --mp-muted: #67717b;
    --mp-line: #e5e8ea;
    color: var(--mp-ink);
    font: 16px/1.5 Arial, Helvetica, sans-serif;
    padding-bottom: 48px;
}
.mp-dev .mp-stage2 .white { background: #fff; }
.mp-dev .mp-stage2 :is(h1, h2, h3, h4, .btn, input, select, textarea) { font-family: Arial, Helvetica, sans-serif; }
.mp-dev .mp-stage2 h1 { font-size: clamp(26px, 3vw, 40px); line-height: 1.18; font-weight: 600; margin: 0 0 24px; }
.mp-dev .mp-stage2 h2 { font-size: clamp(21px, 2.3vw, 28px); line-height: 1.3; margin: 28px 0 16px; }
.mp-dev .mp-stage2 h3 { font-size: 20px; line-height: 1.4; }
.mp-dev .mp-stage2 .page-header { border: 0; margin: 20px 0 28px; padding-bottom: 0; }
.mp-dev .mp-stage2 p { line-height: 1.65; }
.mp-dev .mp-stage2 :is(a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid #b28640;
    outline-offset: 3px;
}
.mp-dev .mp-stage2 .bx-breadcrumb { display: flex; flex-wrap: wrap; gap: 6px 0; margin: 24px 0; height: auto; }
.mp-dev .mp-stage2 .bx-breadcrumb-item { float: none; white-space: normal; font: 13px/1.5 Arial, Helvetica, sans-serif; color: var(--mp-muted); }
.mp-dev .mp-stage2 .bx-breadcrumb-item a { color: var(--mp-muted); }
.mp-dev .mp-stage2 .bx-breadcrumb-item a:hover { color: var(--mp-blue); text-decoration: underline; }
.mp-dev .mp-stage2 .btn {
    border-radius: 2px; padding: 10px 16px; font-size: 14px; line-height: 1.4;
    white-space: normal; text-shadow: none; box-shadow: none;
    transition: background-color .2s, border-color .2s;
}
.mp-dev .mp-stage2 :is(.btn-danger, .btn-primary, .bx_ordercart_order_pay_center .checkout) {
    background: var(--mp-blue); border: 1px solid var(--mp-blue); color: #fff;
    text-shadow: none; border-radius: 2px;
}
.mp-dev .mp-stage2 :is(.btn-danger, .btn-primary, .bx_ordercart_order_pay_center .checkout):hover { background: #1c3a5c; border-color: #1c3a5c; }
.mp-dev .mp-stage2 :is(.btn-default, .btn-info) { background: #fff; border: 1px solid #bacbdc; color: #1c3a5c; }
.mp-dev .mp-stage2 :is(.btn-default, .btn-info):hover { background: #f1f5f8; border-color: #8ca5be; }
.mp-dev .mp-stage2 :is(button:disabled, .btn.disabled, .btn:disabled) { opacity: .55; cursor: not-allowed; }
.mp-dev .mp-stage2 :is(input[type="text"], input[type="number"], input[type="email"], input[type="tel"], input[type="search"], select, textarea) {
    max-width: 100%; border: 1px solid #bacbdc; border-radius: 3px;
    background-color: #fff; color: var(--mp-ink); padding: 8px 10px; font-size: 16px;
}
.mp-dev .mp-stage2 input[type="checkbox"], .mp-dev .mp-stage2 input[type="radio"] { accent-color: var(--mp-blue); }
.mp-dev .mp-stage2 .table { color: var(--mp-ink); font-size: 14px; }
.mp-dev .mp-stage2 .table > :is(tbody, thead) > tr > :is(td, th) { padding: 14px 12px; border-color: var(--mp-line); vertical-align: top; }
.mp-dev .mp-stage2 .table-striped > tbody > tr:nth-of-type(odd) { background: #f6f8fa; }
.mp-dev .mp-stage2 .table-responsive { border-color: var(--mp-line); border-radius: 4px; }
.mp-dev .mp-stage2 .modern-page-navigation { display: flex; flex-wrap: wrap; gap: 6px; margin: 24px 0; }
.mp-dev .mp-stage2 .modern-page-navigation :is(a, .modern-page-current) {
    display: inline-flex; align-items: center; justify-content: center; min-width: 40px; min-height: 40px;
    padding: 8px 12px; border: 1px solid var(--mp-line); border-radius: 3px; background: #fff; color: var(--mp-blue);
}
.mp-dev .mp-stage2 .modern-page-navigation .modern-page-current { background: var(--mp-blue); color: #fff; }
.mp-dev .mp-stage2 .modern-page-navigation a:hover { background: #f1f5f8; }
/* Categories and the currently configured horizontal filter. */
.mp-dev .mp-stage2 :is(.bx_catalog_line, .bx_catalog_tile, .bx_catalog_text) { margin-bottom: 28px; }
.mp-dev .mp-stage2 :is(.bx_catalog_line_title, .bx_catalog_tile_title, .bx_sitemap_li_title) { font: 600 16px/1.45 Arial, Helvetica, sans-serif; margin: 12px 0; }
.mp-dev .mp-stage2 .bx_catalog_line > ul > li { padding: 18px; border: 1px solid var(--mp-line); border-radius: 4px; margin-bottom: 12px; }
.mp-dev .mp-stage2 .bx-filter { background: #f6f8fa; border: 1px solid var(--mp-line); border-radius: 4px; padding: 16px; margin-bottom: 24px; }
.mp-dev .mp-stage2 .bx-filter .bx-filter-parameters-box-title { font: 600 14px/1.5 Arial, Helvetica, sans-serif; color: var(--mp-ink); }
.mp-dev .mp-stage2 .sort_catalog { margin-bottom: 20px; line-height: 2; }
.mp-dev .mp-stage2 .bx_sitemap { margin: 0 0 28px; }
.mp-dev .mp-stage2 .bx_sitemap > ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 14px; padding: 0; margin: 0; list-style: none; }
.mp-dev .mp-stage2 .bx_sitemap > ul > li { float: none; width: auto; margin: 0; padding: 18px; border: 1px solid var(--mp-line); border-radius: 4px; background: #f6f8fa; }
.mp-dev .mp-stage2 .bx_sitemap li a:hover { color: var(--mp-blue); text-decoration: underline; }
.mp-dev .mp-stage2 .bx-filter input[type="text"] { min-height: 32px; padding: 4px; }
.mp-dev .mp-stage2 .pagination { display: flex; gap: 6px; justify-content: flex-end; list-style: none; margin: 24px 0; padding: 0; }
.mp-dev .mp-stage2 .pagination a { display: block; padding: 8px 12px; border: 1px solid var(--mp-line); border-radius: 3px; }
.mp-dev .mp-stage2 .pagination .active a { color: #fff; background: var(--mp-blue); }
.mp-dev .mp-stage2 .bx-section-desc-post a, .mp-dev .mp-stage2 .more_content a { color: var(--mp-blue); text-decoration: underline; }
/* Product grid: keep IDs, buy/quantity controls, SKU and AJAX nodes in place. */
.mp-dev .mp-stage2 .bx_catalog_list_home { display: flex; flex-wrap: wrap; gap: 18px; margin: 0 0 28px; border: 0; }
.mp-dev .mp-stage2 .bx_catalog_list_home::after { content: none; }
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item {
    float: none; clear: none; width: calc((100% - 54px) / 4); height: auto !important;
    margin: 0; padding: 16px; border: 1px solid var(--mp-line); border-radius: 4px;
    background: #fff; min-width: 0; transition: box-shadow .2s;
}
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item:hover { box-shadow: 0 8px 26px #15284010 !important; transform: translateY(-2px); }
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item .bx_catalog_item_container {
    margin: 0; padding: 0; min-height: 0; width: auto; box-shadow: none; animation: none; transform: none;
}
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item .bx_catalog_item_title {
    height: auto !important; min-height: 66px; overflow: visible !important; white-space: normal;
    font: 400 14px/1.55 Arial, Helvetica, sans-serif; padding-top: 14px; margin-bottom: 16px;
}
.mp-dev .mp-stage2 .bx_catalog_item_title a { color: var(--mp-ink); display: block; -webkit-line-clamp: unset; overflow: visible; }
.mp-dev .mp-stage2 .bx_catalog_item .cena { height: auto; min-height: 60px; }
.mp-dev .mp-stage2 .bx_catalog_item .cena .nalichie_y_d { display: inline-block; font-size: 12px; line-height: 1.4; margin: 6px 0; color: #30834e; background: #f0f8f2; padding: 3px 8px; border-radius: 3px; }
.mp-dev .mp-stage2 .bx_catalog_item_title a:hover { text-decoration: underline; }
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item_images { border-radius: 3px; background-color: #f6f7f7; background-size: contain; }
.mp-dev .mp-stage2 .bx_catalog_list_home .bx_price { font: 600 20px/1.4 Arial, Helvetica, sans-serif; color: var(--mp-ink); }
.mp-dev .mp-stage2 .bx_catalog_item_articul { font: 12px/1.5 Arial, Helvetica, sans-serif; overflow-wrap: anywhere; }
.mp-dev .mp-stage2 .plitki_more { margin-top: 16px; border-color: var(--mp-line); }
.mp-dev .mp-stage2 .plitki_more .btn { padding: 8px 4px; font-size: 12px; }
.mp-dev .mp-stage2 .plitki_more .btn.active { color: var(--mp-blue); background: #eaf0f6; }
.mp-dev .mp-stage2 .bx_catalog_item_controls { opacity: 1; }
/* Detail: preserve gallery sizing and tab visibility managed by existing JS. */
.mp-dev .mp-stage2 .bx_item_detail .bx_item_title { margin-bottom: 28px; }
.mp-dev .mp-stage2 .bx_item_detail .bx_item_slider { border: 1px solid var(--mp-line); border-radius: 4px; background: #f6f7f7; }
.mp-dev .mp-stage2 .bx_item_detail .cena_kol_fav { padding: 20px; border: 1px solid var(--mp-line); border-radius: 4px; background: #f6f8fa; }
.mp-dev .mp-stage2 .bx_item_detail .item_current_price { color: var(--mp-ink); font: 600 28px/1.3 Arial, Helvetica, sans-serif; }
.mp-dev .mp-stage2 .bx_item_detail .articul { color: var(--mp-muted); font-size: 13px; }
.mp-dev .mp-stage2 .bx_item_detail .nav-tabs { display: flex; flex-wrap: wrap; gap: 6px; border-color: var(--mp-line); margin-top: 32px; }
.mp-dev .mp-stage2 .bx_item_detail .nav-tabs > li { float: none; }
.mp-dev .mp-stage2 .bx_item_detail .nav-tabs > li > a { padding: 12px 16px; color: var(--mp-blue); border-radius: 3px 3px 0 0; }
.mp-dev .mp-stage2 .bx_item_detail .nav-tabs > li.active > a { background: #f1f5f8; border-color: var(--mp-line); color: var(--mp-ink); }
.mp-dev .mp-stage2 .bx_item_detail .more_content { padding: 24px 0; line-height: 1.65; }
.mp-dev .mp-stage2 .bx_item_detail .item_buttons_counter_block .btn-default { background: var(--mp-blue); border-color: var(--mp-blue); color: #fff; }
.mp-dev .mp-stage2 .bx_item_detail .more_links .btn-primary { color: var(--mp-blue); background: #fff; border-color: #bacbdc; border-radius: 2px; }
.mp-dev .mp-stage2 .bx_item_detail .more_links .btn-primary:hover { background: #f1f5f8; }
/* Basket: original totals, coupons and action handlers remain untouched. */
.mp-dev .mp-stage2 .bx_ordercart { font: 14px/1.5 Arial, Helvetica, sans-serif; }
.mp-dev .mp-stage2 .bx_ordercart .bx_sort_container { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.mp-dev .mp-stage2 .bx_ordercart .bx_sort_container a { margin: 0; padding: 10px 14px; height: auto; border: 1px solid var(--mp-line); border-radius: 3px; color: var(--mp-blue); background: #fff; }
.mp-dev .mp-stage2 .bx_ordercart .bx_sort_container a.current { color: #fff; background: var(--mp-blue); }
.mp-dev .mp-stage2 .bx_ordercart_order_table_container { border: 1px solid var(--mp-line); border-radius: 4px; }
.mp-dev .mp-stage2 .bx_ordercart_order_table_container > table > thead > tr > td { background: #f6f8fa; color: var(--mp-muted); font-size: 13px; }
.mp-dev .mp-stage2 .bx_ordercart_itemtitle a { font: 600 15px/1.5 Arial, Helvetica, sans-serif; color: var(--mp-ink); }
.mp-dev .mp-stage2 .bx_ordercart_order_pay { margin-top: 24px; padding: 20px; background: #f6f8fa; border: 1px solid var(--mp-line); border-radius: 4px; }
.mp-dev .mp-stage2 .bx_ordercart_order_sum { font-size: 16px; }
.mp-dev .mp-stage2 .bx_ordercart_order_sum .fwb { font-size: 22px; }
.mp-dev .mp-stage2 .bx_ordercart_coupon input { margin-bottom: 8px; }
/* Contacts use the existing page table and map/consent output. */
.mp-dev .mp-stage2-contacts .table { table-layout: fixed; width: 100%; }
.mp-dev .mp-stage2-contacts .table > tbody > tr > th { width: 27%; }
.mp-dev .mp-stage2-contacts td { overflow-wrap: anywhere; }
.mp-dev .mp-stage2-contacts td table { width: 100%; font-size: 13px; }
.mp-dev .mp-stage2-contacts td table td { padding: 8px 4px; vertical-align: top; }
.mp-dev .mp-stage2-contacts .mpp-map-placeholder { border: 1px solid var(--mp-line); border-radius: 4px; padding: 24px; background: #f6f8fa; }
.mp-dev .mp-stage2 table.fav { border: 1px solid var(--mp-line); }
.mp-dev .mp-stage2 table.fav .price { font: 600 18px/1.4 Arial, Helvetica, sans-serif; color: var(--mp-ink); }
@media (max-width: 1199px) {
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item { width: calc((100% - 36px) / 3); }
    .mp-dev .mp-stage2 .bx_item_detail .cena_kol_fav { padding: 12px; }
}
@media (max-width: 991px) {
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item { width: calc((100% - 18px) / 2); }
    .mp-dev .mp-stage2 .bx_item_detail .bx_item_container > [class*="col-md-"] { margin-bottom: 24px; }
    .mp-dev .mp-stage2-contacts .col-md-7 { margin-top: 24px; }
}
@media (max-width: 767px) {
    .mp-dev .mp-stage2 { font-size: 15px; padding-bottom: 28px; }
    .mp-dev .mp-stage2 .page-header { margin: 16px 0 20px; }
    .mp-dev .mp-stage2 .bx-breadcrumb { margin: 16px 0; }
    /* The old horizontal template hides its only filter on phones. */
    .mp-dev .mp-stage2 .col-xs-12.hidden-xs:has(> .bx-filter) { display: block !important; }
    .mp-dev .mp-stage2 .bx_catalog_list_home { gap: 12px; }
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item { width: calc((100% - 12px) / 2) !important; margin: 0 !important; padding: 12px; }
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item .bx_catalog_item_title { min-height: 0; }
    .mp-dev .mp-stage2 .bx_catalog_item .btn { padding: 10px 6px; }
    .mp-dev .mp-stage2 .bx_item_detail .nav-tabs > li > a { padding: 10px; font-size: 14px; }
    .mp-dev .mp-stage2 .bx_ordercart_order_pay { padding: 12px; }
    .mp-dev .mp-stage2 .bx_ordercart_order_pay_left,
    .mp-dev .mp-stage2 .bx_ordercart_order_pay_right { float: none; width: 100%; margin-bottom: 20px; }
    .mp-dev .mp-stage2 .bx_ordercart_order_table_container { overflow-x: auto; }
    .mp-dev .mp-stage2 .modern-page-navigation { gap: 4px; }
    .mp-dev .mp-stage2-contacts .table > tbody > tr > :is(td, th) { padding: 10px 6px; }
    .mp-dev .mp-stage2-contacts td table tr,
    .mp-dev .mp-stage2-contacts td table td { display: block; width: 100%; }
}
@media (max-width: 540px) {
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item { width: 100% !important; padding: 16px; }
    .mp-dev .mp-stage2 .bx_item_detail .more_links .btn { font-size: 11px; padding: 10px 4px; }
}
@media (prefers-reduced-motion: reduce) {
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item,
    .mp-dev .mp-stage2 .btn { transition: none !important; }
    .mp-dev .mp-stage2 .bx_catalog_list_home .bx_catalog_item:hover { transform: none; }
}
