/* Hitdeal.ru Bootstrap 5.3.x compatibility layer
   Keeps the old Bootstrap 3 grid geometry while markup uses Bootstrap 5 breakpoints. */

.container {
    --bs-gutter-x: 20px; /* Bootstrap 3 site override: 10px left/right padding */
}

.container-fluid {
    --bs-gutter-x: 30px; /* Bootstrap 3 default: 15px left/right padding */
}

.row {
    --bs-gutter-x: 30px;
}

/* Bootstrap 3 had no 576px container breakpoint. */
@media (min-width: 576px) and (max-width: 767.98px) {
    .container {
        max-width: none;
    }
}

@media (min-width: 768px) {
    .container {
        max-width: 750px;
    }
}

@media (min-width: 992px) {
    .container {
        max-width: 970px;
    }
}

@media (min-width: 1200px) {
    .container {
        max-width: 1270px;
    }
}

@media (min-width: 1400px) {
    .container {
        max-width: 1270px;
    }
}

/* Preserve Hitdeal's custom Bootstrap 3 desktop grid.
   The old bootstrap.css intentionally changed lg widths:
   col-lg-4 = 25%, col-lg-8 = 75%, col-lg-9 = 72%.
   During migration old lg classes became xl classes, so reproduce those values here. */
@media (min-width: 1200px) {
    .col-xl-4 {
        flex: 0 0 auto;
        width: 25%;
    }

    .col-xl-8 {
        flex: 0 0 auto;
        width: 75%;
    }

    .col-xl-9 {
        flex: 0 0 auto;
        width: 72%;
    }
}

/* ===== Bootstrap 3 typography compatibility ===== */

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
}

button,
input,
select,
textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

p {
    margin: 0 0 10px;
}
