/*
 * My-Seedbox Design v3 — public-page cascade repairs.
 *
 * Load this file after design-v3.css and the legacy shell styles. Every rule is
 * gated by html.design-v3 so the production/legacy rendering stays untouched.
 */

/* The authentication views were the only public V3 views still inheriting the
 * legacy Maven Pro declaration applied directly to form controls. */

html.design-v3 .v3-auth,
html.design-v3 .v3-auth input,
html.design-v3 .v3-auth button,
html.design-v3 .v3-auth select,
html.design-v3 .v3-auth textarea {
    font-family: Inter, "Open Sans", "Segoe UI", Arial, sans-serif;
}

/* Bootstrap floats .form-control. In the login input-group that collapses the
 * parent to zero height, so both absolute icon add-ons occupy the first row. */

/* Registration: the title occupies its own row. Benefits and the form start
 * on the same grid line, without offsets tied to a particular text height.
 * Only the introductory wrapper loses its box; the form DOM stays intact. */
@media (min-width: 992px) {
    html.design-v3 .v3-auth--registration .v3-auth__layout {
        align-items: stretch;
        row-gap: 14px;
    }

    html.design-v3 .v3-auth--registration .v3-auth__intro {
        display: contents;
    }

    html.design-v3 .v3-auth--registration h2.v3-auth__title {
        grid-column: 1 / -1;
        grid-row: 1;
        margin: 0 0 12px;
    }

    html.design-v3 .v3-auth--registration .v3-auth__feature {
        grid-column: 1;
        min-width: 0;
        max-width: none;
        margin: 0;
    }

    html.design-v3 .v3-auth--registration .v3-auth__panel {
        grid-column: 2;
        grid-row: 2 / span 3;
        align-self: start;
    }
}

html.design-v3 .v3-auth__panel .input-group {
    display: block;
    min-height: 50px;
    border-collapse: separate;
}

html.design-v3 .v3-auth--login .v3-auth__panel .input-group {
    min-height: 52px;
}

html.design-v3 .v3-auth__panel input.form-control {
    position: relative;
    display: block;
    float: none !important;
    box-sizing: border-box;
}

html.design-v3 .v3-auth__panel .input-group-addon {
    top: 1px;
    right: auto;
    bottom: 1px;
    left: 1px;
    height: auto;
}

html.design-v3 .v3-auth--login .v3-auth__panel .login-input .input-group-addon > i {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    display: block !important;
    margin: 0 !important;
    font-family: FontAwesome !important;
    font-style: normal !important;
    line-height: 16px;
    transform: none !important;
}

html.design-v3 .v3-auth--login .v3-auth__panel .fa-user::before {
    content: "\f007";
}

html.design-v3 .v3-auth--login .v3-auth__panel .fa-lock::before {
    content: "\f023";
}

html.design-v3 .v3-auth__panel > form > br {
    display: none;
}

/* Bootstrap's clearfix pseudo-elements participate as anonymous grid/flex
 * children. Remove them only from V3 layout containers that own their flow. */

html.design-v3 body.page-home .v3-home-benefits-row::before,
html.design-v3 body.page-home .v3-home-benefits-row::after,
html.design-v3 .v3-auth__layout::before,
html.design-v3 .v3-auth__layout::after,
html.design-v3 .v3-cart-grid::before,
html.design-v3 .v3-cart-grid::after,
html.design-v3 .v3-cart-list-head::before,
html.design-v3 .v3-cart-list-head::after,
html.design-v3 .v3-cart-item::before,
html.design-v3 .v3-cart-item::after,
html.design-v3 .v3-cart-totals-grid::before,
html.design-v3 .v3-cart-totals-grid::after,
html.design-v3 .v3-cart-checkout::before,
html.design-v3 .v3-cart-checkout::after,
html.design-v3 .v3-vpn-status__row::before,
html.design-v3 .v3-vpn-status__row::after,
html.design-v3 .v3-legal-breadcrumb__container::before,
html.design-v3 .v3-legal-breadcrumb__container::after {
    display: none !important;
    content: none !important;
}

/* screen.css applies italic/relative positioning to raw <i> elements after
 * Font Awesome. Restore icon metrics without changing deliberate icon sizes. */

html.design-v3 #top .fa,
html.design-v3 #footer .fa,
html.design-v3 body.page-home .fa,
html.design-v3 .v3-seedbox-hero .fa,
html.design-v3 .v3-seedbox-comparison .fa,
html.design-v3 .v3-seedbox-trial .fa,
html.design-v3 .v3-seedbox-feature .fa,
html.design-v3 .v3-vpn-status .fa,
html.design-v3 .v3-auth .fa,
html.design-v3 .v3-cart-page .fa,
html.design-v3 .v3-legal .fa,
html.design-v3 .v3-legal-hero .fa,
html.design-v3 .v3-legal-breadcrumb .fa {
    font-family: FontAwesome !important;
    font-style: normal !important;
}

html.design-v3 .v3-seedbox-comparison .v3-seedbox-table td > .fa:first-child {
    position: static;
    top: auto;
    vertical-align: baseline;
}

html.design-v3 .v3-seedbox-comparison .v3-seedbox-table .icon-check,
html.design-v3 .v3-seedbox-comparison .v3-seedbox-table .icon-check.a {
    position: static !important;
    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    overflow: visible;
}

html.design-v3 .v3-cart-page .glyphicon {
    font-family: "Glyphicons Halflings" !important;
    font-style: normal !important;
}

/* scripts.js supplies this wrapper around rendered tables. Keep the scroll on
 * that bounded region; do not hide overflow on the page or root shell. */

html.design-v3 section#content.v3-seedbox-comparison > .table-wrapper {
    box-sizing: border-box;
    max-width: 1180px;
    overflow-x: auto;
    overflow-y: hidden;
}

html.design-v3 section.v3-seedbox-comparison table.v3-seedbox-table {
    font-family: Inter, "Open Sans", "Segoe UI", Arial, sans-serif;
}

html.design-v3 section.v3-seedbox-comparison .v3-seedbox-table td,
html.design-v3 section.v3-seedbox-comparison .v3-seedbox-table th {
    overflow-wrap: break-word;
}

/* These direct break elements only encode legacy vertical spacing. V3 already
 * owns the corresponding margins; meaningful in-paragraph/legal address breaks
 * and price-row breaks are deliberately left alone. */

html.design-v3 .v3-cart-lead + br,
html.design-v3 section.v3-seedbox-trial > article.module-d > br,
html.design-v3 .v3-legal .v3-legal__document > br {
    display: none;
}

html.design-v3 .v3-legal .v3-legal__document,
html.design-v3 .v3-cart-grid > *,
html.design-v3 section.v3-seedbox-feature > article > * {
    min-width: 0;
}

html.design-v3 .v3-legal .v3-legal__document a,
html.design-v3 .v3-cart-item-name,
html.design-v3 section.v3-seedbox-feature p {
    overflow-wrap: break-word;
}

/* The original four-column declaration includes #content and therefore beats
 * the lower-specificity responsive rules in design-v3.css. Match that cascade
 * root so proof cards remain readable instead of becoming 76px-wide columns. */

@media only screen and (max-width: 1000px) {
    html.design-v3 body.page-home section#content.v3-home-proof > article.module-d > ul.list-g {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media only screen and (max-width: 500px) {
    html.design-v3 body.page-home section#content.v3-home-proof > article.module-d > ul.list-g {
        grid-template-columns: minmax(0, 1fr);
    }
}