/**
 * ============================================================================
 * FOOTER STYLESHEET
 * ============================================================================
 *
 * Contains all footer-related styles including:
 * - Footer layout
 * - Search form
 * - Footer columns and links
 * - Footer logos
 * - Social links
 * - Dark footer
 * - Mobile icons
 *
 * ============================================================================
 */


/* ==========================================================================
   FOOTER BASE
   ========================================================================== */

.footer {
    margin-top: 30px;
}

.all-footer-info {
    /* Block-level default behavior */
}


/* ==========================================================================
   SEARCH FORM
   ========================================================================== */

.search-footer {
    display: flex;
    flex-direction: column;
}

form {
    width: 100%;
}


/* Search Wrap
   -------------------------------------------------------------------------- */

.search-wrap {
    display: flex;
    gap: 20px;
}

.search-wrap input {
    border: 1px solid #333333;
    min-height: 56px;
    padding-left: 10px;
    box-sizing: border-box;
    width: calc(100% - 130px);
    border-radius: 4px;
    font-family: var(--font-serif);
}

.search-wrap .search-btn {
    width: 130px;
    height: 56px;
    display: flex;
    color: #fff;
    font-size: 15px;
    padding-left: 45px;
    box-sizing: border-box;
    position: relative;
    border: none;
    background: #0083B7;
    cursor: pointer;
    align-items: center;
    border-radius: 4px;
    font-weight: 700;
}

.search-wrap .search-btn::before {
    position: absolute;
    content: "";
    left: 22px;
    top: 20px;
    width: 15px;
    height: 15px;
    background: url(../img/search_icon.svg) no-repeat center;
    background-size: 100%;
}
.is-mobile-search {
    display:none;
}


/* ==========================================================================
   FOOTER COLUMNS
   ========================================================================== */

.footer-colums {
    display: flex;
    margin-top: 30px;
    flex-wrap: wrap;
    gap: 20px;
}

.footer-colum {
    width: calc(16% - 8px);
}


/* Footer Title
   -------------------------------------------------------------------------- */

.footer-title {
    font-size: 18px;
    color: #000;
    margin-bottom: 10px;
}

.footer-title.is-icon {
    width: auto;
    padding-right: 20px;
    box-sizing: border-box;
    position: relative;
    display: inline-block;
}

.footer-title.is-icon::after {
    position: absolute;
    content: "";
    right: -2px;
    top: 2px;
    width: 15px;
    height: 15px;
    background: url("../img/arrow-diagonal-grey.svg") no-repeat center;
    background-size: 100%;
}


/* Footer Links
   -------------------------------------------------------------------------- */

.footer-link {
    display: block;
    color: #000;
    font-size: 15px;
    margin: 4px 0;
}


/* ==========================================================================
   FOOTER LOGOS
   ========================================================================== */

.footer-logos {
    width: 100%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 21px;
    background: #EDF7FB;
    padding: 20px 200px;
    box-sizing: border-box;
    margin-top: 30px;
}


/* ==========================================================================
   SOCIAL FOOTER
   ========================================================================== */

.social-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 30px 0;
}

.right-social-wrap {
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: center;
}


/* Social Wrap
   -------------------------------------------------------------------------- */

.soc-wrap {
    display: flex;
    gap: 15px;
    align-items: center;
}

.soc-icon {
    width: 40px;
    height: 40px;
    border: 1px solid #ccc;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* ==========================================================================
   BOTTOM LINKS
   ========================================================================== */

.links-bottom {
    padding: 15px 0;
    box-sizing: border-box;
    border-top: 1px solid #E8E8E8;
    display: flex;
    gap: 20px;
}

.l-bottom {
    font-size: 15px;
    color: #000;
    font-weight: 500;
}


/* ==========================================================================
   DARK FOOTER
   ========================================================================== */

.dark-footer {
    background: #041932;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 20px 0;
    box-sizing: border-box;
    display: flex;
    justify-content: space-between;
}

.dark-footer span {
    color: #fff;
    font-size: 12px;
}


/* Site Info
   -------------------------------------------------------------------------- */

.site-info {
    display: flex;
    justify-content: space-between;
}


/* ==========================================================================
   MOBILE ICONS
   ========================================================================== */

.mobile-icons-wrap {
    display: none;
}