
/*
 * Tink's Consolidated Lower Footer
 * Version 0.0.4
 *
 * Replaces the previous lower-footer redesign.
 * The original silver/grey benefits strip is suppressed and its four messages
 * are re-presented as a compact reassurance row inside the charcoal footer.
 */

html.tinks-lower-footer-v1 .tlf-modern-footer {
    background:#303234;
    color:#f4f5f6;
    border-top:1px solid rgba(255,255,255,.06);
    box-sizing:border-box;
}

/* ------------------------------------------------------------
   Compact reassurance row
   ------------------------------------------------------------ */

html.tinks-lower-footer-v1 .tlf-benefits {
    width:min(100% - 56px,1500px);
    margin:0 auto;
    padding:24px 0 20px;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:0;
    box-sizing:border-box;
}

html.tinks-lower-footer-v1 .tlf-benefit {
    position:relative;
    min-width:0;
    display:grid;
    grid-template-columns:42px minmax(0,1fr);
    gap:13px;
    align-items:start;
    padding:0 26px;
    box-sizing:border-box;
}

html.tinks-lower-footer-v1 .tlf-benefit:first-child {
    padding-left:0;
}

html.tinks-lower-footer-v1 .tlf-benefit:last-child {
    padding-right:0;
}

html.tinks-lower-footer-v1 .tlf-benefit + .tlf-benefit {
    border-left:1px solid rgba(255,255,255,.12);
}

html.tinks-lower-footer-v1 .tlf-benefit-icon {
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-size:32px;
    line-height:1;
    flex:none;
}

html.tinks-lower-footer-v1 .tlf-benefit-icon .tb_icon,
html.tinks-lower-footer-v1 .tlf-benefit-icon span {
    width:auto !important;
    height:auto !important;
    line-height:1 !important;
    margin:0 !important;
    color:#fff !important;
    font-size:32px !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-title {
    margin:1px 0 4px !important;
    color:#fff !important;
    font-family:"Titillium Web",Arial,sans-serif !important;
    font-size:16px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-copy {
    margin:0 !important;
    color:#c9ced3 !important;
    font-size:13px !important;
    line-height:1.45 !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-link {
    color:inherit !important;
    text-decoration:none !important;
}

/* v0.0.4: linked reassurance items must remain grid items.
   The old display:block caused Quality and Back It Up to drop out of alignment. */
html.tinks-lower-footer-v1 .tlf-benefit.tlf-benefit-link {
    display:grid !important;
    grid-template-columns:42px minmax(0,1fr) !important;
    gap:13px !important;
    align-items:start !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-link:hover .tlf-benefit-title,
html.tinks-lower-footer-v1 .tlf-benefit-link:focus-visible .tlf-benefit-title {
    color:#8bd000 !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-link:hover .tlf-benefit-copy,
html.tinks-lower-footer-v1 .tlf-benefit-link:focus-visible .tlf-benefit-copy {
    color:#fff !important;
}

html.tinks-lower-footer-v1 .tlf-benefit-link:hover .tlf-benefit-icon,
html.tinks-lower-footer-v1 .tlf-benefit-link:focus-visible .tlf-benefit-icon {
    color:#8bd000;
}

/* ------------------------------------------------------------
   Divider between reassurance row and lower utility row
   ------------------------------------------------------------ */

html.tinks-lower-footer-v1 .tlf-benefit-rule {
    width:min(100% - 56px,1500px);
    height:1px;
    margin:0 auto;
    background:rgba(255,255,255,.10);
}

/* ------------------------------------------------------------
   Main lower utility row
   ------------------------------------------------------------ */

html.tinks-lower-footer-v1 .tlf-modern-inner {
    width:min(100% - 56px,1500px);
    margin:0 auto;
    padding:26px 0 22px;
    display:grid;
    grid-template-columns:minmax(370px,1.05fr) minmax(250px,.58fr) minmax(470px,1.25fr);
    gap:40px;
    align-items:center;
    box-sizing:border-box;
}

html.tinks-lower-footer-v1 .tlf-links {
    display:grid;
    grid-template-columns:repeat(2,minmax(150px,1fr));
    gap:30px;
    align-self:start;
}

html.tinks-lower-footer-v1 .tlf-link-group {
    min-width:0;
}

html.tinks-lower-footer-v1 .tlf-link-title,
html.tinks-lower-footer-v1 .tlf-section-title {
    margin:0 0 10px !important;
    font-family:"Titillium Web",Arial,sans-serif !important;
    font-size:18px !important;
    line-height:1.2 !important;
    font-weight:700 !important;
    color:#fff !important;
}

html.tinks-lower-footer-v1 .tlf-link-group ul,
html.tinks-lower-footer-v1 .tlf-link-group li {
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
}

html.tinks-lower-footer-v1 .tlf-link-group li + li {
    margin-top:6px !important;
}

html.tinks-lower-footer-v1 .tlf-link-group a {
    position:relative;
    display:inline-flex !important;
    align-items:center;
    min-height:20px;
    padding:0 0 0 13px !important;
    color:#d7dadd !important;
    text-decoration:none !important;
    font-size:14px !important;
    line-height:1.35 !important;
    transition:color .16s ease,transform .16s ease;
}

html.tinks-lower-footer-v1 .tlf-link-group a::before {
    content:"›";
    position:absolute;
    left:0;
    top:-1px;
    color:#8bd000;
    font-size:17px;
    line-height:1;
}

html.tinks-lower-footer-v1 .tlf-link-group a:hover,
html.tinks-lower-footer-v1 .tlf-link-group a:focus-visible {
    color:#fff !important;
    transform:translateX(2px);
}

/* Ownership */

html.tinks-lower-footer-v1 .tlf-owner {
    text-align:center;
    min-width:0;
}

html.tinks-lower-footer-v1 .tlf-owner-label {
    margin-bottom:6px;
    color:#aeb4ba;
    font-size:11px;
    font-weight:700;
    letter-spacing:1.2px;
    text-transform:uppercase;
}

html.tinks-lower-footer-v1 .tlf-owner img {
    display:block !important;
    width:245px !important;
    max-width:100% !important;
    height:auto !important;
    margin:0 auto !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
}

/* Payment options */

html.tinks-lower-footer-v1 .tlf-payments {
    min-width:0;
    justify-self:stretch;
}

html.tinks-lower-footer-v1 .tlf-payment-frame {
    background:rgba(255,255,255,.04);
    border:1px solid rgba(255,255,255,.09);
    border-radius:12px;
    padding:12px 15px;
    box-sizing:border-box;
}

html.tinks-lower-footer-v1 .tlf-payments img {
    display:block !important;
    width:100% !important;
    max-width:760px !important;
    height:auto !important;
    margin:0 !important;
}

/* Copyright */

html.tinks-lower-footer-v1 .tlf-rule {
    width:min(100% - 56px,1500px);
    height:1px;
    margin:0 auto;
    background:rgba(255,255,255,.08);
}

html.tinks-lower-footer-v1 .tlf-meta {
    width:min(100% - 56px,1500px);
    margin:0 auto;
    padding:12px 0 15px;
    color:#949ba2;
    font-size:12px;
    line-height:1.4;
    box-sizing:border-box;
}

/* ------------------------------------------------------------
   Suppress source rows once the JS has harvested their content
   ------------------------------------------------------------ */

html.tinks-lower-footer-v1 #footer .row_lUcRM,
html.tinks-lower-footer-v1 #footer .row_VMNhMr,
html.tinks-lower-footer-v1 #footer .row_ZrKq3,
html.tinks-lower-footer-v1 #bottom.tlf-source-empty {
    display:none !important;
}

/* ------------------------------------------------------------
   Responsive
   ------------------------------------------------------------ */

@media (max-width:1150px) {
    html.tinks-lower-footer-v1 .tlf-benefits {
        grid-template-columns:repeat(2,minmax(0,1fr));
        row-gap:22px;
    }

    html.tinks-lower-footer-v1 .tlf-benefit:nth-child(3) {
        border-left:0;
        padding-left:0;
    }

    html.tinks-lower-footer-v1 .tlf-modern-inner {
        grid-template-columns:1fr 240px;
    }

    html.tinks-lower-footer-v1 .tlf-payments {
        grid-column:1 / -1;
    }
}

@media (max-width:700px) {
    html.tinks-lower-footer-v1 .tlf-benefits,
    html.tinks-lower-footer-v1 .tlf-benefit-rule,
    html.tinks-lower-footer-v1 .tlf-modern-inner,
    html.tinks-lower-footer-v1 .tlf-rule,
    html.tinks-lower-footer-v1 .tlf-meta {
        width:min(100% - 32px,1500px);
    }

    html.tinks-lower-footer-v1 .tlf-benefits {
        padding:22px 0 18px;
        grid-template-columns:1fr;
        row-gap:0;
    }

    html.tinks-lower-footer-v1 .tlf-benefit,
    html.tinks-lower-footer-v1 .tlf-benefit:first-child,
    html.tinks-lower-footer-v1 .tlf-benefit:last-child,
    html.tinks-lower-footer-v1 .tlf-benefit:nth-child(3) {
        padding:15px 0;
        border-left:0;
    }

    html.tinks-lower-footer-v1 .tlf-benefit + .tlf-benefit {
        border-left:0;
        border-top:1px solid rgba(255,255,255,.10);
    }

    html.tinks-lower-footer-v1 .tlf-modern-inner {
        padding:24px 0 20px;
        grid-template-columns:1fr;
        gap:26px;
    }

    html.tinks-lower-footer-v1 .tlf-links {
        grid-template-columns:1fr 1fr;
        gap:24px;
    }

    html.tinks-lower-footer-v1 .tlf-owner {
        text-align:left;
    }

    html.tinks-lower-footer-v1 .tlf-owner img {
        width:200px !important;
        margin:0 !important;
    }

    html.tinks-lower-footer-v1 .tlf-payments {
        grid-column:auto;
    }

    html.tinks-lower-footer-v1 .tlf-payment-frame {
        padding:10px 12px;
    }
}

@media (max-width:470px) {
    html.tinks-lower-footer-v1 .tlf-links {
        grid-template-columns:1fr;
    }
}
