.iqitfake{ display: none;} @charset "UTF-8"; /*** Style mixins ***/ /*** Variables mixins and functions ***/ .container, .elementor-section.elementor-section-boxed > .elementor-container { max-width: 1800px; } a:link:not(.nav-link):not(.btn), a:visited:not(.nav-link):not(.btn) { color: #777777; } a:hover:not(.nav-link):not(.btn) { color: #333333; } .pagination .page-list li:hover { border-color: #333333; } .pagination .page-list li.current { border-color: #333333; } .pagination .page-list li.current a { color: #333333; } #mobile-header { border-bottom: solid 1px #e3e3e3; } #mobile-header .mobile-main-bar { padding-top: 1.4285714286rem; padding-bottom: 1.4285714286rem; } #mobile-header .m-nav-btn { color: #2c2c2c; } #mobile-header .m-nav-btn:hover { color: #4899c7; } #mobile-header .m-nav-btn > span { display: none !important; } #mobile-header .mobile-buttons-bar { background: #c9c9c9; } html { font-size: 14px; } @media (max-width: 767px) { html { font-size: 12px; } } body { line-height: 1.4rem; } body { font-family: 'Poppins', sans-serif; } #blockcart-content { background: #ffffff; border: none 1px; box-shadow: 0px 6px 30px 0px rgba(0, 0, 0, 0.15); } /*** Secondary button ***/ .btn-secondary, .btn-secondary.disabled, .btn-secondary:disabled, .bootstrap-touchspin .group-span-filestyle .btn-touchspin, .group-span-filestyle .bootstrap-touchspin .btn-touchspin, .group-span-filestyle .btn-default { background: #f36600; color: #ffffff; border: solid 1px #f36600; } .btn-secondary:hover, .btn-secondary:focus, .btn-secondary :active, .btn-secondary.disabled:hover, .btn-secondary.disabled:focus, .btn-secondary.disabled :active, .btn-secondary:disabled:hover, .btn-secondary:disabled:focus, .btn-secondary:disabled :active, .bootstrap-touchspin .group-span-filestyle .btn-touchspin:hover, .bootstrap-touchspin .group-span-filestyle .btn-touchspin:focus, .bootstrap-touchspin .group-span-filestyle .btn-touchspin :active, .group-span-filestyle .bootstrap-touchspin .btn-touchspin:hover, .group-span-filestyle .bootstrap-touchspin .btn-touchspin:focus, .group-span-filestyle .bootstrap-touchspin .btn-touchspin :active, .group-span-filestyle .btn-default:hover, .group-span-filestyle .btn-default:focus, .group-span-filestyle .btn-default :active { background: #ffffff; color: #f36600; border-color: #f36600; } .btn-secondary:not(:disabled):not(.disabled):active { background: #ffffff; color: #f36600; border-color: #f36600; } .btn-outline-secondary, .btn-outline-secondary.disabled, .btn-outline-secondary:disabled { background: #f36600; color: #ffffff; border: solid 1px #e3e3e3; } .btn-outline-secondary:hover, .btn-outline-secondary.disabled:hover, .btn-outline-secondary:disabled:hover { background: #ffffff; color: #f36600; border: solid 1px #e3e3e3; } /*** Primary button ***/ .btn-primary, .btn-primary.disabled, .btn-primary:disabled { background: #f36600; color: #ffffff; border: solid 1px #f36600; } .btn-primary:hover, .btn-primary:focus, .btn-primary :active, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled :active, .btn-primary:disabled:hover, .btn-primary:disabled:focus, .btn-primary:disabled :active { background: #ffffff; color: #f36600; border-color: #f36600; } .btn-primary:not(:disabled):not(.disabled):active { background: #ffffff; color: #f36600; border-color: #f36600; } #wrapper .breadcrumb { padding-top: 0.7142857143rem; padding-bottom: 0.7142857143rem; margin-top: -1.0714285714rem; margin-bottom: 1.0714285714rem; font-size: 0.8571428571rem; font-style: normal; font-weight: normal; text-transform: none; color: #8f8f8f; } #wrapper .breadcrumb li:after { color: #8f8f8f; } #wrapper .breadcrumb a { color: #8f8f8f; } /*** Text fields ***/ .form-control { background-color: #ffffff; color: #777777; border: solid 1px #e3e3e3; } .custom-select2, .custom-select2 option { background-color: #ffffff; } .custom-select2:after { color: #777777; } .bootstrap-touchspin .btn-touchspin { background-color: #ffffff; color: #777777; border: solid 1px #e3e3e3; } .bootstrap-touchspin .btn-touchspin:hover { color: #777777; } .form-control::-webkit-input-placeholder { color: #777777; } .form-control::-moz-placeholder { color: #777777; } .form-control:-ms-input-placeholder { color: #777777; } .form-control:-moz-placeholder { color: #777777; } .form-control:focus { color: #777777; border-color: #8a8a8a; } /*** Radio buttons and checkboxes ***/ .custom-checkbox input[type=checkbox] + span .checkbox-checked { color: #000000; } .custom-radio input[type=radio]:checked + span { background-color: #000000; } .custom-checkbox input[type=checkbox] + span:not(.color), .custom-radio { background: #ffffff; color: #000000; border-color: #e3e3e3; } /*** Dropdowns ***/ .dropdown-menu, .autocomplete-suggestions { background: #ffffff; border: solid 1px #e3e3e3; } .dropdown-menu .dropdown-item, .autocomplete-suggestions .dropdown-item { color: #474747!important; border-bottom: solid 1px #e3e3e3; } .dropdown-menu .dropdown-item:focus, .dropdown-menu .dropdown-item:hover, .autocomplete-suggestions .dropdown-item:focus, .autocomplete-suggestions .dropdown-item:hover { background: rgba(71, 71, 71, 0.05); } /*** Tooltips ***/ .tooltip-inner { background: #333333; color: #ffffff; } .tooltip.bs-tether-element-attached-bottom .tooltip-inner:before, .tooltip.tooltip-top .tooltip-inner:before, .bs-tooltip-auto[x-placement^=top] .arrow:before, .bs-tooltip-top .arrow:before { border-top-color: #333333; } .bs-tooltip-auto[x-placement^=bottom] .arrow::before, .bs-tooltip-bottom .arrow::before { border-bottom-color: #333333; } /*** Modals ***/ .modal-backdrop { background: rgba(194, 194, 194, 0.7); } .modal-content { background: #ffffff; border: none 1px; } .js-quickview-np-btn { background: #ffffff; } /*** Notifications ***/ .ns-box { background: #ca5058; color: #ffffff; border: none 1px; } .product-price { color: #ad1f00; } .iqit-review-star { color: #e0d041; } .product-flags .product-flag { font-size: 0.7857142857rem; font-style: normal; font-weight: normal; text-transform: none; } .product-flags .discount, .product-flags .on-sale { background: #eba53d; color: #ffffff; } .product-flags .new { background: #969696; color: #ffffff; } .product-flags .online-only, .product-flags .pack { background: #e0e0e0; color: #000000; } .product-flags .out_of_stock { background: #a17738; color: #fff7f7; } .discount { background: #eba53d; color: #ffffff; } .product-available { background: #67a675; color: #ffffff; } .product-unavailable { background: #a17738; color: #fff7f7; } .alert-success a:link:not(.nav-link):not(.btn), .alert-success a:visited:not(.nav-link):not(.btn) { text-decoration: underline; } .alert-info a:link:not(.nav-link):not(.btn), .alert-info a:visited:not(.nav-link):not(.btn) { text-decoration: underline; } .alert-warning a:link:not(.nav-link):not(.btn), .alert-warning a:visited:not(.nav-link):not(.btn) { text-decoration: underline; } .alert-danger a:link:not(.nav-link):not(.btn), .alert-danger a:visited:not(.nav-link):not(.btn) { text-decoration: underline; } #iqitcompare-floating { background: #ffffff; border-top: none 1px; border-left: none 1px; border-right: none 1px; } #page-preloader { background: #ffffff; } #back-to-top { background: #000000; color: #ffffff; } #back-to-top:hover { background: #333333; color: #ffffff; } #header, #checkout-header { border-top: none 20px; border-bottom: none 20px; } .sticky-desktop-wrapper #desktop-header.stuck-header { border-bottom: none 20px; } #header .header-nav { color: #ffffff; background: #0a277b; border-bottom: none 1px; padding-top: 1.4285714286rem; padding-bottom: 1.4285714286rem; font-size: 1.1428571429rem; } #header .header-nav a { color: #ffffff; } #header .header-nav a:hover { color: #ffffff; } #header .header-nav .social-links._topbar { font-size: 1rem; } .header-top { padding-top: 1.7857142857rem; padding-bottom: 1.7857142857rem; color: #2c2c2c; } .header-top a:not(.btn):not(.nav-link) { color: #2c2c2c; } .header-top a:not(.btn):not(.nav-link):hover { color: #2c2c2c; } .header-top .form-search-control { border: solid 1px #e3e3e3; } .header-top .header-btn-w .header-btn > .icon { font-size: 1.4285714286rem; display: block; } .header-top .header-btn-w .header-btn .title { display: none !important; } .header-top .header-cart-default a.cart-toogle { background: #000000; color: #ffffff; padding: 0.6428571429rem 0.6428571429rem; } .header-top .header-cart-default a.cart-toogle:hover { color: #ffffff; } .header-top a.header-cart-btn:not(:hover) { color: #ffffff; } .stuck-header .header-top { padding-top: 0.3571428571rem; padding-bottom: 0.3571428571rem; } .sticky-desktop-wrapper #desktop-header.stuck-header, .stuck-menu { background: #2c2c2c; } .header-top { transition: padding 0.3s ease; } .cart-products-count-btn { background: #f36600; color: #ffffff; } .desktop-header-style-1 .search-widget, .desktop-header-style-2 .search-widget { max-width: 50%; } /*** HORIZONTAL MENU ***/ #iqitmegamenu-horizontal { background: #ffffff; border-top: none 3px #521919; border-right: none 3px #38b82c; border-bottom: none 3px #457deb; border-left: none 3px #a6cc0f; } .cbp-horizontal > ul > li > a, .cbp-horizontal > ul > li > a:not([href]):not([tabindex]), .cbp-horizontal > ul > li > .cbp-main-link { line-height: 3.2857142857rem; max-width: 17.1428571429rem; color: #2c2c2c; padding-left: 0.7142857143rem; padding-right: 0.7142857143rem; border-left: none 1px rgba(87, 87, 87, 0.57); } #sticky-cart-wrapper a.header-cart-btn:not(:hover) { color: #2c2c2c; } #sticky-cart-wrapper .ps-shoppingcart.side-cart #blockcart-content { top: -1.0714285714rem; } .cbp-vertical-on-top .cbp-vertical-title { line-height: 3.2857142857rem !important; } .cbp-vertical-on-top .cbp-vertical-title-text { display: none !important; } .cbp-horizontal > ul > li.cbp-hropen > a, .cbp-horizontal > ul > li.cbp-hropen > a:not([href]):not([tabindex]), .cbp-horizontal > ul > li.cbp-hropen > a:hover { background: #ffffff; color: #4899c7; } .cbp-horizontal .cbp-tab-title { font-size: 1.2857142857rem; font-style: normal; font-weight: bold; text-transform: none; line-height: 1em; } .cbp-horizontal .cbp-legend { background: #ffffff; color: #000000; } .cbp-horizontal .cbp-mainlink-icon, .cbp-horizontal .cbp-mainlink-iicon { font-size: 1.1428571429rem; max-height: 1.1428571429rem; } @media (max-width: 1300px) { .cbp-horizontal .cbp-tab-title { font-size: 0.9285714286rem; } .cbp-horizontal > ul > li > a, .cbp-horizontal > ul > li > a:not([href]):not([tabindex]), .cbp-horizontal > ul > li > .cbp-main-link { padding-left: 0.4285714286rem; padding-right: 0.4285714286rem; } } #cbp-hrmenu .cbp-hrsub { transform: translateY(-10px); } #cbp-hrmenu .cbp-hropen .cbp-hrsub { transform: translateY(0px); } #cbp-hrmenu .cbp-hrsub, #cbp-hrmenu .cbp-hrsub-level2, #cbp-hrmenu .cbp-hrsub-wrapper { transition: opacity 300ms ease-in-out, transform 300ms ease-in-out; } .iqitmegamenu-submenu-container { padding: 0; } /*** VERTICAL MENU ***/ .cbp-vertical-on-top #cbp-hrmenu1-ul { background: #ffffff; border: solid 1px #e3e3e3; } #content-wrapper #cbp-hrmenu1 { background: #ffffff; border: solid 1px #e3e3e3; } #cbp-hrmenu1 .cbp-vertical-title { font-size: 1.2857142857rem; font-style: normal; font-weight: normal; text-transform: none; color: #ffffff; background: #000000; line-height: 3.5714285714rem; } #cbp-hrmenu1 .cbp-vertical-title:hover { color: #ffffff; background: #000000; } #cbp-hrmenu1 > ul > li > a, #cbp-hrmenu1 > ul > li > span.cbp-main-link { font-style: normal; font-weight: normal; text-transform: none; padding-top: 0.5714285714rem; padding-bottom: 0.5714285714rem; border-top: solid 1px rgba(227, 227, 227, 0.35); } #cbp-hrmenu1 > ul > li > a .cbp-mainlink-icon, #cbp-hrmenu1 > ul > li > a .cbp-mainlink-iicon { font-size: 1.7142857143rem; max-height: 1.7142857143rem; } #cbp-hrmenu1 > ul > li.cbp-hropen > a, #cbp-hrmenu1 > ul > li.cbp-hropen > a:hover { background: #f8f8f8; color: #333333; } #cbp-hrmenu1 .cbp-legend { background: #ca5058; color: #ffffff; } .cbp-vert-expanded #cbp-hrmenu1 .cbp-vertical-title { color: #ffffff; background: #000000; } .cbp-not-on-top #cbp-hrmenu1-ul { position: relative; } .cbp-hrmenu.cbp-vertical .cbp-hrsub-wrapper { top: 0; margin-top: 0px !important; min-height: 100%; } .cbp-hrmenu.cbp-vertical .cbp-hrsub { min-height: 100%; } .cbp-hrmenu.cbp-vertical .cbp-show { -js-display: flex; display: flex; flex-wrap: wrap; } .cbp-hrmenu.cbp-vertical .cbp-hrsub-inner { width: 100%; } /*** SUBMENU ***/ .cbp-hrmenu .cbp-hrsub { font-size: 1rem; font-style: normal; font-weight: normal; text-transform: none; } .cbp-hrmenu .cbp-hrsub-inner, .cbp-hrmenu ul.cbp-hrsub-level2 { background: #ffffff; border: none 1px #37a625; } .cbp-hrmenu .cbp-hrsub-inner, .cbp-hrmenu .cbp-hrsub-inner a, .cbp-hrmenu .cbp-hrsub-inner a:link { color: !important; } .cbp-hrmenu .cbp-hrsub-inner a:hover { color: #333333 !important; } .cbp-hrmenu .tabs-links { background: #f7f7f7; } .cbp-hrmenu .cbp-tabs-names li a { color: #777777 !important; } .cbp-hrmenu .cbp-tabs-names li a:hover, .cbp-hrmenu .cbp-tabs-names li a.active { background: #ffffff; color: #777777 !important; } .cbp-hrmenu .cbp-hrsub-inner .cbp-column-title, .cbp-hrmenu .cbp-hrsub-inner a.cbp-column-title:link { color: #333333 !important; border-bottom: none 3px #c2bc29; font-size: 1rem; font-style: normal; font-weight: bold; text-transform: uppercase; } .cbp-hrmenu .cbp-hrsub-inner a.cbp-column-title:hover { color: !important; } /*** MOBILE MENU ***/ #mobile-header .col-mobile-menu-dropdown.show { background: #ffffff; } #mobile-header .col-mobile-menu-dropdown.show .m-nav-btn { color: #2c2c2c !important; } #iqitmegamenu-mobile { background: #ffffff; } #iqitmegamenu-mobile li > ul.mobile-menu__submenu--accordion .mobile-menu__tab { min-height: 3.3571428571rem; } #iqitmegamenu-mobile li > ul.mobile-menu__submenu--accordion .mobile-menu__tab:not(:last-child) { border-bottom: none 1px; } #iqitmegamenu-mobile li > ul.mobile-menu__submenu--accordion .mobile-menu__arrow { padding-top: 1.1428571429rem; padding-bottom: 1.1428571429rem; } #iqitmegamenu-mobile li > ul.mobile-menu__submenu--accordion .mobile-menu__link { color: #595050 !important; padding-top: 1.1428571429rem; padding-bottom: 1.1428571429rem; font-size: 1.2857142857rem; font-style: normal; font-weight: normal; text-transform: none; } .col-mobile-menu-push #iqitmegamenu-mobile { border: none 1px; } .mobile-menu__submenu { background: #ffffff; } .mobile-menu__tab { border-bottom: solid 1px #ebebeb; min-height: 3.2142857143rem; } .mobile-menu__link { color: #2c2c2c !important; padding-top: 1.0714285714rem; padding-bottom: 1.0714285714rem; font-size: 1.0714285714rem; font-style: normal; font-weight: normal; text-transform: none; } .mobile-menu__arrow { padding-top: 1.0714285714rem; padding-bottom: 1.0714285714rem; color: #2c2c2c; font-size: 1.0714285714rem; } .mobile-menu__tab-icon { font-size: 1.0714285714rem; } .mobile-menu__tab-icon--img { max-height: 1.0714285714rem; } .mobile-menu__legend { font-size: 0.8571428571rem; font-style: normal; font-weight: normal; text-transform: none; color: #ffffff; background-color: #2c2c2c; } .mobile-menu__header-wrapper { color: #2c2c2c; background-color: #f4f4f4; border-bottom: none 1px; } .mobile-menu__title { font-size: 1.0714285714rem; font-style: normal; font-weight: normal; text-transform: none; } .mobile-menu__column-title { font-size: 1.0714285714rem; font-style: normal; font-weight: bold; text-transform: uppercase; color: #0a277b !important; } .mobile-menu__column { font-size: 1rem; font-style: normal; font-weight: bold; text-transform: none; color: #777777; margin-bottom: 1.0714285714rem; } .mobile-menu__column-categories:not(:last-child) { margin-bottom: 1.0714285714rem; } .mobile-menu__column-title { margin-bottom: 0.5714285714rem; } .mobile-menu__links-list-li { padding-top: 0.4285714286rem; padding-bottom: 0.4285714286rem; } .mobile-menu__close, .mobile-menu__back-btn { color: #2c2c2c; } .mobile-menu__footer { border-top: none 1px; color: #2c2c2c; background-color: #f4f4f4; } /*** PS_FacatedSearch ***/ /*** Carousels ***/ .swiper-button-next, .swiper-button-prev { background: #333333; color: #ffffff; } .swiper-pagination-bullet { background: #333333; } /*** Product miniature ***/ .products.row { margin: 0rem; } .products.row > .col, .products.row > [class*="col-"] { padding: 0rem; } .swiper-container-wrapper { margin: 0rem; } .swiper-container-wrapper .products.swiper-container { padding: 0rem; } .swiper-container-wrapper .product-carousel { padding: 0rem; } .swiper-products-carousel.swiper-arrows-above .swiper-button { margin: 0rem; } .product-miniature { border: none 1px; outline: 1px none transparent; } .product-miniature-grid { padding: 1.0714285714rem; } .product-miniature-grid .product-title { font-size: 1rem; font-style: normal; font-weight: normal; text-transform: none; } .product-miniature-grid .product-price { font-size: 1.5rem; font-style: normal; font-weight: bold; text-transform: none; } @media (hover: hover) { .product-miniature:hover { outline: none 1px; background: #ffffff; color: #000000; } .product-miniature:hover a:link:not(.nav-link):not(.btn), .product-miniature:hover a:visited:not(.nav-link):not(.btn) { color: #000000; } .product-miniature:hover .product-price { color: #000000; } .product-miniature:hover .iqit-review-star { color: #000000; } } .product-miniature-grid .product-functional-buttons { display: none; } .product-miniature-grid .product-functional-buttons a:link, .product-miniature-grid .product-functional-buttons a:visited, .product-miniature-grid .product-functional-buttons a:hover { color: !important; } .products-grid .product-miniature .product-category-name { display: none !important; } .products-grid .product-miniature .product-description-short { display: none !important; } .products-grid .product-miniature .flag-discount-value { display: none !important; } .btn-product-list { padding: 0.5357142857rem 1.0714285714rem; background: black; color: #ffffff; border: none 1px; } .btn-product-list:hover { background: #ffffff; color: #000000; } .products-grid .product-miniature-default { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: column; flex-flow: column; } .products-grid .product-miniature-default .product-description { -webkit-box-flex: auto; -ms-flex: auto; flex: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-flow: column; flex-flow: column; } .products-grid .product-add-cart { margin: auto auto 0 auto; } .product-carousel { height: 100%; } .products.swiper-container .swiper-slide { height: auto; } .products-grid .product-miniature-layout-1 .product-description { padding: 0.7142857143rem; } .products-grid .product-miniature-layout-2 .product-description { padding: 0.7142857143rem; } .products-grid .product-miniature-layout-3 .product-description { background: rgba(40, 44, 51, 0.93); } .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-rows: 1fr; grid-auto-rows: 0; display: grid; overflow-y: hidden; } .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(1, 1fr); } @media (min-width: 768px) { .layout-full-width .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(2, 1fr); } .layout-left-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper, .layout-right-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(1, 1fr); } } @media (min-width: 992px) { .layout-full-width .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(4, 1fr); } .layout-left-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper, .layout-right-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(3, 1fr); } } @media (min-width: 1200px) { .layout-full-width .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(5, 1fr); } .layout-left-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper, .layout-right-column .swiper-default-carousel:not(.swiper-container-initialized) .swiper-wrapper { grid-template-columns: repeat(4, 1fr); } } .product_header_container .product-price, .product_p_price_container .product-price { font-size: 1.2857142857rem; font-style: normal; font-weight: bold; text-transform: none; } #product .images-container .product-cover { border: none 1px; } .images-container .swiper-button-arrow, #product .product-cover .expander > span, #product-modal .modal-body .swiper-button-arrow { color: #484848; background: rgba(0, 0, 0, 0); } .images-container .swiper-button-arrow:hover, #product .product-cover .expander > span:hover, #product-modal .modal-body .swiper-button-arrow:hover { opacity: 0.6 !important; } #product .product-cover .expander { color: #484848; background: rgba(0, 0, 0, 0); } #product .product-cover .expander:hover { opacity: 0.6 !important; } @media screen and (max-width: 768px) { .col-left-product-cover, .col-left-product-thumbs { flex: 0 0 100%; max-width: 100%; } .col-left-product-thumbs { order: 2; margin-top: 2rem; } } #wrapper { border-top: none 1px; border-bottom: none 1px; padding-top: 1.0714285714rem; padding-bottom: 1.0714285714rem; color: #777777; } #index #wrapper, #module-iqitelementor-Preview.elementor-landing-body #wrapper { padding-top: 1.4285714286rem; padding-bottom: 1.4285714286rem; } #content-wrapper .page-title { color: #333333; font-size: 1.5714285714rem; font-style: normal; font-weight: bold; text-transform: none; border-bottom: solid 1px #e3e3e3; margin-bottom: 0.8em; padding-bottom: 0.5em; } #content-wrapper .page-title a:link, #content-wrapper .page-title a:visited { color: #333333; } #content-wrapper .section-title { color: #333333; font-size: 1.1428571429rem; font-style: normal; font-weight: bold; text-transform: none; border-bottom: solid 1px #e3e3e3; margin-bottom: 0.8em; padding-bottom: 0.5em; } #content-wrapper .section-title a:link, #content-wrapper .section-title a:visited { color: #333333; } .nav-tabs .nav-link { color: #000000; font-size: 1.1428571429rem; font-style: normal; font-weight: bold; text-transform: none; } .nav-tabs .nav-link.active, .nav-tabs .nav-link:hover, .nav-tabs .nav-link:focus { color: #000000; border-bottom: solid 3px #ca5058; } .iqit-accordion .title { font-style: normal; font-weight: normal; text-transform: none; } .iqit-accordion .nav-link { border-bottom: solid 3px #ca5058; border-bottom-color: transparent; } .iqit-accordion .nav-link:not(.collapsed) { color: #000000; border-bottom: solid 3px #ca5058; } #wrapper .block-title { color: #333333; font-size: 1rem; font-style: normal; font-weight: bold; text-transform: none; border-bottom: solid 1px #e3e3e3; margin-bottom: 0.8em; padding-bottom: 0.5em; } #wrapper .block-title a:link, #wrapper .block-title a:visited { color: #333333; } #left-column .block, #right-column .block { border: none 1px; } #footer, #checkout-footer { background: #fafafa; } #footer .ps-emailsubscription-block .newsletter-input-group, #checkout-footer .ps-emailsubscription-block .newsletter-input-group { border: solid 1px #e3e3e3; background: #ffffff; } #footer .ps-emailsubscription-block .newsletter-input-group .input-subscription, #checkout-footer .ps-emailsubscription-block .newsletter-input-group .input-subscription { color: #2c2c2c; } #footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe, #checkout-footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe { color: #2c2c2c; } #footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe:hover, #checkout-footer .ps-emailsubscription-block .newsletter-input-group .btn-subscribe:hover { color: #bd4e0f; } #footer .ps-emailsubscription-block input.input-subscription::-webkit-input-placeholder, #checkout-footer .ps-emailsubscription-block input.input-subscription::-webkit-input-placeholder { color: #2c2c2c; } #footer .ps-emailsubscription-block input.input-subscription::-moz-placeholder, #checkout-footer .ps-emailsubscription-block input.input-subscription::-moz-placeholder { color: #2c2c2c; } #footer .ps-emailsubscription-block input.input-subscription:-ms-input-placeholder, #checkout-footer .ps-emailsubscription-block input.input-subscription:-ms-input-placeholder { color: #2c2c2c; } #footer .ps-emailsubscription-block input.input-subscription :-moz-placeholder, #checkout-footer .ps-emailsubscription-block input.input-subscription :-moz-placeholder { color: #2c2c2c; } #footer .social-links._footer, #checkout-footer .social-links._footer { font-size: 3.4285714286rem; } #footer .social-links._footer a:not(:hover), #checkout-footer .social-links._footer a:not(:hover) { color: #777777 !important; } #footer .social-links._footer a:hover, #checkout-footer .social-links._footer a:hover { color: #f36600 !important; } #footer .block-title, #checkout-footer .block-title { color: #2c2c2c; font-size: 1rem; font-style: normal; font-weight: bold; text-transform: none; border-bottom: solid 1px #e3e3e3; margin-bottom: 0.8em; padding-bottom: 0.5em; } #footer .block-title a:link, #footer .block-title a:visited, #checkout-footer .block-title a:link, #checkout-footer .block-title a:visited { color: #2c2c2c; } #footer-container-first { border-top: none 1px; padding-top: 2.1428571429rem; padding-bottom: 2.1428571429rem; background: #212121; color: #ffffff; } #footer-container-first h5 { font-size: 1.5rem; font-style: normal; font-weight: bold; text-transform: none; } #footer-container-main, #checkout-footer { border-top: none 1px; padding-top: 2.8571428571rem; padding-bottom: 1.8571428571rem; color: #2c2c2c; } #footer-container-main a, #checkout-footer a { color: #2c2c2c; } #footer-container-main a:hover, #checkout-footer a:hover { color: #2c2c2c; } #footer-copyrights { border-top: none 1px; background: #ffffff; padding-top: 1.0714285714rem; padding-bottom: 1.0714285714rem; } @media (max-width: 767px) { #footer .block-toggle { width: 100%; flex-basis: initial; } #footer .block-toggle > .block-title { cursor: pointer; } #footer .block-toggle > .block-title span::after { display: inline-block; font: normal normal normal 14px/1 FontAwesome; font-size: inherit; text-rendering: auto; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; content: ""; margin-left: 10px; } #footer .block-toggle > .block-content { display: none; } #footer .block-toggle._toggled > .block-content { display: block; } #footer .block-toggle._toggled .block-title span::after { content: ""; } #footer .footer-style-inline .block-title { display: block !important; max-width: 100%; } #footer .footer-style-inline .block-content { display: block; width: 100%; margin-top: 1rem; } } #maintenance-page { background: #e3e3e3; color: #333333; } #maintenance-page a, #maintenance-page a:link { color: #333333; } /* ================================ HEADER - HOVER ICONOS Llamada / Perfil / Carrito ================================ */ #header a, .header-nav a, .header-icons a, .user-info a, #_desktop_user_info a, #_desktop_cart a, .ps-shoppingcart a, .header-contact a { transition: transform 0.22s ease, color 0.22s ease, opacity 0.22s ease, box-shadow 0.22s ease !important; } #header a:hover, .header-nav a:hover, .header-icons a:hover, .user-info a:hover, #_desktop_user_info a:hover, #_desktop_cart a:hover, .ps-shoppingcart a:hover, .header-contact a:hover { transform: translateY(-2px); } #header a i, .header-nav a i, .header-icons a i, .user-info a i, #_desktop_user_info a i, #_desktop_cart a i, .ps-shoppingcart a i, .header-contact a i { transition: color 0.22s ease, transform 0.22s ease, text-shadow 0.22s ease !important; } #header a:hover i, .header-nav a:hover i, .header-icons a:hover i, .user-info a:hover i, #_desktop_user_info a:hover i, #_desktop_cart a:hover i, .ps-shoppingcart a:hover i, .header-contact a:hover i { color: #337ff1 !important; transform: scale(1.08); text-shadow: 0 0 12px rgba(51,127,241,0.22); } #_desktop_cart a:hover, .ps-shoppingcart a:hover { box-shadow: 0 8px 18px rgba(51,127,241,0.10); border-radius: 8px; } .ps-shoppingcart.dropdown #blockcart-content { z-index: 1000; } /* ================================ HEADER - HOVER ESPECÍFICO Teléfono / Perfil / Carrito ================================ */ #_desktop_user_info a, #_desktop_cart a, .ps-shoppingcart a, #header [href^="tel:"], #header [href^="tel:"] * { transition: transform 0.22s ease, color 0.22s ease, opacity 0.22s ease, box-shadow 0.22s ease, text-shadow 0.22s ease !important; } #_desktop_user_info a:hover, #_desktop_cart a:hover, .ps-shoppingcart a:hover, #header [href^="tel:"]:hover, #header [href^="tel:"]:hover * { color: #337ff1 !important; transform: translateY(-2px); opacity: 0.92; } #_desktop_user_info a i, #_desktop_cart a i, .ps-shoppingcart a i { transition: color 0.22s ease, transform 0.22s ease, text-shadow 0.22s ease !important; } #_desktop_user_info a:hover i, #_desktop_cart a:hover i, .ps-shoppingcart a:hover i { color: #337ff1 !important; transform: scale(1.08); text-shadow: 0 0 12px rgba(51,127,241,0.22); } #header [href^="tel:"]:hover, #header [href^="tel:"]:hover * { text-shadow: 0 0 12px rgba(51,127,241,0.22); transform: translateY(-2px) scale(1.05); } /* ================================ HEADER - BUSCADOR TODO TELECOM Reducido 5% ================================ */ #search_widget, .search-widget, .header-search, #desktop_search_widget { width: 95% !important; max-width: 95% !important; } #search_widget input, .search-widget input, .header-search input, #desktop_search_widget input { border: 2px solid #dbe4ee !important; border-radius: 10px !important; background: #ffffff !important; box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important; transition: border-color 0.25s ease, box-shadow 0.25s ease !important; } #search_widget input:hover, .search-widget input:hover, .header-search input:hover, #desktop_search_widget input:hover { border-color: #b7c7da !important; } #search_widget input:focus, .search-widget input:focus, #desktop_search_widget input:focus, .header-search input:focus { border-color: #337ff1 !important; box-shadow: 0 0 0 4px rgba(51,127,241,0.12), 0 4px 14px rgba(0,0,0,0.08) !important; outline: none !important; } /* ================================ CMS - OPORTUNIDADES ================================ */ .cms-id-32 h1.page-title { display: none !important; } .cms-id-32 #wrapper { background: #eff8ff; } /* ================================ ACCESOS RÁPIDOS MOBILE / TABLET Oportunidades / Reacondicionados ================================ */ @media (max-width: 991px) { #iqitmegamenu-mobile a[href*="32-oportunidades-de-la-semana"], #mobile_menu a[href*="32-oportunidades-de-la-semana"], .cbp-vertical-on-top a[href*="32-oportunidades-de-la-semana"], .cbp-mobile-menu a[href*="32-oportunidades-de-la-semana"], #iqitmegamenu-mobile a[href*="reacondicionados"], #mobile_menu a[href*="reacondicionados"], .cbp-vertical-on-top a[href*="reacondicionados"], .cbp-mobile-menu a[href*="reacondicionados"] { display: flex !important; align-items: center !important; width: calc(100% - 20px) !important; min-height: 44px !important; margin: 6px 10px !important; padding: 11px 14px !important; box-sizing: border-box !important; border-radius: 9px !important; font-family: 'Roboto', Arial, sans-serif !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.2 !important; text-decoration: none !important; text-transform: uppercase !important; white-space: normal !important; box-shadow: none !important; transform: none !important; } #iqitmegamenu-mobile a[href*="32-oportunidades-de-la-semana"], #mobile_menu a[href*="32-oportunidades-de-la-semana"], .cbp-vertical-on-top a[href*="32-oportunidades-de-la-semana"], .cbp-mobile-menu a[href*="32-oportunidades-de-la-semana"] { background: #2639a8 !important; color: #ffffff !important; border-left: 4px solid #ffb000 !important; } #iqitmegamenu-mobile a[href*="reacondicionados"], #mobile_menu a[href*="reacondicionados"], .cbp-vertical-on-top a[href*="reacondicionados"], .cbp-mobile-menu a[href*="reacondicionados"] { background: #dcffdf !important; color: #008f3a !important; border-left: 4px solid #008f3a !important; } #iqitmegamenu-mobile a[href*="32-oportunidades-de-la-semana"]:hover, #mobile_menu a[href*="32-oportunidades-de-la-semana"]:hover, #iqitmegamenu-mobile a[href*="reacondicionados"]:hover, #mobile_menu a[href*="reacondicionados"]:hover { opacity: 0.92 !important; transform: none !important; } } /* ================================ ACCESOS RÁPIDOS DESKTOP Oportunidades / Reacondicionados ================================ */ @media (min-width: 1501px) { .cbp-horizontal > ul > li > a[href*="32-oportunidades-de-la-semana"], .cbp-horizontal > ul > li > a[href*="reacondicionados"] { background: transparent !important; font-family: 'Roboto', Arial, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; height: 32px !important; line-height: 32px !important; padding: 0 9px !important; margin: 0 4px !important; border-left: 0 !important; border-radius: 0 !important; box-shadow: none !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; gap: 5px !important; white-space: nowrap !important; box-sizing: border-box !important; border-bottom: 3px solid transparent !important; text-decoration: none !important; transition: transform 0.22s ease, opacity 0.22s ease, color 0.22s ease, border-color 0.22s ease !important; } .cbp-horizontal > ul > li > a[href*="32-oportunidades-de-la-semana"] span, .cbp-horizontal > ul > li > a[href*="reacondicionados"] span { font-family: 'Roboto', Arial, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; line-height: 32px !important; } .cbp-horizontal > ul > li > a[href*="32-oportunidades-de-la-semana"] i, .cbp-horizontal > ul > li > a[href*="reacondicionados"] i { font-family: "FontAwesome" !important; font-size: 15px !important; line-height: 32px !important; margin-right: 2px !important; } .cbp-horizontal > ul > li > a[href*="32-oportunidades-de-la-semana"] { color: #2438a8 !important; border-bottom-color: #ffb000 !important; } .cbp-horizontal > ul > li > a[href*="reacondicionados"] { color: #008f3a !important; border-bottom-color: #008f3a !important; } .cbp-horizontal > ul > li > a[href*="reacondicionados"] i { color: #008f3a !important; } .cbp-horizontal > ul > li > a[href*="32-oportunidades-de-la-semana"]:hover, .cbp-horizontal > ul > li > a[href*="reacondicionados"]:hover { background: transparent !important; opacity: 0.78 !important; transform: translateY(-2px) !important; } } /* ================================ ESTILO MARCAS / PROMOS / OFERTAS ================================ */ @media (min-width: 992px) { .cbp-hrmenu-tab-1 > a, .cbp-hrmenu-tab-2 > a, .cbp-hrmenu-tab-3 > a { background: transparent !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; font-family: 'Roboto', Arial, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; height: 32px !important; line-height: 32px !important; min-height: 32px !important; max-height: 32px !important; padding: 0 9px !important; margin: 0 4px !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; white-space: nowrap !important; text-decoration: none !important; color: #2c2c2c !important; border-bottom: 3px solid #337ff1 !important; transition: transform 0.22s ease, opacity 0.22s ease, color 0.22s ease, border-color 0.22s ease !important; } .cbp-hrmenu-tab-1 > a span, .cbp-hrmenu-tab-2 > a span, .cbp-hrmenu-tab-3 > a span { font-family: 'Roboto', Arial, sans-serif !important; font-size: 17px !important; font-weight: 800 !important; line-height: 32px !important; } .cbp-hrmenu-tab-1 > a i, .cbp-hrmenu-tab-2 > a i, .cbp-hrmenu-tab-3 > a i { font-family: "FontAwesome" !important; font-size: 15px !important; line-height: 1 !important; margin-right: 4px !important; position: relative !important; top: -1px !important; } .cbp-hrmenu-tab-1 > a:hover, .cbp-hrmenu-tab-2 > a:hover, .cbp-hrmenu-tab-3 > a:hover { color: #337ff1 !important; opacity: 0.82 !important; transform: translateY(-2px) !important; } } /* ================================ OCULTAR ACCESOS RÁPIDOS DESKTOP NO AMPLIO ================================ */ @media (min-width: 992px) and (max-width: 1500px) { #iqitmegamenu a[href*="32-oportunidades-de-la-semana"], #iqitmegamenu a[href*="reacondicionados"], .cbp-horizontal a[href*="32-oportunidades-de-la-semana"], .cbp-horizontal a[href*="reacondicionados"] { display: none !important; } } /* ================================ CUSTOM - VIDEO MODAL IQIT ================================ */ #iqit-iqitvideos-modal .modal-dialog { max-width: 860px; width: 90%; } #iqit-iqitvideos-modal .modal-body { padding: 0; position: relative; background: #000; } #iqit-iqitvideos-modal iframe { display: block; width: 100% !important; aspect-ratio: 16 / 9; height: auto !important; } #iqit-iqitvideos-modal .modal-content { border-radius: 8px; overflow: hidden; box-shadow: 0 18px 45px rgba(0, 0, 0, 0.28); } #iqit-iqitvideos-modal .modal-header { padding: 12px 18px; border-bottom: none; } #iqit-iqitvideos-modal .close { font-size: 26px; line-height: 1; opacity: 0.75; } #iqit-iqitvideos-modal .close:hover { opacity: 1; } /* ================================ CUSTOM - IQITEXTENDEDPRODUCT MP4 SELF-HOSTED ================================ */ #iqit-iqitvideos-modal video, #iqit-iqitvideos-modal .modal-body video, .iqitvideos-block video, .iqitvideo video { display: block !important; width: 100% !important; max-width: 100% !important; height: auto !important; aspect-ratio: 16 / 9; background: #000; } /* ================================ PLAY OVERLAY SOLO PARA MP4 SELF-HOSTED ================================ */ #iqit-iqitvideos-modal .modal-body.tt-has-native-video::after { content: '▶'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 88px; height: 88px; border-radius: 50%; background: rgba(0,0,0,0.45); color: #ffffff; font-size: 42px; font-weight: 700; display: flex; align-items: center; justify-content: center; pointer-events: none; z-index: 20; backdrop-filter: blur(3px); box-shadow: 0 10px 30px rgba(0,0,0,0.35); } #iqit-iqitvideos-modal .modal-body.tt-has-native-video.tt-video-playing::after { display: none !important; } /* ================================ PRODUCTOS - HOVER PREMIUM TODO TELECOM Home + categorías + relacionados + productos de misma categoría ================================ */ @media (min-width: 992px) { body#index .product-miniature, body#index .js-product-miniature, body#category .product-miniature, body.category .product-miniature, body#category .js-product-miniature, body.category .js-product-miniature, body#product #relatedproducts .product-miniature, body#product #relatedproducts .js-product-miniature, body#product .product-accessories .product-miniature, body#product .product-accessories .js-product-miniature, body#product .category-products .product-miniature, body#product .category-products .js-product-miniature { position: relative !important; border-radius: 12px !important; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease, background-color 0.22s ease !important; } body#index .product-miniature:hover, body#index .js-product-miniature:hover, body#category .product-miniature:hover, body.category .product-miniature:hover, body#category .js-product-miniature:hover, body.category .js-product-miniature:hover, body#product #relatedproducts .product-miniature:hover, body#product #relatedproducts .js-product-miniature:hover, body#product .product-accessories .product-miniature:hover, body#product .product-accessories .js-product-miniature:hover, body#product .category-products .product-miniature:hover, body#product .category-products .js-product-miniature:hover { transform: translateY(-3px) !important; background: #ffffff !important; box-shadow: 0 12px 30px rgba(0,0,0,0.08) !important; border-color: rgba(0,47,135,0.18) !important; z-index: 8 !important; } body#index .product-miniature .thumbnail-container, body#index .js-product-miniature .thumbnail-container, body#category .product-miniature .thumbnail-container, body.category .product-miniature .thumbnail-container, body#category .js-product-miniature .thumbnail-container, body.category .js-product-miniature .thumbnail-container, body#product #relatedproducts .product-miniature .thumbnail-container, body#product #relatedproducts .js-product-miniature .thumbnail-container, body#product .product-accessories .product-miniature .thumbnail-container, body#product .product-accessories .js-product-miniature .thumbnail-container, body#product .category-products .product-miniature .thumbnail-container, body#product .category-products .js-product-miniature .thumbnail-container { border-radius: 12px !important; overflow: visible !important; transition: transform 0.22s ease, filter 0.22s ease !important; } body#index .product-miniature:hover .thumbnail-container, body#index .js-product-miniature:hover .thumbnail-container, body#category .product-miniature:hover .thumbnail-container, body.category .product-miniature:hover .thumbnail-container, body#category .js-product-miniature:hover .thumbnail-container, body.category .js-product-miniature:hover .thumbnail-container, body#product #relatedproducts .product-miniature:hover .thumbnail-container, body#product #relatedproducts .js-product-miniature:hover .thumbnail-container, body#product .product-accessories .product-miniature:hover .thumbnail-container, body#product .product-accessories .js-product-miniature:hover .thumbnail-container, body#product .category-products .product-miniature:hover .thumbnail-container, body#product .category-products .js-product-miniature:hover .thumbnail-container { box-shadow: none !important; } body#index .product-miniature img, body#index .js-product-miniature img, body#category .product-miniature img, body.category .product-miniature img, body#category .js-product-miniature img, body.category .js-product-miniature img, body#product #relatedproducts .product-miniature img, body#product #relatedproducts .js-product-miniature img, body#product .product-accessories .product-miniature img, body#product .product-accessories .js-product-miniature img, body#product .category-products .product-miniature img, body#product .category-products .js-product-miniature img { transition: transform 0.25s ease, filter 0.25s ease !important; } body#index .product-miniature:hover img, body#index .js-product-miniature:hover img, body#category .product-miniature:hover img, body.category .product-miniature:hover img, body#category .js-product-miniature:hover img, body.category .js-product-miniature:hover img, body#product #relatedproducts .product-miniature:hover img, body#product #relatedproducts .js-product-miniature:hover img, body#product .product-accessories .product-miniature:hover img, body#product .product-accessories .js-product-miniature:hover img, body#product .category-products .product-miniature:hover img, body#product .category-products .js-product-miniature:hover img { transform: scale(1.04) !important; filter: saturate(1.03) contrast(1.02); } body#index .product-miniature:hover .product-title a, body#index .js-product-miniature:hover .product-title a, body#category .product-miniature:hover .product-title a, body.category .product-miniature:hover .product-title a, body#category .js-product-miniature:hover .product-title a, body.category .js-product-miniature:hover .product-title a, body#product #relatedproducts .product-miniature:hover .product-title a, body#product #relatedproducts .js-product-miniature:hover .product-title a, body#product .product-accessories .product-miniature:hover .product-title a, body#product .product-accessories .js-product-miniature:hover .product-title a, body#product .category-products .product-miniature:hover .product-title a, body#product .category-products .js-product-miniature:hover .product-title a { color: #002f87 !important; } } /* ================================ PRODUCTO - PRODUCTOS RELACIONADOS Scroll interno compacto TodoTelecom ================================ */ @media (min-width: 992px) { body#product #relatedproducts { position: relative !important; margin-top: 18px !important; } body#product #relatedproducts .products, body#product #relatedproducts .product_list, body#product #relatedproducts .slick-list, body#product #relatedproducts .swiper, body#product #relatedproducts .swiper-container, body#product #relatedproducts .owl-stage-outer { max-height: 278px !important; overflow-y: auto !important; overflow-x: hidden !important; padding-right: 8px !important; scroll-behavior: smooth !important; } body#product #relatedproducts .products::-webkit-scrollbar, body#product #relatedproducts .product_list::-webkit-scrollbar, body#product #relatedproducts .slick-list::-webkit-scrollbar, body#product #relatedproducts .swiper::-webkit-scrollbar, body#product #relatedproducts .swiper-container::-webkit-scrollbar, body#product #relatedproducts .owl-stage-outer::-webkit-scrollbar { width: 6px !important; } body#product #relatedproducts .products::-webkit-scrollbar-track, body#product #relatedproducts .product_list::-webkit-scrollbar-track, body#product #relatedproducts .slick-list::-webkit-scrollbar-track, body#product #relatedproducts .swiper::-webkit-scrollbar-track, body#product #relatedproducts .swiper-container::-webkit-scrollbar-track, body#product #relatedproducts .owl-stage-outer::-webkit-scrollbar-track { background: #f1f5f9 !important; border-radius: 10px !important; } body#product #relatedproducts .products::-webkit-scrollbar-thumb, body#product #relatedproducts .product_list::-webkit-scrollbar-thumb, body#product #relatedproducts .slick-list::-webkit-scrollbar-thumb, body#product #relatedproducts .swiper::-webkit-scrollbar-thumb, body#product #relatedproducts .swiper-container::-webkit-scrollbar-thumb, body#product #relatedproducts .owl-stage-outer::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 10px !important; } body#product #relatedproducts .products::-webkit-scrollbar-thumb:hover, body#product #relatedproducts .product_list::-webkit-scrollbar-thumb:hover, body#product #relatedproducts .slick-list::-webkit-scrollbar-thumb:hover, body#product #relatedproducts .swiper::-webkit-scrollbar-thumb:hover, body#product #relatedproducts .swiper-container::-webkit-scrollbar-thumb:hover, body#product #relatedproducts .owl-stage-outer::-webkit-scrollbar-thumb:hover { background: #94a3b8 !important; } body#product #relatedproducts .product-miniature, body#product #relatedproducts .js-product-miniature { margin-bottom: 14px !important; } body#product #relatedproducts .product-miniature:last-child, body#product #relatedproducts .js-product-miniature:last-child { margin-bottom: 0 !important; } } /* ================================ PRODUCTO - PRODUCTOS RELACIONADOS Hover botones Comprar / Pedir / Consultar ================================ */ body#product #relatedproducts .btn-product-list { transition: background-color .18s ease, border-color .18s ease, color .18s ease, box-shadow .18s ease !important; } body#product #relatedproducts .btn-product-list:hover, body#product #relatedproducts .btn-product-list:focus { background: #f36600 !important; border-color: #f36600 !important; color: #ffffff !important; box-shadow: none !important; } body#product #relatedproducts .btn-product-list:hover span, body#product #relatedproducts .btn-product-list:focus span { color: #ffffff !important; } body#product #relatedproducts .btn-product-list:hover svg, body#product #relatedproducts .btn-product-list:focus svg { color: #ffffff !important; fill: none !important; } body#product #relatedproducts .btn-product-list:hover svg path, body#product #relatedproducts .btn-product-list:focus svg path { stroke: #ffffff !important; } /* ========================================================== TODO TELECOM - PRODUCTO SUSTITUTO RECOMENDADO Sustituye visualmente el bloque de precio Desktop / Tablet / Mobile ========================================================== */ /* ========================================================== EVITAR FLASH DEL PRECIO ORIGINAL Solo cuando coinciden: - producto descatalogado - producto sustituto ========================================================== */ body#product:has(.btn-sustituto) .product-prices-inner { visibility: hidden; } /* Una vez activada la tarjeta, eliminamos el precio original del layout */ body#product.tt-sustituto-active .product-prices-inner { display: none !important; } /* Si el JS falla recuperamos el precio */ body#product:has(.btn-sustituto.tt-sustituto-fallback) .product-prices-inner { visibility: visible !important; } /* Oculta la antigua zona donde estaba el botón Sustituto */ .tt-sustituto-source-hidden { display: none !important; } /* ========================================================== TARJETA ========================================================== */ .tt-sustituto-card { width: 100%; max-width: 100%; margin: 12px 0 18px; background: #fff; border: 1px solid #dfe5ea; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 7px rgba(0, 0, 0, .05); box-sizing: border-box; } /* CABECERA */ .tt-sustituto-title { padding: 11px 16px; background: #f7f9fa; border-bottom: 1px solid #e5e9ec; font-size: 15px; line-height: 20px; font-weight: 700; color: #333; } /* PRODUCTO / ENLACE COMPLETO */ .tt-sustituto-product { position: relative; display: flex; align-items: center; gap: 16px; width: 100%; min-height: 105px; padding: 14px 18px; background: #fff; text-decoration: none !important; box-sizing: border-box; transition: background-color .2s ease; } /* Barra corporativa lateral */ .tt-sustituto-product::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 5px; background: #00a3d9; } .tt-sustituto-product:hover { background: #f7fcfe; text-decoration: none !important; } /* ========================================================== IMAGEN ========================================================== */ .tt-sustituto-image { width: 90px; height: 78px; flex: 0 0 90px; display: flex; align-items: center; justify-content: center; } .tt-sustituto-image img { display: block; max-width: 100%; max-height: 78px; width: auto; height: auto; object-fit: contain; } /* ========================================================== INFORMACIÓN ========================================================== */ .tt-sustituto-info { flex: 1; min-width: 0; } .tt-sustituto-model { margin-bottom: 5px; font-size: 16px; line-height: 21px; font-weight: 700; color: #222; overflow-wrap: anywhere; } .tt-sustituto-reference { display: inline-block; max-width: 100%; margin: 0 0 6px; padding: 3px 7px; background: #f2f4f5; border-radius: 4px; font-size: 11px; line-height: 15px; font-weight: 600; color: #6d7479; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .tt-sustituto-description { margin-bottom: 6px; font-size: 13px; line-height: 18px; color: #777; overflow-wrap: anywhere; } .tt-sustituto-link { font-size: 13px; line-height: 18px; font-weight: 700; color: #00a3d9; } /* ========================================================== FLECHA ========================================================== */ .tt-sustituto-arrow { flex: 0 0 auto; padding-left: 8px; font-size: 31px; line-height: 1; font-weight: 300; color: #00a3d9; transition: transform .2s ease; } .tt-sustituto-product:hover .tt-sustituto-arrow { transform: translateX(4px); } /* ========================================================== BOTÓN ORIGINAL ========================================================== */ .btn-sustituto { visibility: hidden; } .btn-sustituto.tt-sustituto-fallback { visibility: visible; } /* ========================================================== SKELETON DE CARGA Reserva espacio y evita saltos visuales ========================================================== */ .tt-sustituto-loading .tt-sustituto-product { pointer-events: none; } .tt-sustituto-skeleton { background: #eef1f3; border-radius: 4px; animation: tt-sustituto-pulse 1.1s ease-in-out infinite alternate; } .tt-sustituto-skeleton-image { width: 70px; height: 60px; } .tt-sustituto-skeleton-line { width: 72%; height: 12px; margin-bottom: 8px; } .tt-sustituto-skeleton-line.short { width: 40%; height: 10px; margin-bottom: 0; } @keyframes tt-sustituto-pulse { from { opacity: .55; } to { opacity: 1; } } @media (prefers-reduced-motion: reduce) { .tt-sustituto-skeleton { animation: none; } .tt-sustituto-arrow { transition: none; } } /* ========================================================== TABLET / iPAD ========================================================== */ @media (max-width: 1199px) { .tt-sustituto-card { margin: 10px 0 16px; border-radius: 7px; } .tt-sustituto-title { padding: 10px 14px; font-size: 14px; line-height: 19px; } .tt-sustituto-product { gap: 14px; min-height: 96px; padding: 12px 15px; } .tt-sustituto-product::before { width: 4px; } .tt-sustituto-image { width: 78px; height: 70px; flex-basis: 78px; } .tt-sustituto-image img { max-height: 68px; } .tt-sustituto-model { font-size: 14px; line-height: 18px; } .tt-sustituto-reference { padding: 2px 6px; font-size: 10px; line-height: 14px; } .tt-sustituto-description { font-size: 11px; line-height: 15px; } .tt-sustituto-link { font-size: 12px; line-height: 16px; } .tt-sustituto-arrow { padding-left: 4px; font-size: 25px; } } /* ========================================================== MOBILE ========================================================== */ @media (max-width: 767px) { .tt-sustituto-card { margin: 8px 0 14px; border-radius: 6px; } .tt-sustituto-title { padding: 9px 11px; font-size: 12px; line-height: 17px; } .tt-sustituto-product { gap: 9px; min-height: 80px; padding: 9px 10px; } .tt-sustituto-image { width: 58px; height: 58px; flex-basis: 58px; } .tt-sustituto-image img { max-height: 56px; } .tt-sustituto-model { margin-bottom: 3px; font-size: 12px; line-height: 16px; } .tt-sustituto-reference { margin-bottom: 3px; padding: 2px 5px; font-size: 9px; line-height: 12px; white-space: normal; } .tt-sustituto-description { display: none; } .tt-sustituto-link { font-size: 10px; line-height: 14px; } .tt-sustituto-arrow { padding-left: 0; font-size: 21px; } .tt-sustituto-skeleton-image { width: 48px; height: 46px; } } /* ========================================================== TODO TELECOM - SISTEMA DE ETIQUETAS DE PRODUCTO Descatalogado / Reacondicionado / Promoción / Ofertas-Outlet + Descuento en ficha, precio y carrito Sistema unificado: - Misma altura - Misma tipografía - Mismo radio - Misma sombra - Estado arriba - Descuento siempre debajo ========================================================== */ /* ========================================================== BASE COMÚN Altura, tipografía, radio y sombra ========================================================== */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion, .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { display: inline-flex !important; align-items: center !important; justify-content: center !important; height: 30px !important; border-radius: 4px !important; font-size: 14px !important; line-height: 1 !important; font-weight: 800 !important; letter-spacing: .2px !important; text-align: center !important; white-space: nowrap !important; box-shadow: 0 3px 8px rgba(0, 0, 0, .18) !important; opacity: 1 !important; box-sizing: border-box !important; } /* ========================================================== CLASIFICACIÓN DE FLAG-DANGER Evita flash verde antes de que el JS diferencie: - Descatalogado - Reacondicionado ========================================================== */ .product-flags .product-flag.flag-danger:not(.tt-flag-clasificada) { visibility: hidden !important; } /* ========================================================== CONTENEDOR DE ETIQUETAS SOBRE LA IMAGEN Fuerza orden vertical ========================================================== */ .product-flags { display: flex !important; flex-direction: column !important; align-items: flex-start !important; width: auto !important; max-width: 100% !important; } /* ========================================================== ETIQUETAS SOBRE LA IMAGEN Estado arriba + descuento debajo ========================================================== */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion, .product-flags .product-flag.discount { flex: none !important; align-self: flex-start !important; width: auto !important; max-width: calc(100% - 20px); margin-left: 0 !important; margin-right: 0 !important; margin-bottom: 0 !important; z-index: 5; } /* ========================================================== ETIQUETAS DE ESTADO Margen horizontal cómodo alrededor del texto ========================================================== */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion { min-width: 0 !important; padding-left: 15px !important; padding-right: 15px !important; } /* ========================================================== DESCUENTO SOBRE LA IMAGEN Siempre debajo de la etiqueta principal ========================================================== */ .product-flags .product-flag.discount { min-width: 48px !important; padding-left: 8px !important; padding-right: 8px !important; margin-top: 6px !important; z-index: 6; } /* ========================================================== ELIMINAR DECORACIONES HEREDADAS DEL TEMA ========================================================== */ .product-flags .product-flag.tt-descatalogado-fabricante::after, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante)::after, .product-flags .product-flag.on-sale::after, .product-flags .product-flag.flag-promotion::after, .product-flags .product-flag.discount::after { display: none !important; } /* ========================================================== DESCATALOGADO ========================================================== */ .product-flags .product-flag.tt-descatalogado-fabricante { background: #ffdbdb !important; border: 1px solid #f3b3b8 !important; border-left: 4px solid #e30613 !important; color: #7a1f26 !important; text-transform: none !important; } /* ========================================================== DESCATALOGADO - AJUSTE REAL DE ANCHO EN GRID / LISTADOS El problema no era el zoom en sí, sino que .product-flags podía encogerse al ancho de su contenido. Al limitar el contenedor al ancho real de la tarjeta, la etiqueta larga permanece en una línea cuando cabe y salta a dos líneas únicamente cuando de verdad falta espacio. ========================================================== */ /* Limitar el contenedor de flags al ancho disponible de la tarjeta */ .product-miniature .product-flags, .js-product-miniature .product-flags { width: calc(100% - 20px) !important; max-width: calc(100% - 20px) !important; box-sizing: border-box !important; } /* Solo "Descatalogado por el fabricante" puede adaptarse */ .product-miniature .product-flags .product-flag.tt-descatalogado-fabricante, .js-product-miniature .product-flags .product-flag.tt-descatalogado-fabricante { width: max-content !important; max-width: 100% !important; height: auto !important; min-height: 30px !important; justify-content: flex-start !important; text-align: left !important; white-space: normal !important; padding-top: 6px !important; padding-bottom: 6px !important; line-height: 1.15 !important; overflow: hidden !important; overflow-wrap: normal !important; word-break: normal !important; } /* TABLET / iPAD */ @media (max-width: 1199px) { .product-miniature .product-flags .product-flag.tt-descatalogado-fabricante, .js-product-miniature .product-flags .product-flag.tt-descatalogado-fabricante { min-height: 28px !important; padding-top: 5px !important; padding-bottom: 5px !important; } } /* MOBILE */ @media (max-width: 767px) { .product-miniature .product-flags .product-flag.tt-descatalogado-fabricante, .js-product-miniature .product-flags .product-flag.tt-descatalogado-fabricante { min-height: 25px !important; padding-top: 5px !important; padding-bottom: 5px !important; } } /* ========================================================== REACONDICIONADO ========================================================== */ .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante) { background: #e4ffe4 !important; border: 1px solid #bfe8cb !important; color: #078535 !important; text-transform: none !important; } /* ========================================================== PROMOCIÓN ========================================================== */ .product-flags .product-flag.on-sale { background: #eb1c00 !important; border: 0 !important; color: #ffffff !important; text-transform: none !important; } /* ========================================================== OFERTAS - OUTLET ========================================================== */ .product-flags .product-flag.flag-promotion { background: #4899c7 !important; border: 0 !important; color: #ffffff !important; text-transform: none !important; } /* ========================================================== DESCUENTO Imagen + Precio + Carrito ========================================================== */ .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { min-width: 48px !important; padding-left: 8px !important; padding-right: 8px !important; background: #e30613 !important; border: 0 !important; color: #ffffff !important; } /* ========================================================== DESCUENTO EN BLOQUE DE PRECIO ========================================================== */ .col-product-info .product-prices .badge-discount.discount-percentage { width: auto !important; margin: 0 8px 0 0 !important; position: static !important; vertical-align: middle !important; } /* ========================================================== DESCUENTO EN CARRITO ========================================================== */ .cart-item .product-discount .discount-percentage { width: auto !important; margin: 0 7px 0 0 !important; position: static !important; vertical-align: middle !important; } /* ========================================================== TABLET / iPAD ========================================================== */ @media (max-width: 1199px) { /* Base común */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion, .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { height: 28px !important; font-size: 13px !important; } /* Etiquetas principales */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion { padding-left: 12px !important; padding-right: 12px !important; max-width: calc(100% - 14px); } /* Descuento */ .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { min-width: 46px !important; padding-left: 7px !important; padding-right: 7px !important; } } /* ========================================================== MOBILE ========================================================== */ @media (max-width: 767px) { /* Base común */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion, .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { height: 25px !important; border-radius: 3px !important; font-size: 11px !important; box-shadow: 0 2px 5px rgba(0, 0, 0, .15) !important; } /* Etiquetas principales */ .product-flags .product-flag.tt-descatalogado-fabricante, .product-flags .product-flag.flag-danger:not(.tt-descatalogado-fabricante), .product-flags .product-flag.on-sale, .product-flags .product-flag.flag-promotion { padding-left: 10px !important; padding-right: 10px !important; max-width: calc(100% - 10px); } /* Descuento */ .product-flags .product-flag.discount, .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { min-width: 42px !important; padding-left: 6px !important; padding-right: 6px !important; } /* Descatalogado puede necesitar dos líneas */ .product-flags .product-flag.tt-descatalogado-fabricante { height: auto !important; min-height: 25px !important; white-space: normal !important; padding-top: 5px !important; padding-bottom: 5px !important; } /* Separación del descuento en precio/carrito */ .col-product-info .product-prices .badge-discount.discount-percentage, .cart-item .product-discount .discount-percentage { margin-right: 6px !important; } } /* ================================ PRODUCTO - ACCESORIOS MÚLTIPLES PRO Diseño limpio TodoTelecom ================================ */ @media (min-width: 992px) { #multiAccessoriesTab { margin: 14px 0 16px !important; border: 1px solid #e6ebf2 !important; border-radius: 10px !important; background: #ffffff !important; overflow: visible !important; box-shadow: 0 3px 10px rgba(0,0,0,0.035) !important; } #multiAccessoriesTab h3 { margin: 0 !important; padding: 10px 14px !important; background: #f8fafc !important; border-bottom: 1px solid #e6ebf2 !important; border-radius: 10px 10px 0 0 !important; color: #002f87 !important; font-size: 14px !important; font-weight: 800 !important; text-align: center !important; text-transform: uppercase !important; letter-spacing: 0.2px !important; } #multiAccessoriesTab .hsma_block_content { padding: 12px 14px !important; background: #ffffff !important; border-radius: 0 0 10px 10px !important; } #multiAccessoriesTab table, #multiAccessoriesTab tbody, #multiAccessoriesTab tr, #multiAccessoriesTab td { border: 0 !important; } #multiAccessoriesTab table { width: 100% !important; } #multiAccessoriesTab td { vertical-align: middle !important; padding: 6px 8px !important; } #multiAccessoriesTab td:first-child { color: #111827 !important; font-size: 14px !important; font-weight: 700 !important; white-space: nowrap !important; } #multiAccessoriesTab input[type="number"], #multiAccessoriesTab input[type="text"] { min-height: 36px !important; height: 36px !important; border: 1px solid #d7dee8 !important; border-radius: 8px !important; background: #ffffff !important; color: #1f2937 !important; font-size: 14px !important; font-weight: 600 !important; text-align: center !important; box-shadow: none !important; } #multiAccessoriesTab select, #multiAccessoriesTab .form-control, #multiAccessoriesTab .selector { min-height: 38px !important; height: 38px !important; border: 1px solid #d7dee8 !important; border-radius: 8px !important; background: #ffffff !important; color: #374151 !important; font-size: 14px !important; box-shadow: none !important; } #multiAccessoriesTab select { padding: 0 12px !important; } #multiAccessoriesTab select:hover, #multiAccessoriesTab input:hover, #multiAccessoriesTab .form-control:hover, #multiAccessoriesTab .selector:hover { border-color: #b8c7da !important; background: #fbfdff !important; } #multiAccessoriesTab img { border-radius: 6px !important; } } /* ================================ ACCESORIOS MÚLTIPLES PRO Cursor correcto en opciones ================================ */ @media (min-width: 992px) { #multiAccessoriesTab select, #multiAccessoriesTab option, #multiAccessoriesTab .selector, #multiAccessoriesTab .selector span, #multiAccessoriesTab .form-control { cursor: pointer !important; } #multiAccessoriesTab .dd-options, #multiAccessoriesTab .dd-options li, #multiAccessoriesTab .dd-option, #multiAccessoriesTab .dd-option-text, #multiAccessoriesTab .dd-option-image { cursor: pointer !important; } /* Textos no seleccionables del bloque */ #multiAccessoriesTab h3, #multiAccessoriesTab h4, #multiAccessoriesTab .option-row h4, #multiAccessoriesTab td:first-child { cursor: default !important; } } /* ================================ ACCESORIOS MÚLTIPLES PRO Ocultar icono ampliar imagen ================================ */ @media (min-width: 992px) { #multiAccessoriesTab .dropdown-image .fa-expand, #multiAccessoriesTab .accessory_img_product-cover .fa-expand, #multiAccessoriesTab .layer .fa-expand { display: none !important; } } /* ========================================== DIRECCIONES CHECKOUT ESTILO EFECTOLED ========================================== */ body#checkout #checkout-addresses-step .tt-address-line{ display:block !important; width:100% !important; margin:0 0 4px 0 !important; line-height:1.35 !important; white-space:normal !important; } body#checkout #checkout-addresses-step .tt-address-line:first-child{ font-weight:700 !important; } body#checkout #checkout-addresses-step .tt-address-line span{ display:inline-block !important; margin-left:14px !important; color:#555 !important; } body#checkout #checkout-addresses-step .address{ display:block !important; white-space:normal !important; } /* ================================ CHECKOUT - DIRECCIONES COMPACTAS Estilo lista tipo EfectoLED ================================ */ body#checkout #checkout-addresses-step .addresses, body#checkout #checkout-addresses-step .address-selector { display: block !important; width: 100% !important; } body#checkout #checkout-addresses-step .addresses > div, body#checkout #checkout-addresses-step .address-selector > div, body#checkout #checkout-addresses-step .addresses .col-md-6, body#checkout #checkout-addresses-step .address-selector .col-md-6, body#checkout #checkout-addresses-step .addresses .col-lg-6, body#checkout #checkout-addresses-step .address-selector .col-lg-6 { width: 100% !important; max-width: 100% !important; flex: 0 0 100% !important; padding-left: 0 !important; padding-right: 0 !important; } body#checkout #checkout-addresses-step .address-item, body#checkout #checkout-addresses-step .js-address-item { position: relative !important; display: flex !important; align-items: center !important; width: 100% !important; min-height: 76px !important; margin: 0 0 10px 0 !important; padding: 0 !important; border: 1px solid #e4e9f1 !important; border-radius: 6px !important; background: #f6f8fb !important; box-shadow: none !important; overflow: hidden !important; } body#checkout #checkout-addresses-step .address-item.selected, body#checkout #checkout-addresses-step .js-address-item.selected { border-color: #002f87 !important; background: #ffffff !important; box-shadow: 0 0 0 2px rgba(0,47,135,0.06) !important; } /* Columna selector */ body#checkout #checkout-addresses-step .address-item header, body#checkout #checkout-addresses-step .js-address-item header { width: 48px !important; min-width: 48px !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; background: transparent !important; border: 0 !important; } /* Oculta solo el texto del alias junto al radio, NO el selector */ body#checkout #checkout-addresses-step .address-item header label, body#checkout #checkout-addresses-step .js-address-item header label { font-size: 0 !important; color: transparent !important; margin: 0 !important; } body#checkout #checkout-addresses-step .address-item header input, body#checkout #checkout-addresses-step .js-address-item header input, body#checkout #checkout-addresses-step .address-item header .custom-radio, body#checkout #checkout-addresses-step .js-address-item header .custom-radio { display: inline-block !important; visibility: visible !important; opacity: 1 !important; font-size: 14px !important; } /* Datos dirección */ body#checkout #checkout-addresses-step .address { flex: 1 1 auto !important; display: block !important; margin: 0 !important; padding: 10px 150px 10px 10px !important; color: #111827 !important; font-size: 13px !important; line-height: 1.35 !important; text-align: left !important; white-space: normal !important; } body#checkout #checkout-addresses-step .tt-address-line { display: block !important; width: 100% !important; margin: 0 0 4px 0 !important; line-height: 1.35 !important; white-space: normal !important; overflow: hidden !important; text-overflow: ellipsis !important; } body#checkout #checkout-addresses-step .tt-address-line strong { font-weight: 800 !important; } body#checkout #checkout-addresses-step .tt-address-line span { display: inline-block !important; margin-left: 14px !important; color: #555555 !important; font-weight: 500 !important; } /* Acciones */ body#checkout #checkout-addresses-step .address-footer { position: absolute !important; right: 16px !important; top: 50% !important; transform: translateY(-50%) !important; display: flex !important; align-items: center !important; gap: 14px !important; padding: 0 !important; background: transparent !important; border: 0 !important; } body#checkout #checkout-addresses-step .address-footer a { color: #002f87 !important; font-size: 13px !important; font-weight: 800 !important; text-decoration: none !important; } body#checkout #checkout-addresses-step .address-footer a:hover { color: #337ff1 !important; } body#checkout #checkout-addresses-step .add-address a, body#checkout #checkout-addresses-step a[data-link-action="add-address"] { display: inline-flex !important; margin: 10px 0 18px !important; color: #002f87 !important; font-size: 14px !important; font-weight: 800 !important; text-decoration: none !important; } /* Hover direcciones */ body#checkout #checkout-addresses-step .address-item, body#checkout #checkout-addresses-step .js-address-item { transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease; } body#checkout #checkout-addresses-step .address-item:not(.selected):hover, body#checkout #checkout-addresses-step .js-address-item:not(.selected):hover { background: #ffffff !important; border-color: #002f87 !important; box-shadow: 0 0 0 2px rgba(0,47,135,.05) !important; } /* Evitar parpadeo antes de compactar direcciones */ body#checkout #checkout-addresses-step:not(.tt-addresses-ready) .address-selector { opacity: 0 !important; } body#checkout #checkout-addresses-step.tt-addresses-ready .address-selector { opacity: 1 !important; transition: opacity .12s ease !important; } /* ================================ CHECKOUT - DIRECCIONES MOBILE Mantener formato compacto tipo desktop ================================ */ @media (max-width: 768px) { body#checkout #checkout-addresses-step .address-item, body#checkout #checkout-addresses-step .js-address-item { display: flex !important; align-items: flex-start !important; min-height: auto !important; padding: 14px 10px 46px 10px !important; border-radius: 6px !important; } body#checkout #checkout-addresses-step .address-item header, body#checkout #checkout-addresses-step .js-address-item header { width: 22px !important; min-width: 22px !important; padding: 5px 0 0 0 !important; justify-content: center !important; align-items: flex-start !important; border: 0 !important; } body#checkout #checkout-addresses-step .address { flex: 1 1 auto !important; padding: 0 0 0 6px !important; font-size: 12px !important; line-height: 1.32 !important; min-width: 0 !important; } body#checkout #checkout-addresses-step .tt-address-line { display: block !important; white-space: normal !important; overflow: visible !important; text-overflow: unset !important; margin-bottom: 3px !important; } body#checkout #checkout-addresses-step .tt-address-line span { display: inline !important; margin-left: 7px !important; } body#checkout #checkout-addresses-step .address-footer { position: absolute !important; left: 58px !important; right: 10px !important; bottom: 10px !important; top: auto !important; transform: none !important; justify-content: flex-start !important; gap: 14px !important; } body#checkout #checkout-addresses-step .address-footer a { font-size: 12px !important; } } /* ================================ CHECKOUT - MÉTODO DE ENVÍO Diseño compacto estable TodoTelecom ================================ */ body#checkout #checkout-delivery-step .delivery-options { margin-top: 16px !important; } body#checkout #checkout-delivery-step .delivery-option { display: grid !important; grid-template-columns: 34px 1fr !important; align-items: center !important; width: 100% !important; margin: 0 0 10px 0 !important; padding: 10px 12px !important; border: 1px solid #e4e9f1 !important; border-radius: 6px !important; background: #f6f8fb !important; box-shadow: none !important; overflow: hidden !important; } body#checkout #checkout-delivery-step .delivery-option:has(input[type="radio"]:checked) { border-color: #002f87 !important; background: #ffffff !important; box-shadow: 0 0 0 2px rgba(0,47,135,0.06) !important; } /* Radio */ body#checkout #checkout-delivery-step .delivery-option > .col-sm-1 { width: 34px !important; max-width: 34px !important; flex: none !important; padding: 0 !important; display: flex !important; align-items: center !important; justify-content: center !important; } /* Contenedor clicable */ body#checkout #checkout-delivery-step .delivery-option label { width: 100% !important; max-width: 100% !important; margin: 0 !important; padding: 0 !important; cursor: pointer !important; } /* Fila interna real */ body#checkout #checkout-delivery-step .delivery-option label > .row { display: grid !important; grid-template-columns: minmax(230px, 32%) minmax(220px, 1fr) minmax(130px, 18%) !important; align-items: center !important; width: 100% !important; margin: 0 !important; column-gap: 18px !important; } /* Reset columnas Bootstrap internas */ body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-5, body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-4, body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-3, body#checkout #checkout-delivery-step .delivery-option .carrier-hasLogo .col-3, body#checkout #checkout-delivery-step .delivery-option .carrier-name-container { width: auto !important; max-width: none !important; flex: none !important; padding: 0 !important; } /* Logo + nombre */ body#checkout #checkout-delivery-step .carrier-hasLogo { display: grid !important; grid-template-columns: 78px 1fr !important; align-items: center !important; gap: 12px !important; margin: 0 !important; } body#checkout #checkout-delivery-step .carrier-hasLogo img { max-width: 72px !important; max-height: 36px !important; object-fit: contain !important; } body#checkout #checkout-delivery-step .carrier-name { color: #111827 !important; font-size: 14px !important; font-weight: 800 !important; line-height: 1.25 !important; } /* Plazo */ body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-4 { color: #4b5563 !important; font-size: 13px !important; line-height: 1.35 !important; } /* Precio */ body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-3 { text-align: right !important; color: #111827 !important; font-size: 14px !important; font-weight: 800 !important; white-space: nowrap !important; } /* Mobile */ @media (max-width: 768px) { body#checkout #checkout-delivery-step .delivery-option { grid-template-columns: 26px 1fr !important; padding: 12px 10px !important; align-items: flex-start !important; } body#checkout #checkout-delivery-step .delivery-option > .col-sm-1 { width: 26px !important; max-width: 26px !important; padding-top: 8px !important; } body#checkout #checkout-delivery-step .delivery-option label > .row { grid-template-columns: 1fr !important; row-gap: 4px !important; } body#checkout #checkout-delivery-step .carrier-hasLogo { grid-template-columns: 60px 1fr !important; gap: 10px !important; } body#checkout #checkout-delivery-step .carrier-hasLogo img { max-width: 56px !important; max-height: 30px !important; } body#checkout #checkout-delivery-step .carrier-name { font-size: 13px !important; } body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-4, body#checkout #checkout-delivery-step .delivery-option label > .row > .col-sm-3 { font-size: 12px !important; text-align: left !important; } } /* Hover método de envío */ body#checkout #checkout-delivery-step .delivery-option { transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease, transform .18s ease; } body#checkout #checkout-delivery-step .delivery-option:hover { background: #ffffff !important; border-color: #002f87 !important; box-shadow: 0 0 0 2px rgba(0,47,135,.05) !important; } /* ================================ CHECKOUT - RESUMEN PEDIDO FIXED JS ================================ */ @media (min-width: 992px) { body#checkout #js-checkout-summary { background: #ffffff !important; } } /* ================================ REGISTRO PRO - INFO RECARGO EQUIVALENCIA ================================ */ #field-deluxerecargoeq .tt-recargo-info { display: inline-flex !important; align-items: center !important; justify-content: center !important; width: 17px !important; height: 17px !important; margin-left: 7px !important; border-radius: 50% !important; background: #174a9c !important; color: #ffffff !important; font-size: 12px !important; font-weight: 700 !important; cursor: help !important; position: relative !important; vertical-align: middle !important; line-height: 17px !important; } #field-deluxerecargoeq .tt-recargo-info:hover::after, #field-deluxerecargoeq .tt-recargo-info.tt-tooltip-active::after { content: attr(data-tooltip); position: absolute; left: 50%; bottom: 130%; transform: translateX(-50%); width: 310px; max-width: calc(100vw - 32px); background: #1f2937; color: #ffffff; padding: 10px 12px; border-radius: 8px; font-size: 12px; line-height: 1.35; font-weight: 400; z-index: 99999; box-shadow: 0 6px 18px rgba(0,0,0,.18); text-align: left; white-space: normal; } #field-deluxerecargoeq .tt-recargo-info:hover::before, #field-deluxerecargoeq .tt-recargo-info.tt-tooltip-active::before { content: ""; position: absolute; left: 50%; bottom: 112%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #1f2937; z-index: 99999; } /* MOBILE / TABLET */ @media (max-width: 991px) { #field-deluxerecargoeq .tt-recargo-info:hover::after, #field-deluxerecargoeq .tt-recargo-info.tt-tooltip-active::after { position: absolute; left: auto; right: 0; top: 26px; bottom: auto; transform: none; width: 330px; max-width: calc(100vw - 32px); z-index: 999999; } #field-deluxerecargoeq .tt-recargo-info:hover::before, #field-deluxerecargoeq .tt-recargo-info.tt-tooltip-active::before { display: block; left: 50%; top: 18px; bottom: auto; transform: translateX(-50%); border: 6px solid transparent; border-bottom-color: #1f2937; border-top-color: transparent; } }