/* ==============================================
   Offres & Terminaux Telecom — CSS commun (convention 2026)
   CDN: internal/public-sites/css/offers.css
   Scope: .akeo-telecom
     - body (site AkeoTelecom)
     - #page-wrapper (contrats AdviserArea)
   ============================================== */


/* ---------------------------------------------------
   1. SCOPE & VARIABLES CSS
   --------------------------------------------------- */

.akeo-telecom {
    --color-primary: #9ad2cd;
    --color-primary-alt: #ebf6f5;
    --color-primary-dark: #257a75;
    --color-secondary: #e85a4a;
    --color-tertiary: #4c4d4f;
    --color-dark: #000;
    --color-light: #fff;
    --color-orange: #d15a0a;
    --color-bouygues: #2494ae;
    --font-primary: "tk-raleway", sans-serif;
    --font-secondary: "bebas-neue-pro-expanded", sans-serif;
    --font-size-60-resp: clamp(3rem, calc(3.75 / 117.188 * 100vw), 3.75rem);
    --font-size-48-resp: clamp(2.5rem, calc(3 / 117.188 * 100vw), 3rem);
    --font-size-46-resp: clamp(2.375rem, calc(2.875 / 117.188 * 100vw), 2.875rem);
    --font-size-44-resp: clamp(2.25rem, calc(2.75 / 117.188 * 100vw), 2.75rem);
    --font-size-42-resp: clamp(2.125rem, calc(2.625 / 117.188 * 100vw), 2.625rem);
    --font-size-40-resp: clamp(2rem, calc(2.5 / 117.188 * 100vw), 2.5rem);
    --font-size-38-resp: clamp(1.875rem, calc(2.375 / 117.188 * 100vw), 2.375rem);
    --font-size-36-resp: clamp(1.75rem, calc(2.25 / 117.188 * 100vw), 2.25rem);
    --font-size-34-resp: clamp(1.625rem, calc(2.125 / 117.188 * 100vw), 2.125rem);
    --font-size-32-resp: clamp(1.625rem, calc(2 / 117.188 * 100vw), 2rem);
    --font-size-30-resp: clamp(1.575rem, calc(1.875 / 117.188 * 100vw), 1.875rem);
    --font-size-28-resp: clamp(1.45rem, calc(1.75 / 117.188 * 100vw), 1.75rem);
    --font-size-26-resp: clamp(1.375rem, calc(1.625 / 117.188 * 100vw), 1.625rem);
    --font-size-24-resp: clamp(1.275rem, calc(1.5 / 117.188 * 100vw), 1.5rem);
    --font-size-22-resp: clamp(1.2rem, calc(1.375 / 117.188 * 100vw), 1.375rem);
    --font-size-20-resp: clamp(1.1rem, calc(1.25 / 117.188 * 100vw), 1.25rem);
    --font-size-18-resp: clamp(1.025rem, calc(1.125 / 117.188 * 100vw), 1.125rem);
    --font-size-16-resp: clamp(.95rem, calc(1 / 117.188 * 100vw), 1rem);
    --font-size-14-resp: clamp(.875rem, calc(.875 / 117.188 * 100vw), .875rem);
    --font-size-12-resp: clamp(.75rem, calc(.75 / 117.188 * 100vw), .75rem);
}


/* ---------------------------------------------------
   2. FONT SIZES (responsive — override bootstrap-ext)
   --------------------------------------------------- */

.akeo-telecom .font-size-12 { font-size: var(--font-size-12-resp); }
.akeo-telecom .font-size-14 { font-size: var(--font-size-14-resp); }
.akeo-telecom .font-size-16 { font-size: var(--font-size-16-resp); }
.akeo-telecom .font-size-18 { font-size: var(--font-size-18-resp); }
.akeo-telecom .font-size-20 { font-size: var(--font-size-20-resp); }
.akeo-telecom .font-size-22 { font-size: var(--font-size-22-resp); }
.akeo-telecom .font-size-24 { font-size: var(--font-size-24-resp); }
.akeo-telecom .font-size-26 { font-size: var(--font-size-26-resp); }
.akeo-telecom .font-size-28 { font-size: var(--font-size-28-resp); }
.akeo-telecom .font-size-30 { font-size: var(--font-size-30-resp); }
.akeo-telecom .font-size-32 { font-size: var(--font-size-32-resp); }
.akeo-telecom .font-size-34 { font-size: var(--font-size-34-resp); }
.akeo-telecom .font-size-36 { font-size: var(--font-size-36-resp); }
.akeo-telecom .font-size-38 { font-size: var(--font-size-38-resp); }
.akeo-telecom .font-size-40 { font-size: var(--font-size-40-resp); }
.akeo-telecom .font-size-42 { font-size: var(--font-size-42-resp); }
.akeo-telecom .font-size-44 { font-size: var(--font-size-44-resp); }
.akeo-telecom .font-size-46 { font-size: var(--font-size-46-resp); }
.akeo-telecom .font-size-48 { font-size: var(--font-size-48-resp); }
.akeo-telecom .font-size-60 { font-size: var(--font-size-60-resp); }


/* ---------------------------------------------------
   3. COULEURS — overrides Bootstrap
   --------------------------------------------------- */

.akeo-telecom .text-primary { color: var(--color-primary) !important; }
.akeo-telecom .text-secondary { color: var(--color-secondary) !important; }
.akeo-telecom .text-tertiary { color: var(--color-tertiary) !important; }
.akeo-telecom .bg-primary,
.akeo-telecom .bg-color-primary { background-color: var(--color-primary) !important; }
.akeo-telecom .bg-primary-alt { background-color: var(--color-primary-alt) !important; }
.akeo-telecom .bg-secondary { background-color: var(--color-secondary) !important; }
.akeo-telecom .bg-dark,
.akeo-telecom .bg-color-dark { background-color: var(--color-dark) !important; }
.akeo-telecom .bg-light { background-color: var(--color-light) !important; }


/* ---------------------------------------------------
   4. COULEURS OFFRES — variables par offre
   --------------------------------------------------- */

.akeo-telecom .card-offer-infinity { --color-offer: #E85A4A; }
.akeo-telecom .card-offer-ultra { --color-offer: #16A2A2; }
.akeo-telecom .card-offer-maxi { --color-offer: #49A295; }
.akeo-telecom .card-offer-mini,
.akeo-telecom .card-offer-mini-bloque { --color-offer: #137577; }
.akeo-telecom .card-offer-fixe { --color-offer: #E85A4A; }
.akeo-telecom .card-offer-fixe-mobile { --color-offer: #E85A4A; }

/* Classes generiques — heritent de --color-offer */
.akeo-telecom .b-color-offer { border-color: var(--color-offer) !important; }
.akeo-telecom .bg-color-offer { background-color: var(--color-offer); }
.akeo-telecom .color-offer { color: var(--color-offer); }

/* Couleurs operateurs */
.akeo-telecom .color-operator-orange { color: var(--color-orange); }
.akeo-telecom .color-operator-bouygues { color: var(--color-bouygues); }


/* ---------------------------------------------------
   5. OFFER CARDS
   --------------------------------------------------- */

.akeo-telecom .offer-container .card[class*="card-offer-"] {
    overflow: visible;
    position: relative;
}


/* ---------------------------------------------------
   6. OFFER NAME (pill)
   --------------------------------------------------- */

.akeo-telecom .offer-mobile-name {
    border-radius: 40px;
    position: relative;
}
.akeo-telecom .offer-mobile-name::after {
    content: attr(data-offer-data);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40%;
    background-color: #fff;
    border: 2px solid var(--color-offer);
    border-radius: 40px;
    font-family: var(--font-secondary);
    font-weight: bold;
    font-size: var(--font-size-34-resp);
    color: var(--color-offer);
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(50%, -50%);
}
.akeo-telecom .offer-mobile-name::before {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2em;
    height: 2em;
    background-color: var(--color-primary);
    border-radius: 50%;
    font-size: 1.5em;
    flex-shrink: 0;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
}


/* ---------------------------------------------------
   7. BADGE SIM 4G / 5G
   --------------------------------------------------- */

.akeo-telecom .offer-sim-badge {
    width: 2.5em;
    height: 2.5em;
    line-height: 2.5em;
}


/* ---------------------------------------------------
   8. LINE SEPARATORS (responsive)
   --------------------------------------------------- */

/* Tablet : 2 colonnes */
@media (min-width: 768px) and (max-width: 991.98px) {
    .akeo-telecom .offer-container .line-separator:nth-child(even) {
        border-left: 1px solid #dee2e6;
    }
}
/* Desktop : 3 colonnes */
@media (min-width: 992px) {
    .akeo-telecom .offer-container .line-separator:not(:nth-child(3n+1)) {
        border-left: 1px solid #dee2e6;
    }
}


/* ---------------------------------------------------
   9. OFFRES FIXES
   --------------------------------------------------- */

.akeo-telecom .offer-fixe-container .offer-fixe-name {
    border-radius: 40px;
    position: relative;
}
.akeo-telecom .offer-fixe-container .offer-fixe-name::before {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2em;
    height: 2em;
    background-color: var(--color-primary);
    border-radius: 50%;
    font-size: 1.5em;
    flex-shrink: 0;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%, -50%);
}
.akeo-telecom .offer-fixe-container .card {
    overflow: visible;
    position: relative;
}
.akeo-telecom .offer-fixe-container .price {
    border-radius: 40px;
    margin: auto;
    background-color: #000;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}


/* ---------------------------------------------------
   10. PAGE DETAIL OFFRE
   --------------------------------------------------- */

.akeo-telecom .detail-offer-container .card-header .price {
    border-radius: 40px;
    border: none;
    box-shadow: none;
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--color-offer);
    color: #fff;
}
.akeo-telecom .detail-offer-container .offer-detail {
    box-shadow: none;
}
.akeo-telecom .detail-offer-container .detail-offer-name-container .offer-mobile-name {
    border-radius: 40px;
}


/* ---------------------------------------------------
   11. TERMINAUX — CARDS
   --------------------------------------------------- */

.akeo-telecom .card-footer-phone-choice {
    text-align: center;
    background-color: #06c;
    width: 100%;
    color: #fff;
}

.akeo-telecom .card-detail-location:before,
.akeo-telecom .mobile-list .mobile::before {
    content: "Telephone";
    position: absolute;
    top: 3rem !important;
    right: 15px;
    color: #0066cc;
    font-weight: bold;
    text-transform: uppercase;
    font-size: 12px;
    transform: translateY(-100%);
}
.akeo-telecom .card-detail-location:before {
    transform: translateY(-370%);
    right: 0;
}
.akeo-telecom .mobile-list .mobile.tablette::before {
    content: "Tablette";
    color: #0086b3;
}

.akeo-telecom .title-list-mobile {
    background-color: #0066cc;
}
.akeo-telecom .tablette .title-list-mobile {
    background-color: #0086b3;
}

.akeo-telecom .card-mobile-phone.refurbished::before {
    background-image: url('https://image.akeo.fr/akeotelecom/ui/refurbished-top-right-corner.png');
    background-size: 220px 140px;
    display: inline-block;
    width: 220px;
    height: 140px;
    content: "";
    position: absolute;
    top: 20px;
    right: 0;
    z-index: 1000;
    opacity: 0.1;
}

/* Terminal title — centered line */
.akeo-telecom .title-terminal {
    position: relative;
    margin: 0 8%;
}
.akeo-telecom .title-terminal h2 {
    background-color: #fff;
    position: relative;
    z-index: 1;
    display: inline-block;
    padding: 0 14px;
}
.akeo-telecom .title-terminal::after {
    content: "";
    position: absolute;
    background-color: #adb5bd;
    height: 2px;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    margin: auto;
}

/* Terminal pricing */
.akeo-telecom .location {
    position: relative;
}
.akeo-telecom .price .currency {
    vertical-align: top;
}
.akeo-telecom .location .duration,
.akeo-telecom .location .frequency,
.akeo-telecom .location .amount-order {
    font-size: 12px;
}


/* ---------------------------------------------------
   12. TERMINAUX — RIBBONS
   --------------------------------------------------- */

.akeo-telecom .container-tag-content {
    width: max-content;
    float: right;
    margin-right: 14px;
}
.akeo-telecom .container-tag-content .container-tag-text {
    position: relative;
    float: left;
    height: 23px;
}
.akeo-telecom .container-tag-content .container-tag-icon {
    position: relative;
    z-index: 1;
    float: left;
}

.akeo-telecom .container-ribbon-terminal {
    z-index: 1010;
}
.akeo-telecom .container-ribbon-terminal .container-tag-content .container-tag-icon::before {
    content: "";
    width: 0;
    height: 0;
    border-top: 0 solid transparent;
    border-bottom: 23px solid transparent;
    position: absolute;
    left: 0;
    top: 0;
}
.akeo-telecom .container-ribbon-terminal .container-tag-content .container-tag-icon:first-child::before {
    transform: translateX(-100%) rotateX(180deg) rotateY(180deg);
}
.akeo-telecom .container-ribbon-terminal:not(.top) .container-tag-content .container-tag-icon:first-child::before {
    transform: translateX(-100%) rotateY(180deg);
}
.akeo-telecom .container-ribbon-terminal:not(.top) .container-tag-content .container-tag-icon::before {
    transform: rotateX(180deg);
}

/* Ribbon colors */
.akeo-telecom .container-ribbon-terminal [class*="ribbon_"] { position: relative; background-color: #0066cc; }
.akeo-telecom .container-ribbon-terminal .ribbon_0_ { background-color: #f59821; }
.akeo-telecom .container-ribbon-terminal .ribbon_1_ { background-color: #102694; }
.akeo-telecom .container-ribbon-terminal .ribbon_2_ { background-color: #1F3644; }
.akeo-telecom .container-ribbon-terminal .ribbon_3_ { background-color: #E5382A; }
.akeo-telecom .container-ribbon-terminal .ribbon_4_ { background-color: #f59821; }
.akeo-telecom .container-ribbon-terminal .ribbon_7_ { background-color: #00993F; }

.akeo-telecom .container-tag-content[class*="ribbon_"] .container-tag-icon::before { border-left: 14px solid #0066cc; }
.akeo-telecom .container-tag-content.ribbon_0_ .container-tag-icon::before { border-left: 14px solid #f59821; }
.akeo-telecom .container-tag-content.ribbon_1_ .container-tag-icon::before { border-left: 14px solid #102694; }
.akeo-telecom .container-tag-content.ribbon_2_ .container-tag-icon::before { border-left: 14px solid #1F3644; }
.akeo-telecom .container-tag-content.ribbon_3_ .container-tag-icon::before { border-left: 14px solid #E5382A; }
.akeo-telecom .container-tag-content.ribbon_4_ .container-tag-icon::before { border-left: 14px solid #f59821; }
.akeo-telecom .container-tag-content.ribbon_7_ .container-tag-icon::before { border-left: 14px solid #00993F; }

.akeo-telecom .container-tag-content .container-tag-text[class*="ribbon_"] { background-color: #0066cc; color: #fff; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_0_ { text-transform: capitalize; background-color: #f59821; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_1_ { text-transform: capitalize; background-color: #102694; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_2_ { background-color: #1F3644; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_3_ { background-color: #E5382A; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_4_ { background-color: #f59821; }
.akeo-telecom .container-tag-content .container-tag-text.ribbon_7_ { background-color: #00993F; }


/* ---------------------------------------------------
   13. TERMINAUX — FILTERS & SORT
   --------------------------------------------------- */

.akeo-telecom .btn-group-sort .btn .sort-asc,
.akeo-telecom .btn-group-sort .btn .sort-desc {
    color: #adb5bd;
}
.akeo-telecom .btn-group-sort .btn.sort-asc,
.akeo-telecom .btn-group-sort .btn.sort-desc {
    border-color: var(--color-primary-dark) !important;
}
.akeo-telecom .btn-group-sort .btn.sort-asc .sort-asc { color: var(--color-primary-dark); }
.akeo-telecom .btn-group-sort .btn.sort-desc .sort-desc { color: var(--color-primary-dark); }
.akeo-telecom .btn-group-sort .btn:hover { border-color: #545b62 !important; }

.akeo-telecom .btn-sort-price,
.akeo-telecom .btn-sort-brand {
    position: relative;
    margin: 6px 12px;
}

.akeo-telecom .filter-dropdown {
    padding: 0;
}
.akeo-telecom .filter-dropdown::after {
    position: absolute;
    right: 10px;
    top: 50%;
}

/* Neutraliser le border-color hover Bootstrap */
.akeo-telecom .filter-dropdown.btn-secondary:hover,
.akeo-telecom .filter-dropdown.btn-secondary:not(:disabled):not(.disabled):active,
.akeo-telecom .show > .filter-dropdown.btn-secondary.dropdown-toggle,
.akeo-telecom .btn-group-sort .btn:not(:disabled):not(.disabled):active {
    border-color: var(--color-tertiary);
}

/* Filter dropdown — arrondi haut quand ouvert */
.akeo-telecom .dropdown.show > .filter-dropdown.r-40 {
    border-radius: 0;
    border-top-left-radius: 22px;
    border-top-right-radius: 22px;
}

.akeo-telecom .filter-categorie-container {
    height: 30px;
    position: relative;
    margin: 6px 12px;
}
.akeo-telecom .filter-categorie-container .filter-categorie-name {
    padding-top: 4px;
}
.akeo-telecom .filter-categorie-container .filter-selected {
    display: none;
    float: left;
    overflow: hidden;
    white-space: normal;
    width: 100%;
    text-align: left;
    padding-left: 12px;
    font-size: 14px;
}

.akeo-telecom .filtered .filter-categorie-name {
    font-size: 14px;
    color: var(--color-primary-dark);
    padding-top: 0;
    float: left;
    padding-left: 12px;
    font-weight: 500;
}
.akeo-telecom .filtered .filter-categorie-container {
    margin: 0;
    height: 42px;
}
.akeo-telecom .filtered .filter-selected {
    display: block !important;
}

.akeo-telecom .dropdown-menu-filter ul {
    list-style: none !important;
}
.akeo-telecom .dropdown-menu {
    z-index: 1020;
}
.akeo-telecom #terminalAvailable .filter-dropdown {
    padding: 0;
}

/* Nav pills */
.akeo-telecom .nav-pills .nav-link {
    border-radius: 10px;
}
.akeo-telecom .nav-pills .nav-link.active,
.akeo-telecom .nav-pills .show > .nav-link {
    background-color: var(--color-tertiary-alt);
}


/* ---------------------------------------------------
   14. TERMINAUX — COULEURS & UTILITIES
   --------------------------------------------------- */

.akeo-telecom .color-f59821 { color: #f59821; }
.akeo-telecom .color-102694 { color: #102694; }
.akeo-telecom .border-top-1 { border-top-width: 1px; }
.akeo-telecom .border-top-only {
    border-left: 0;
    border-right: 0;
    border-bottom: 0;
}
.akeo-telecom .b-color-dadada { border-color: #dadada; }
.akeo-telecom .border-bottom-2-px {
    border: none;
    border-bottom-width: 2px !important;
    border-bottom-style: solid !important;
    border-color: transparent;
}


/* ---------------------------------------------------
   15. BUTTONS — Select (engagement radio)
   --------------------------------------------------- */

.akeo-telecom .btn-select-group {
    gap: .5rem;
}
.akeo-telecom .btn-select {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    padding: .4rem 1rem;
    border-radius: 40px;
    border: 2px solid var(--color-primary);
    font-weight: bold;
    font-size: .85rem;
    background-color: var(--color-light);
    color: var(--color-dark);
    cursor: pointer;
    transition: background-color .2s, color .2s, border-color .2s;
}
.akeo-telecom .btn-select:hover {
    background-color: var(--color-primary-alt);
}
.akeo-telecom .offer-radio:checked + .btn-select {
    background-color: var(--color-primary);
    color: var(--color-light);
    border-color: var(--color-primary);
}


/* ---------------------------------------------------
   16. BUTTONS — Price (engagement/sans engagement)
   --------------------------------------------------- */

.akeo-telecom .btn-price-select {
    cursor: pointer;
}
.akeo-telecom .btn-price-select::before {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25em;
    height: 2.25em;
    border-radius: 50%;
    border: 2px solid var(--color-primary);
    background: var(--color-light);
    margin: 0 auto .5rem;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
    transition: background-color .2s, border-color .2s;
}
.akeo-telecom .offer-price-radio:checked + .btn-price-select::before,
.akeo-telecom .btn-price-select.active::before {
    content: "\2713";
    background-color: var(--color-primary);
    color: var(--color-light);
}

/* Leasing mode cards — radio indicator on card instead of label */
.akeo-telecom .card.leasing-mode-card {
    cursor: pointer;
    position: relative;
}
.akeo-telecom .card.leasing-mode-card::before {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.25em;
    height: 2.25em;
    border-radius: 50%;
    border: 2px solid var(--color-primary);
    background: var(--color-light);
    margin: 0 auto .5rem;
    position: absolute;
    top: 0;
    left: 0;
    transform: translateY(-50%);
    transition: background-color .2s, border-color .2s;
}
.akeo-telecom .card.leasing-mode-card.active::before {
    content: "\2713";
    background-color: var(--color-primary);
    color: var(--color-light);
}
.akeo-telecom .card.leasing-mode-card .btn-price-select::before {
    display: none;
}

/* ---------------------------------------------------
   17. BUTTONS — Libre/Bloque
   --------------------------------------------------- */

.akeo-telecom .btn-libre-bloque {
    cursor: pointer;
}
.akeo-telecom .btn-libre-bloque::before {
    content: "";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.75em;
    height: 1.75em;
    border-radius: 50%;
    border: 2px solid var(--color-primary);
    background: var(--color-light);
    margin: 0;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translateY(-50%);
    transition: background-color .2s, border-color .2s;
}
.akeo-telecom .offer-price-radio:checked + .btn-libre-bloque::before {
    content: "\2713";
    background-color: var(--color-primary);
    color: var(--color-light);
}


/* ---------------------------------------------------
   18. BUTTONS — Select alt (terminaux)
   --------------------------------------------------- */

.akeo-telecom .btn-select-alt {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    border-radius: 40px !important;
    border: 1px solid transparent;
    font-weight: bold;
    background-color: var(--color-tertiary);
    color: var(--color-light);
    position: relative;
}
.akeo-telecom .btn-select-alt:hover {
    background-color: var(--color-light);
    color: var(--color-dark);
    border: 1px solid var(--color-tertiary);
    text-decoration: none;
}
.akeo-telecom .btn-select-alt::after {
    content: ">";
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5em;
    height: 1.5em;
    margin-left: .75rem;
    background-color: var(--color-primary);
    color: var(--color-light);
    border-radius: 50%;
    font-size: 1.5em;
    font-weight: bold;
    flex-shrink: 0;
    position: absolute;
    top: 0;
    right: 0;
    transform: translateY(-50%);
}


/* ---------------------------------------------------
   19. UTILITY OVERRIDES
   --------------------------------------------------- */


/* Custom control — checked state */
.akeo-telecom .custom-control-input:checked ~ .custom-control-label::before {
    border-color: var(--color-primary-dark);
    background-color: var(--color-primary-dark);
}


/* Input number — hide spinners */
.akeo-telecom input[type="number"].no-spinners::-webkit-outer-spin-button,
.akeo-telecom input[type="number"].no-spinners::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
.akeo-telecom input[type="number"].no-spinners {
    -moz-appearance: textfield;
}
