/* ============================================================
   Rondo custom fixes — see site-updates.md
   Plain CSS loaded via Magento_Theme/layout/default_head_blocks.xml
   ============================================================ */

/* #1 — Category product grid.
   Porto lays the grid out with floats + `clear:left` on every 4th tile.
   When product tiles have unequal heights (longer names, optional price
   rows, etc.) the following tile "catches" on a taller neighbour and the
   4-per-row grid breaks / tiles jump around.
   Switching the tile list to a wrapping flexbox makes each row independent
   and equal-height, so it always lays out cleanly N-per-row. Porto's own
   responsive column widths (25% desktop, 50%/33% on smaller screens) are
   left untouched — this only changes how the items flow.
   NB: on Magento 2.4.8 the real breakage was that Porto's `width: 100%/4`
   grid rules stopped compiling (less.php v5 defaults to parens-division);
   the actual fix lives in Ydt/LessCompat (forces Less math=always). This
   flex-wrap rule stays as a belt-and-braces guard against uneven tiles. */
.products-grid .product-items {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
}
.products-grid .product-items > .product-item {
    clear: none !important;
}

/* #7 — ДОСТАВКА / АКЦИИ / БРЕНДИРОВАНИЕ moved off the first home banner into the
   SECOND menu block (header type 18), each as its own top-level column. Rendered
   from the CMS block `porto_secondary_menu_header_18`, so no extra CSS is needed —
   the items reuse the standard sw-megamenu styling. */

/* #3 — Footer social icons (Telegram / Instagram / Youtube) in the `.follow-us` widget.
   Porto draws each icon as a :before glyph coloured by the link's text colour, but its
   winning default rule `.share-links a:not(:hover){background:none;color:#fff}` paints a
   WHITE glyph on the light footer — so the icon is invisible until you hover (which is
   when the brand background gets added). Fix: show the filled brand-coloured circle with
   a white glyph at ALL times, so the icons are visible without hovering.
   Scoped to `.page-footer .follow-us` so product-page share buttons are untouched. */
.page-footer .follow-us .share-links a,
.page-footer .follow-us .share-links a:not(:hover) {
    color: #fff;
    border-color: transparent;
    opacity: 1;
}
.page-footer .follow-us .share-links a.share-telegram,
.page-footer .follow-us .share-links a.share-telegram:not(:hover) { background: #0088cc; }
.page-footer .follow-us .share-links a.share-instagram,
.page-footer .follow-us .share-links a.share-instagram:not(:hover) {
    background: radial-gradient(circle at 30% 107%, #fdf497 0%, #fd5949 45%, #d6249f 60%, #285AEB 90%);
}
.page-footer .follow-us .share-links a.share-youtube,
.page-footer .follow-us .share-links a.share-youtube:not(:hover) { background: #c3191e; }
/* slight lift on hover instead of the icon appearing/disappearing */
.page-footer .follow-us .share-links a:hover { opacity: 0.85; }

/* #6 — Category "Категории" side-megamenu: switched the Smartwave Megamenu type from
   fullwidth (mega grid, deeper levels inline) to CLASSIC via config
   `sw_megamenu/general/menu_type` (see scratchpad_migrate.php item #6). Classic mode
   natively lists each level vertically and cascades levels 2/3/4… out as new columns,
   so no custom CSS is needed here. */

/* #1b — Category / search filter sidebar (subcategory list + price filter).
   Porto's desktop 2-column layout (sidebar 25% left, main 75%) lives in
   `_layout.less` inside a `.media-width('min', @screen__l)` block, but Magento's
   frontend responsive framework never invokes `min @screen__l` (992px) — only
   768 / max-991 / 1200 — so that block is dead code and never compiles. Porto only
   ships an explicit desktop width for the `.layout-fullwidth` variant (see the
   generated media/porto/web/css/custom.css), and this store renders category pages
   as `layout-1220`, which therefore gets NO sidebar width: the `.sidebar-main` falls
   back to flex-basis:100% and stacks full-width below the products, so the filters
   vanish on desktop. `.columns` is a flexbox (@use-flex), and in the DOM `.column.main`
   comes before `.sidebar-main`, so we restore the two columns with explicit flex
   sizing + `order` (sidebar first). Scoped to catalog category + search 2-col-left
   pages so account/other 2-column pages (Porto styles those separately) are untouched.
   The mobile off-canvas drawer (<992, opened by the `.sidebar-toggle` which is
   d-lg-none) is left alone. */
@media (min-width: 992px) {
    .catalog-category-view.page-layout-2columns-left .columns,
    .catalogsearch-result-index.page-layout-2columns-left .columns {
        display: flex;
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .catalog-category-view.page-layout-2columns-left .columns .sidebar-main,
    .catalogsearch-result-index.page-layout-2columns-left .columns .sidebar-main {
        order: 0;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 22%;
        flex: 0 0 22%;
        max-width: 22%;
        width: 22%;
    }
    .catalog-category-view.page-layout-2columns-left .columns .column.main,
    .catalogsearch-result-index.page-layout-2columns-left .columns .column.main {
        order: 1;
        -webkit-box-flex: 0;
        -ms-flex: 0 0 78%;
        flex: 0 0 78%;
        max-width: 78%;
        width: 78%;
    }
}

/* ============================================================
   BATCH 2 (client fix list Aug 2026) — see site-updates-batch2.md
   ============================================================ */

/* #2b — center catalog pagination numbers (was floated right) */
.toolbar-products .pages {
    float: none;
    width: 100%;
    text-align: center;
}
.toolbar-products .pages .items.pages-items {
    display: inline-flex;
    float: none;
}

/* #16 — hide the "pencil" edit action on cart line items */
.cart.table-wrapper .action-edit,
.cart.table-wrapper .item-actions .action-edit {
    display: none;
}

/* #18 — cart summary: hide the "Резюме" title, keep only the checkout button */
.cart-summary .summary.title {
    display: none;
}

/* batch-3 #9 — contact page: left-align the contact info / requisites */
.contact-index-index .contact-info,
.contact-index-index .contact-info p,
.contact-index-index .contacts-title {
    text-align: left;
}

/* T6 — legal-entity requisites on the р/с (banktransfer) payment method:
   give the fieldset a little room and set off the "Договор подписывается в лице:"
   sub-heading from the fields above it. */
.rondo-requisites {
    margin-top: 15px;
}
.rondo-requisites .rondo-requisites-subtitle {
    margin: 18px 0 10px;
    font-weight: 600;
}
