/* Lightweight Elementor/WooCommerce layer for editable CABLIO templates. */
.cablio-elementor-header {
position: sticky;
top: 0;
z-index: 60;
margin: 16px auto 10px;
border: 1px solid rgba(92, 158, 205, .28);
border-radius: 10px;
background: rgba(2, 9, 16, .92);
backdrop-filter: blur(14px);
}
/* Final CABLIO header layout: one clean desktop bar, tablet/mobile rows only when needed. */
body.cablio-site .cablio-elementor-header.elementor-section {
width: min(1720px, calc(100% - 48px)) !important;
min-height: 0 !important;
margin: 18px auto 12px !important;
padding: 0 !important;
}
body.cablio-site .cablio-elementor-header > .elementor-container {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: space-between !important;
gap: clamp(10px, .9vw, 18px) !important;
width: 100% !important;
min-height: 76px !important;
padding: 12px clamp(18px, 2vw, 28px) !important;
}
body.cablio-site .cablio-elementor-header .elementor-column {
display: flex !important;
flex: 0 0 auto !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-widget-wrap {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-width: 0 !important;
padding: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrlogo {
flex: 0 0 auto !important;
margin-right: clamp(8px, 1.5vw, 24px);
}
body.cablio-site .cablio-elementor-logo .elementor-button {
display: inline-flex !important;
align-items: center !important;
min-height: 44px !important;
padding: 0 !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #fff !important;
font-size: clamp(1.65rem, 2.1vw, 2.35rem) !important;
font-weight: 900 !important;
letter-spacing: -.06em;
white-space: nowrap !important;
}
body.cablio-site .cablio-elementor-logo .elementor-button::after {
content: "";
display: inline-block;
width: 1.05em;
height: 1.05em;
margin-left: .36rem;
border: 0;
border-radius: 11px;
background: url("../img/cablio-mark.png") center / cover no-repeat;
box-shadow: 0 0 18px var(--accent-soft), inset 0 0 14px rgba(255,255,255,.08);
vertical-align: middle;
}
body.cablio-site .cablio-elementor-menu .elementor-button {
min-height: 40px !important;
padding: 8px clamp(7px, .72vw, 12px) !important;
border: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: #fff !important;
font-size: clamp(.72rem, .72vw, .88rem) !important;
font-weight: 900 !important;
letter-spacing: -.02em;
line-height: 1.05 !important;
text-transform: uppercase;
white-space: nowrap !important;
}
body.cablio-site .cablio-elementor-menu .elementor-button-text {
white-space: nowrap !important;
}
body.cablio-site .cablio-elementor-menu .elementor-button:hover {
color: var(--accent-2) !important;
background: rgba(22, 200, 255, .08) !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrsearch {
flex: 1 1 250px !important;
min-width: 210px !important;
max-width: 360px !important;
margin-left: auto;
}
body.cablio-site .cablio-elementor-search,
body.cablio-site .cablio-elementor-search .elementor-widget-container,
body.cablio-site .cablio-elementor-search-form {
width: 100% !important;
}
body.cablio-site .cablio-elementor-search-form {
display: grid !important;
grid-template-columns: minmax(150px, 1fr) auto !important;
gap: 8px !important;
align-items: center !important;
}
body.cablio-site .cablio-elementor-search-form input {
width: 100% !important;
min-width: 0 !important;
min-height: 44px !important;
}
body.cablio-site .cablio-elementor-search-form button,
body.cablio-site .cablio-elementor-header .elementor-menu-cart__toggle_button,
body.cablio-site .cablio-account-pill .elementor-button,
body.cablio-site .cablio-color-pill .theme-switch {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 46px !important;
min-height: 46px !important;
border-radius: 10px !important;
white-space: nowrap !important;
}
body.cablio-site .cablio-account-pill .elementor-button {
padding-inline: 16px !important;
border: 1px solid rgba(120, 169, 210, .34) !important;
color: #fff !important;
background: rgba(255, 255, 255, .055) !important;
box-shadow: none !important;
}
body.cablio-site .cablio-account-pill .elementor-button:hover {
border-color: rgba(22, 200, 255, .58) !important;
background: rgba(22, 200, 255, .12) !important;
color: var(--accent-2) !important;
}
body.cablio-site .cablio-elementor-header .cablio-mobile-nav-html {
display: none !important;
}
body.cablio-site .cablio-mobile-menu-row {
display: flex !important;
flex-wrap: wrap !important;
gap: 8px !important;
width: 100% !important;
}
body.cablio-site main > .elementor > .elementor-section:first-child,
body.cablio-site .cablio-page-hero {
margin-top: clamp(18px, 2vw, 32px) !important;
}
@media (max-width: 1280px) {
body.cablio-site .cablio-elementor-header > .elementor-container {
gap: 8px !important;
padding-inline: 14px !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrsearch {
flex-basis: 210px !important;
max-width: 260px !important;
}
body.cablio-site .cablio-elementor-search-form {
grid-template-columns: minmax(110px, 1fr) auto !important;
}
}
@media (max-width: 1080px) {
body.cablio-site .cablio-elementor-header > .elementor-container {
display: grid !important;
grid-template-columns: minmax(130px, 1fr) auto auto auto !important;
align-items: center !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu1,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu2,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu3,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu4,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu5,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu6 {
display: none !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrlogo {
grid-column: 1 !important;
margin-right: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart,
body.cablio-site .cablio-elementor-header .elementor-element-hdracc,
body.cablio-site .cablio-elementor-header .elementor-element-hdrcolor {
grid-row: 1 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrsearch {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
}
body.cablio-site .cablio-elementor-header .cablio-mobile-nav-html {
display: flex !important;
grid-column: 1 / -1 !important;
grid-row: 3 !important;
width: 100% !important;
}
}
@media (max-width: 640px) {
body.cablio-site .cablio-elementor-header.elementor-section {
width: calc(100% - 16px) !important;
margin: 8px auto 10px !important;
}
body.cablio-site .cablio-elementor-header > .elementor-container {
grid-template-columns: minmax(112px, 1fr) auto auto auto !important;
gap: 8px !important;
min-height: 0 !important;
padding: 10px !important;
}
body.cablio-site .cablio-elementor-logo .elementor-button {
font-size: 1.55rem !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button-text {
font-size: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button-text::before {
content: "K";
font-size: .95rem !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcolor {
grid-column: 4 !important;
}
body.cablio-site .cablio-mobile-menu-row a {
flex: 1 1 calc(50% - 8px) !important;
text-align: center !important;
}
}
/* Polished WooCommerce account controls: edit/save links should feel like CABLIO buttons. */
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content {
overflow: hidden;
}
body.cablio-site.woocommerce-account .cablio-account-dashboard {
display: grid;
gap: 22px;
}
body.cablio-site.woocommerce-account .cablio-account-welcome {
padding: clamp(18px, 2.6vw, 30px);
border: 1px solid rgba(120, 169, 210, .25);
border-radius: 20px;
background:
radial-gradient(circle at 90% 8%, rgba(22, 200, 255, .13), transparent 34%),
linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b));
}
body.cablio-site.woocommerce-account .cablio-account-welcome h2 {
margin: 0 0 10px;
color: #fff;
font-size: clamp(1.7rem, 3vw, 2.6rem);
}
body.cablio-site.woocommerce-account .cablio-account-welcome p:last-child {
max-width: 860px;
margin: 0;
color: #c8ddf2;
line-height: 1.65;
}
body.cablio-site.woocommerce-account .cablio-account-actions {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 14px;
}
body.cablio-site.woocommerce-account .cablio-account-action {
display: grid;
gap: 8px;
min-height: 138px;
padding: 18px;
border: 1px solid rgba(120, 169, 210, .28);
border-radius: 18px;
color: #fff !important;
background:
radial-gradient(circle at 84% 16%, rgba(22, 200, 255, .13), transparent 34%),
rgba(255, 255, 255, .045);
text-decoration: none !important;
transition: border-color .18s ease, transform .18s ease, background .18s ease;
}
body.cablio-site.woocommerce-account .cablio-account-action::before {
content: "";
width: 42px;
height: 42px;
border: 1px solid rgba(22, 200, 255, .38);
border-radius: 14px;
background:
linear-gradient(135deg, var(--accent), var(--accent-deep));
box-shadow: 0 12px 26px var(--accent-soft);
}
body.cablio-site.woocommerce-account .cablio-account-action span {
color: #fff;
font-size: 1.06rem;
font-weight: 900;
}
body.cablio-site.woocommerce-account .cablio-account-action small {
color: #c8ddf2;
line-height: 1.45;
}
body.cablio-site.woocommerce-account .cablio-account-action:hover {
border-color: rgba(22, 200, 255, .62);
background: rgba(22, 200, 255, .09);
transform: translateY(-2px);
}
body.cablio-site.woocommerce-account .cablio-account-help {
display: flex;
gap: 12px;
align-items: center;
justify-content: space-between;
padding: 18px;
border: 1px solid rgba(120, 169, 210, .2);
border-radius: 18px;
background: rgba(255, 255, 255, .035);
}
body.cablio-site.woocommerce-account .cablio-account-help p {
margin: 0;
color: #dbeafe;
font-weight: 800;
}
body.cablio-site.woocommerce-account .cablio-account-secondary-button {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 11px 18px;
border: 1px solid rgba(22, 200, 255, .42);
border-radius: 999px;
color: #fff !important;
background: linear-gradient(135deg, var(--accent), var(--accent-deep));
box-shadow: 0 12px 28px var(--accent-soft);
font-weight: 900;
text-decoration: none !important;
}
body.cablio-site.woocommerce-account .cablio-account-secondary-button.is-muted {
border-color: rgba(120, 169, 210, .28);
background: rgba(255, 255, 255, .06);
box-shadow: none;
}
body.cablio-site.woocommerce-account .woocommerce-Addresses,
body.cablio-site.woocommerce-account .woocommerce-address-fields,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm {
display: grid;
gap: 18px;
}
body.cablio-site.woocommerce-account .woocommerce-Addresses {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
body.cablio-site.woocommerce-account .woocommerce-Address {
width: 100% !important;
float: none !important;
min-width: 0;
padding: clamp(18px, 2.6vw, 28px);
border: 1px solid rgba(120, 169, 210, .28);
border-radius: 20px;
background:
radial-gradient(circle at 85% 15%, rgba(22, 200, 255, .1), transparent 32%),
linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b));
}
body.cablio-site.woocommerce-account .woocommerce-Address-title {
display: flex;
gap: 14px;
align-items: center;
justify-content: space-between;
margin-bottom: 16px;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title h2,
body.cablio-site.woocommerce-account .woocommerce-Address-title h3 {
margin: 0;
color: #fff;
font-size: clamp(1.35rem, 2vw, 1.8rem);
}
body.cablio-site.woocommerce-account .woocommerce-Address address {
margin: 0;
color: #dbeafe;
font-style: normal;
line-height: 1.65;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.edit,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button[type="submit"],
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
display: inline-flex;
align-items: center;
justify-content: center;
min-height: 44px;
padding: 11px 18px !important;
border: 1px solid rgba(22, 200, 255, .42) !important;
border-radius: 999px !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
box-shadow: 0 14px 30px var(--accent-soft);
font-weight: 900 !important;
line-height: 1 !important;
text-decoration: none !important;
text-transform: none !important;
transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.edit:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.button:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button.button:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input.button:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button[type="submit"]:hover,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input[type="submit"]:hover {
filter: brightness(1.08);
transform: translateY(-1px);
box-shadow: 0 18px 38px var(--accent-soft);
}
body.cablio-site.woocommerce-account .woocommerce-address-fields__field-wrapper,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm {
padding: clamp(18px, 2.6vw, 28px);
border: 1px solid rgba(120, 169, 210, .24);
border-radius: 20px;
background: rgba(255, 255, 255, .035);
}
body.cablio-site.woocommerce-account .woocommerce-address-fields p,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm p {
margin-bottom: 14px;
}
body.cablio-site.woocommerce-account .woocommerce-address-fields label,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm label {
color: #fff;
font-weight: 800;
}
body.cablio-site.woocommerce-account .woocommerce-address-fields input,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm input,
body.cablio-site.woocommerce-account .woocommerce-address-fields select,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm select {
width: 100%;
}
@media (max-width: 760px) {
body.cablio-site.woocommerce-account .woocommerce-Addresses {
grid-template-columns: 1fr;
}
body.cablio-site.woocommerce-account .cablio-account-actions {
grid-template-columns: 1fr;
}
body.cablio-site.woocommerce-account .cablio-account-help {
align-items: stretch;
flex-direction: column;
}
body.cablio-site.woocommerce-account .cablio-account-secondary-button {
width: 100%;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title {
align-items: stretch;
flex-direction: column;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.edit,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content a.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input.button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content .woocommerce-Button,
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content button[type="submit"],
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content input[type="submit"] {
width: 100%;
}
}
.cablio-elementor-header .elementor-container {
display: flex;
gap: clamp(8px, 1vw, 18px);
align-items: center;
justify-content: space-between;
min-height: 74px;
padding-inline: clamp(14px, 2vw, 24px);
}
.cablio-elementor-header .elementor-column {
width: auto !important;
}
.cablio-elementor-header .elementor-widget-button .elementor-button,
.cablio-elementor-header .elementor-widget-search-form .elementor-search-form__submit,
.cablio-elementor-header .elementor-menu-cart__toggle .elementor-button {
border-radius: 8px;
}
.cablio-elementor-header .elementor-menu-cart__subtotal {
display: none;
}
.cablio-elementor-search form,
.cablio-product-search-form {
display: flex;
gap: 10px;
align-items: center;
width: min(100%, 520px);
}
.cablio-elementor-search input,
.cablio-product-search-form input {
width: 100%;
min-height: 46px;
border: 1px solid rgba(120, 169, 210, .32);
border-radius: 8px;
color: #fff;
background: rgba(255, 255, 255, .075);
}
.cablio-pl-pill .elementor-button,
.cablio-color-pill .elementor-button,
.cablio-account-pill .elementor-button {
min-width: 44px;
min-height: 44px;
padding: 10px 12px !important;
}
.cablio-mobile-nav-html {
display: none;
}
.cablio-mobile-menu-row {
display: flex;
gap: 8px;
flex-wrap: wrap;
overflow: visible;
padding-bottom: 2px;
scrollbar-width: none;
}
.cablio-mobile-menu-row::-webkit-scrollbar {
display: none;
}
.cablio-mobile-menu-row a {
flex: 0 0 auto;
padding: 9px 11px;
border: 1px solid rgba(120, 169, 210, .24);
border-radius: 9px;
color: #fff;
background: rgba(255, 255, 255, .045);
font-size: .78rem;
font-weight: 800;
text-transform: uppercase;
}
.cablio-editable-slider {
position: relative;
overflow: hidden;
min-height: 360px;
border: 1px solid rgba(92, 158, 205, .26);
border-radius: 20px;
background: radial-gradient(circle at 70% 30%, rgba(20, 205, 255, .16), transparent 45%), #06111c;
}
.cablio-editable-slider .cablio-slide {
display: none;
min-height: 360px;
grid-template-columns: minmax(260px, .9fr) minmax(320px, 1.1fr);
gap: clamp(18px, 3vw, 42px);
align-items: center;
padding: clamp(22px, 4vw, 54px);
}
.cablio-editable-slider .cablio-slide.is-active {
display: grid;
animation: cablioSlideIn .72s ease both;
}
@keyframes cablioSlideIn {
from {
opacity: 0;
transform: translateX(18px) scale(.985);
filter: blur(8px);
}
to {
opacity: 1;
transform: translateX(0) scale(1);
filter: blur(0);
}
}
.cablio-editable-slider img {
width: 100%;
height: min(42vw, 420px);
object-fit: cover;
border-radius: 16px;
box-shadow: 0 22px 70px rgba(0, 0, 0, .45);
}
.cablio-slide-copy h2 {
margin: 0 0 14px;
font-size: clamp(2rem, 4.8vw, 4.7rem);
line-height: .95;
text-transform: uppercase;
}
.cablio-slide-copy p {
max-width: 620px;
color: #c8ddf2;
font-size: clamp(1rem, 1.5vw, 1.22rem);
}
.cablio-slider-arrow {
position: absolute;
top: 50%;
z-index: 3;
display: grid;
place-items: center;
width: 44px;
height: 44px;
border: 1px solid rgba(255, 255, 255, .2);
border-radius: 999px;
color: #fff;
background: rgba(0, 0, 0, .38);
transform: translateY(-50%);
cursor: pointer;
}
.cablio-slider-arrow:hover {
border-color: var(--accent);
background: rgba(22, 200, 255, .18);
}
.cablio-slider-prev { left: 18px; }
.cablio-slider-next { right: 18px; }
.cablio-slider-dots {
position: absolute;
right: 26px;
bottom: 22px;
display: flex;
gap: 8px;
}
.cablio-slider-dots button {
width: 11px;
height: 11px;
padding: 0;
border: 0;
border-radius: 999px;
background: rgba(255, 255, 255, .34);
cursor: pointer;
}
.cablio-slider-dots button.is-active {
width: 30px;
background: var(--accent);
}
.cablio-product-results-grid {
display: grid;
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 18px;
}
.cablio-product-card {
display: flex;
flex-direction: column;
overflow: hidden;
border: 1px solid rgba(92, 158, 205, .24);
border-radius: 14px;
background: linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b));
box-shadow: 0 18px 46px rgba(0, 0, 0, .28);
}
.cablio-product-card-image {
display: grid;
place-items: center;
min-height: 210px;
padding: 18px;
background: rgba(255, 255, 255, .035);
}
.cablio-product-card-image img {
width: 100%;
max-height: 190px;
object-fit: contain;
}
.cablio-product-card-body {
display: flex;
flex: 1;
flex-direction: column;
gap: 10px;
padding: 18px;
}
.cablio-product-card-category {
color: var(--accent-2);
font-size: .8rem;
font-weight: 800;
}
.cablio-product-card-title {
margin: 0;
font-size: 1.08rem;
}
.cablio-product-card-title a {
color: #fff;
}
.cablio-product-card-price {
color: #fff;
font-size: 1.25rem;
font-weight: 800;
}
.cablio-product-card-excerpt {
color: #c6d7e9;
}
.cablio-product-card-actions {
display: flex;
gap: 10px;
flex-wrap: wrap;
margin-top: auto;
}
.cablio-shop-layout {
display: grid;
grid-template-columns: minmax(220px, 280px) minmax(0, 1fr);
gap: 24px;
}
.cablio-shop-filters {
align-self: start;
padding: 18px;
border: 1px solid rgba(92, 158, 205, .24);
border-radius: 14px;
background: rgba(11, 25, 38, .82);
}
.cablio-shop-filters ul {
margin: 0;
padding: 0;
list-style: none;
}
.cablio-shop-filters li,
.cablio-shop-filters .price_slider_wrapper {
margin: 8px 0;
padding: 10px;
border: 1px solid rgba(120, 169, 210, .16);
border-radius: 10px;
background: rgba(255, 255, 255, .035);
}
.cablio-shop-toolbar {
display: flex;
gap: 14px;
align-items: center;
justify-content: space-between;
margin-bottom: 18px;
}
.cablio-empty-results {
padding: clamp(28px, 5vw, 58px);
border: 1px solid rgba(92, 158, 205, .24);
border-radius: 16px;
text-align: center;
background: rgba(11, 25, 38, .82);
}
.woocommerce-account .woocommerce-MyAccount-navigation ul {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
gap: 12px;
padding: 0;
list-style: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation a {
display: block;
padding: 14px 16px;
border: 1px solid rgba(92, 158, 205, .24);
border-radius: 12px;
color: #fff;
background: rgba(11, 25, 38, .82);
}
.cablio-registration-section .elementor-container {
align-items: stretch;
gap: clamp(18px, 3vw, 34px);
}
.cablio-registration-section .elementor-widget-heading h1 {
max-width: 720px;
color: var(--accent-2);
font-size: clamp(2.2rem, 5vw, 4.8rem);
line-height: .95;
text-transform: uppercase;
overflow-wrap: anywhere;
}
.cablio-registration-panel,
.cablio-registration-benefits,
.cablio-account-cta {
border: 1px solid rgba(92, 158, 205, .25);
border-radius: 18px;
background:
radial-gradient(circle at 85% 15%, rgba(22, 200, 255, .14), transparent 34%),
linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b));
box-shadow: 0 24px 70px rgba(0, 0, 0, .32);
}
.cablio-registration-panel {
padding: clamp(18px, 3vw, 30px);
}
.cablio-registration-benefits {
display: grid;
gap: 12px;
margin-top: 28px;
padding: 18px;
}
.cablio-registration-benefits article {
padding: 14px;
border: 1px solid rgba(120, 169, 210, .16);
border-radius: 12px;
background: rgba(255, 255, 255, .035);
}
.cablio-registration-benefits strong {
display: block;
color: #fff;
margin-bottom: 5px;
}
.cablio-registration-benefits span {
color: #c8ddf2;
}
.cablio-registration-panel .elementor-field,
.cablio-registration-panel input {
min-height: 50px;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
border-color: rgba(120, 169, 210, .32) !important;
border-radius: 10px !important;
background: rgba(255, 255, 255, .075) !important;
}
.cablio-registration-panel label {
color: #fff !important;
font-weight: 800;
}
.cablio-account-cta {
display: flex;
gap: 14px;
align-items: center;
justify-content: space-between;
margin-bottom: 22px;
padding: 18px;
}
.cablio-account-cta p {
margin: 0;
color: #c8ddf2;
}
.cablio-services-elementor-section .elementor-container {
gap: clamp(18px, 3vw, 30px);
align-items: stretch;
}
.cablio-services-editable-grid .elementor-widget-wrap {
display: grid;
gap: 16px;
}
.cablio-service-icons-row {
width: 100%;
}
.cablio-service-icons-row .elementor-container {
gap: 16px;
align-items: stretch;
}
.cablio-service-card-column {
min-width: 0;
}
.cablio-service-icon-card .elementor-icon-box-wrapper {
height: 100%;
min-height: 205px;
padding: clamp(18px, 2.2vw, 26px);
border: 1px solid rgba(92, 158, 205, .26);
border-radius: 14px;
background:
radial-gradient(circle at 90% 10%, rgba(22, 200, 255, .12), transparent 30%),
linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b));
box-shadow: 0 18px 46px rgba(0, 0, 0, .24);
}
.cablio-service-icon-card .elementor-icon {
display: inline-grid;
place-items: center;
width: 54px;
height: 54px;
margin-bottom: 18px;
border: 1px solid rgba(22, 200, 255, .32);
border-radius: 14px;
color: var(--accent-2);
background: rgba(22, 200, 255, .08);
}
.cablio-service-icon-card .elementor-icon svg {
width: 28px;
height: 28px;
fill: currentColor;
}
.cablio-service-icon-card .elementor-icon-box-title {
margin: 0 0 10px;
color: #fff;
font-size: clamp(1.15rem, 1.5vw, 1.45rem);
line-height: 1.1;
}
.cablio-service-icon-card .elementor-icon-box-description {
color: #c8ddf2;
line-height: 1.55;
}
.cablio-service-form-column {
min-width: 0;
}
@media (max-width: 1024px) {
.cablio-elementor-header .elementor-container {
flex-wrap: wrap;
}
.cablio-product-results-grid {
grid-template-columns: repeat(2, minmax(0, 1fr));
}
.cablio-shop-layout {
grid-template-columns: 1fr;
}
.cablio-editable-slider .cablio-slide {
grid-template-columns: 1fr;
}
}
@media (max-width: 640px) {
.cablio-elementor-header {
margin: 8px;
border-radius: 12px;
}
.cablio-elementor-header .elementor-container {
display: grid !important;
grid-template-columns: minmax(110px, 1fr) auto auto auto auto;
gap: 8px;
align-items: center;
justify-content: stretch;
min-height: auto;
padding: 10px;
}
.cablio-elementor-header .elementor-container > .elementor-column {
width: auto !important;
min-width: 0;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(1) {
grid-column: 1;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(7) {
grid-column: 1 / -1;
grid-row: 2;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(8) {
grid-column: 2;
grid-row: 1;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(9) {
grid-column: 3;
grid-row: 1;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(10) {
grid-column: 4;
grid-row: 1;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(11) {
grid-column: 5;
grid-row: 1;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(n+2):nth-child(-n+6) {
display: none !important;
}
.cablio-elementor-header .elementor-container > .elementor-column:nth-child(12) {
display: block !important;
grid-column: 1 / -1;
grid-row: 3;
}
.cablio-mobile-nav-html {
display: block;
}
.cablio-elementor-search form {
display: grid;
grid-template-columns: 1fr auto;
gap: 8px;
}
.cablio-elementor-menu .elementor-button {
font-size: .76rem !important;
padding: 8px 5px !important;
white-space: nowrap;
}
.cablio-elementor-logo .elementor-button {
font-size: 1.45rem !important;
}
.cablio-account-pill .elementor-button {
min-width: 44px;
font-size: 0 !important;
}
.cablio-account-pill .elementor-button::before {
content: "K";
font-size: .9rem;
}
.cablio-product-search-form {
flex-direction: column;
align-items: stretch;
}
.cablio-product-results-grid {
grid-template-columns: 1fr;
}
.cablio-editable-slider,
.cablio-editable-slider .cablio-slide {
min-height: 0;
}
.cablio-editable-slider .cablio-slide {
padding: 22px;
}
.cablio-editable-slider img {
height: 220px;
}
.cablio-slider-arrow {
top: auto;
bottom: 16px;
transform: none;
}
.cablio-slider-dots {
left: 50%;
right: auto;
transform: translateX(-50%);
}
.cablio-registration-section .elementor-widget-heading h1 {
font-size: clamp(2rem, 9vw, 2.85rem);
line-height: 1;
}
.cablio-account-cta {
align-items: stretch;
flex-direction: column;
}
}
/* Final header polish after Elementor data cleanup. Keep this at the end so it wins over older responsive rules. */
body.cablio-site .elementor-element-hdrpl {
display: none !important;
}
body.cablio-site .cablio-elementor-header.elementor-section {
width: min(1740px, calc(100% - 48px)) !important;
margin: 18px auto 18px !important;
overflow: visible !important;
}
body.cablio-site .cablio-elementor-header > .elementor-container {
display: flex !important;
flex-wrap: nowrap !important;
align-items: center !important;
justify-content: flex-start !important;
gap: clamp(10px, .82vw, 18px) !important;
min-height: 74px !important;
padding: 12px clamp(16px, 2vw, 30px) !important;
}
body.cablio-site .cablio-elementor-header .elementor-column,
body.cablio-site .cablio-elementor-header .elementor-widget-wrap,
body.cablio-site .cablio-elementor-header .elementor-widget,
body.cablio-site .cablio-elementor-header .elementor-widget-container {
align-items: center !important;
min-width: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrlogo {
flex: 0 0 auto !important;
margin-right: clamp(10px, 1.6vw, 28px) !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrsearch {
flex: 0 1 330px !important;
width: min(330px, 24vw) !important;
min-width: 230px !important;
max-width: 330px !important;
margin-left: auto !important;
}
body.cablio-site .cablio-elementor-search-form {
display: grid !important;
grid-template-columns: minmax(170px, 1fr) auto !important;
align-items: center !important;
gap: 8px !important;
width: 100% !important;
}
body.cablio-site .cablio-elementor-search-form input,
body.cablio-site .cablio-elementor-search-form button {
height: 48px !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart,
body.cablio-site .cablio-elementor-header .elementor-element-hdracc,
body.cablio-site .cablio-elementor-header .elementor-element-hdrcolor {
flex: 0 0 auto !important;
}
body.cablio-site .cablio-account-pill .elementor-button {
border: 1px solid rgba(120, 169, 210, .38) !important;
background: rgba(8, 22, 34, .88) !important;
color: #f7fbff !important;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .03), 0 12px 28px rgba(0, 0, 0, .22) !important;
}
body.cablio-site main > .elementor,
body.cablio-site .site-main,
body.cablio-site .cablio-main,
body.cablio-site .woocommerce,
body.cablio-site .cablio-product-search-page {
padding-top: clamp(18px, 2.2vw, 36px) !important;
}
body.cablio-site main > .elementor > .elementor-section:first-child,
body.cablio-site .cablio-page-hero,
body.cablio-site .cablio-elementor-hero {
margin-top: 0 !important;
}
@media (max-width: 1240px) {
body.cablio-site .cablio-elementor-header > .elementor-container {
display: grid !important;
grid-template-columns: minmax(140px, 1fr) auto auto auto !important;
gap: 10px !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu1,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu2,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu3,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu4,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu5,
body.cablio-site .cablio-elementor-header .elementor-element-hdrmenu6 {
display: none !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrsearch {
grid-column: 1 / -1 !important;
grid-row: 2 !important;
width: 100% !important;
max-width: none !important;
margin-left: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrmobilemenu {
display: block !important;
grid-column: 1 / -1 !important;
grid-row: 3 !important;
}
body.cablio-site .cablio-elementor-header .cablio-mobile-nav-html {
display: block !important;
}
}
@media (max-width: 640px) {
body.cablio-site .cablio-elementor-header.elementor-section {
width: calc(100% - 18px) !important;
margin: 9px auto 14px !important;
}
body.cablio-site .cablio-elementor-header > .elementor-container {
grid-template-columns: minmax(120px, 1fr) auto auto !important;
padding: 10px !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc {
display: none !important;
}
body.cablio-site .cablio-elementor-search-form {
grid-template-columns: 1fr auto !important;
}
}
/* Header cart/account recovery: keep WooCommerce and Konto usable, compact and dark. */
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-menu-cart__toggle_wrapper,
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-menu-cart__toggle,
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-button-wrapper {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-menu-cart__toggle_button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 52px !important;
min-width: 52px !important;
height: 48px !important;
min-height: 48px !important;
padding: 0 !important;
border: 1px solid rgba(120, 169, 210, .38) !important;
border-radius: 10px !important;
color: #f7fbff !important;
background: rgba(8, 22, 34, .9) !important;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035), 0 12px 28px rgba(0, 0, 0, .2) !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-menu-cart__toggle_button:hover,
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button:hover {
border-color: rgba(22, 200, 255, .64) !important;
color: var(--accent-2) !important;
background: rgba(22, 200, 255, .12) !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-button-text,
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-menu-cart__subtotal {
display: none !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-button-icon {
position: relative !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart svg {
width: 20px !important;
height: 20px !important;
fill: currentColor !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart .elementor-button-icon-qty {
position: absolute !important;
top: -13px !important;
right: -15px !important;
display: grid !important;
place-items: center !important;
min-width: 20px !important;
height: 20px !important;
padding: 0 5px !important;
border-radius: 999px !important;
color: #fff !important;
background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
font-size: 11px !important;
font-weight: 900 !important;
line-height: 1 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 78px !important;
height: 48px !important;
padding: 0 16px !important;
border: 1px solid rgba(120, 169, 210, .38) !important;
border-radius: 10px !important;
color: #f7fbff !important;
background: rgba(8, 22, 34, .9) !important;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .035), 0 12px 28px rgba(0, 0, 0, .2) !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button-text {
font-size: .92rem !important;
font-weight: 900 !important;
}
/* Form and WooCommerce readability: dark fields, visible caret, no white account/cart panels. */
body.cablio-site input[type="text"],
body.cablio-site input[type="email"],
body.cablio-site input[type="tel"],
body.cablio-site input[type="password"],
body.cablio-site input[type="search"],
body.cablio-site input[type="number"],
body.cablio-site textarea,
body.cablio-site select,
body.cablio-site .elementor-field,
body.cablio-site .elementor-field-textual,
body.cablio-site .select2-container--default .select2-selection--single {
border: 1px solid rgba(120, 169, 210, .38) !important;
border-radius: 10px !important;
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
caret-color: var(--accent-2) !important;
background: rgba(12, 28, 42, .96) !important;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .025) !important;
}
body.cablio-site input::placeholder,
body.cablio-site textarea::placeholder,
body.cablio-site .elementor-field::placeholder {
color: rgba(220, 237, 255, .62) !important;
-webkit-text-fill-color: rgba(220, 237, 255, .62) !important;
}
body.cablio-site input:focus,
body.cablio-site textarea:focus,
body.cablio-site select:focus,
body.cablio-site .elementor-field:focus,
body.cablio-site .elementor-field-textual:focus {
border-color: rgba(22, 200, 255, .78) !important;
outline: 2px solid rgba(22, 200, 255, .22) !important;
outline-offset: 2px !important;
background: rgba(14, 34, 52, .98) !important;
}
body.cablio-site select option {
color: #f7fbff !important;
background: #07111b !important;
}
body.cablio-site .woocommerce,
body.cablio-site .woocommerce-cart-form,
body.cablio-site .cart_totals,
body.cablio-site .woocommerce-MyAccount-content,
body.cablio-site .woocommerce-MyAccount-navigation,
body.cablio-site .woocommerce-MyAccount-content > div,
body.cablio-site .cablio-account-dashboard,
body.cablio-site .cablio-account-addresses {
color: #f7fbff !important;
}
body.cablio-site .woocommerce table.shop_table,
body.cablio-site .woocommerce-cart-form,
body.cablio-site .cart_totals,
body.cablio-site .woocommerce-MyAccount-content,
body.cablio-site .woocommerce-MyAccount-navigation a,
body.cablio-site .cablio-account-welcome,
body.cablio-site .cablio-account-action,
body.cablio-site .cablio-account-help,
body.cablio-site .woocommerce-Address,
body.cablio-site .woocommerce-address-fields,
body.cablio-site .woocommerce-EditAccountForm,
body.cablio-site .woocommerce-form-login,
body.cablio-site .woocommerce-form-register {
border-color: rgba(120, 169, 210, .26) !important;
color: #f7fbff !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, var(--cablio-panel-top, #102231), var(--cablio-panel-bottom, #07111b)) !important;
}
body.cablio-site .woocommerce table.shop_table th,
body.cablio-site .woocommerce table.shop_table td,
body.cablio-site .woocommerce table.shop_table a,
body.cablio-site .woocommerce-MyAccount-content h2,
body.cablio-site .woocommerce-MyAccount-content h3,
body.cablio-site .woocommerce-MyAccount-content p,
body.cablio-site .woocommerce-MyAccount-content address,
body.cablio-site .woocommerce-MyAccount-content label,
body.cablio-site .cablio-account-welcome h2,
body.cablio-site .cablio-account-action span,
body.cablio-site .cablio-account-action small,
body.cablio-site .cablio-account-help p {
color: #f7fbff !important;
}
body.cablio-site .woocommerce table.shop_table a:hover,
body.cablio-site .woocommerce-MyAccount-navigation a:hover,
body.cablio-site .cablio-account-action:hover {
color: var(--accent-2) !important;
}
body.cablio-site .elementor-menu-cart__container .elementor-menu-cart__main {
color: #f7fbff !important;
background: #07111b !important;
border-left: 1px solid rgba(120, 169, 210, .24) !important;
}
body.cablio-site .elementor-menu-cart__container .elementor-menu-cart__product-name a,
body.cablio-site .elementor-menu-cart__container .elementor-menu-cart__product-price,
body.cablio-site .elementor-menu-cart__container .woocommerce-mini-cart__empty-message {
color: #f7fbff !important;
}
/* WooCommerce polish/dark recovery for account, cart and checkout widgets. */
body.cablio-site.woocommerce-account .woocommerce,
body.cablio-site.woocommerce-cart .woocommerce,
body.cablio-site.woocommerce-checkout .woocommerce,
body.cablio-site .woocommerce-MyAccount-navigation ul,
body.cablio-site .woocommerce-MyAccount-navigation li,
body.cablio-site .woocommerce-MyAccount-navigation li a,
body.cablio-site .woocommerce-MyAccount-content,
body.cablio-site .cablio-account-dashboard,
body.cablio-site .cablio-account-addresses,
body.cablio-site .woocommerce-EditAccountForm,
body.cablio-site .woocommerce-address-fields,
body.cablio-site .woocommerce-cart-form,
body.cablio-site .cart_totals,
body.cablio-site .woocommerce-checkout-review-order,
body.cablio-site .woocommerce-billing-fields,
body.cablio-site .woocommerce-shipping-fields,
body.cablio-site .woocommerce-additional-fields {
color: #f7fbff !important;
background: transparent !important;
}
body.cablio-site .woocommerce-MyAccount-navigation ul {
display: flex !important;
flex-wrap: wrap !important;
gap: 12px !important;
margin: 0 0 28px !important;
padding: 0 !important;
list-style: none !important;
}
body.cablio-site .woocommerce-MyAccount-navigation li {
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site .woocommerce-MyAccount-navigation li a,
body.cablio-site .cablio-account-action,
body.cablio-site .cablio-account-action-button,
body.cablio-site .cablio-account-secondary-button,
body.cablio-site .woocommerce-Button,
body.cablio-site .woocommerce button.button,
body.cablio-site .woocommerce a.button,
body.cablio-site .woocommerce input.button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
min-height: 46px !important;
padding: 12px 18px !important;
border: 1px solid rgba(22, 200, 255, .32) !important;
border-radius: 14px !important;
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
background: linear-gradient(135deg, rgba(22, 200, 255, .92), rgba(37, 99, 235, .92)) !important;
box-shadow: 0 14px 34px rgba(22, 132, 255, .18) !important;
text-decoration: none !important;
font-weight: 900 !important;
}
body.cablio-site .woocommerce-MyAccount-navigation li.is-active a,
body.cablio-site .woocommerce-MyAccount-navigation li a:hover,
body.cablio-site .cablio-account-action:hover,
body.cablio-site .cablio-account-action-button:hover,
body.cablio-site .cablio-account-secondary-button:hover {
transform: translateY(-1px);
color: #ffffff !important;
background: linear-gradient(135deg, rgba(73, 241, 255, .96), rgba(29, 78, 216, .96)) !important;
}
body.cablio-site .woocommerce-MyAccount-content > *,
body.cablio-site .woocommerce-Address,
body.cablio-site .cablio-account-welcome,
body.cablio-site .cablio-account-help {
border-color: rgba(120, 169, 210, .26) !important;
color: #f7fbff !important;
background:
radial-gradient(circle at 86% 12%, rgba(22, 200, 255, .10), transparent 34%),
linear-gradient(180deg, rgba(16, 34, 49, .92), rgba(7, 17, 27, .96)) !important;
}
body.cablio-site .cablio-account-actions {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 16px !important;
}
body.cablio-site .cablio-account-action {
min-height: 138px !important;
flex-direction: column !important;
align-items: flex-start !important;
justify-content: flex-start !important;
text-align: left !important;
background:
radial-gradient(circle at 92% 0%, rgba(22, 200, 255, .16), transparent 36%),
linear-gradient(180deg, rgba(16, 34, 49, .96), rgba(8, 20, 31, .98)) !important;
}
body.cablio-site .cablio-account-action span,
body.cablio-site .cablio-account-action small {
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
}
@media (max-width: 900px) {
body.cablio-site .cablio-account-actions {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 560px) {
body.cablio-site .woocommerce-MyAccount-navigation ul,
body.cablio-site .cablio-account-actions {
display: grid !important;
grid-template-columns: 1fr !important;
}
}
/* E-learning and Moodle product sections built from editable Elementor widgets. */
body.cablio-site .cablio-learning-heading {
margin-top: 22px !important;
}
body.cablio-site .cablio-learning-grid-section > .elementor-container {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 18px !important;
}
body.cablio-site .cablio-courses-product-grid > .elementor-container {
grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}
body.cablio-site .cablio-learning-card {
width: 100% !important;
min-height: 100% !important;
padding: 18px !important;
border: 1px solid rgba(120, 169, 210, .28) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 84% 0%, rgba(22, 200, 255, .12), transparent 36%),
linear-gradient(180deg, rgba(16, 34, 49, .94), rgba(7, 17, 27, .98)) !important;
box-shadow: 0 18px 44px rgba(0, 0, 0, .26) !important;
transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
body.cablio-site .cablio-learning-card:hover {
transform: translateY(-4px) !important;
border-color: rgba(22, 200, 255, .62) !important;
box-shadow: 0 24px 58px rgba(0, 0, 0, .36) !important;
}
body.cablio-site .cablio-learning-card > .elementor-widget-wrap {
display: flex !important;
flex-direction: column !important;
gap: 12px !important;
height: 100% !important;
padding: 0 !important;
}
body.cablio-site .cablio-learning-card-image img {
display: block !important;
width: 100% !important;
height: 160px !important;
object-fit: contain !important;
padding: 18px !important;
border-radius: 14px !important;
background: rgba(2, 10, 18, .42) !important;
}
body.cablio-site .cablio-learning-card h3,
body.cablio-site .cablio-learning-card .elementor-heading-title {
color: #f7fbff !important;
font-size: 1.18rem !important;
line-height: 1.2 !important;
}
body.cablio-site .cablio-learning-card p {
color: rgba(220, 237, 255, .82) !important;
line-height: 1.55 !important;
}
body.cablio-site .cablio-learning-card .elementor-widget-button {
margin-top: auto !important;
}
body.cablio-site .cablio-learning-card .elementor-button {
width: 100% !important;
border-radius: 12px !important;
color: #ffffff !important;
background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
font-weight: 900 !important;
}
body.cablio-site .cablio-learning-card .cablio-card-secondary-button .elementor-button {
color: var(--accent-2) !important;
background: rgba(22, 200, 255, .08) !important;
border: 1px solid rgba(22, 200, 255, .26) !important;
}
body.cablio-site .cablio-learning-info-card {
padding: 22px !important;
border: 1px solid rgba(120, 169, 210, .24) !important;
border-radius: 16px !important;
background: linear-gradient(180deg, rgba(16, 34, 49, .92), rgba(7, 17, 27, .96)) !important;
}
@media (max-width: 1024px) {
body.cablio-site .cablio-learning-grid-section > .elementor-container,
body.cablio-site .cablio-courses-product-grid > .elementor-container {
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}
}
@media (max-width: 640px) {
body.cablio-site .cablio-learning-grid-section > .elementor-container,
body.cablio-site .cablio-courses-product-grid > .elementor-container {
grid-template-columns: 1fr !important;
}
}
@media (max-width: 1240px) {
body.cablio-site .cablio-elementor-header .elementor-element-hdrcart {
grid-column: 2 !important;
grid-row: 1 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc {
display: flex !important;
grid-column: 3 !important;
grid-row: 1 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdrcolor {
grid-column: 4 !important;
grid-row: 1 !important;
}
}
@media (max-width: 640px) {
body.cablio-site .cablio-elementor-header > .elementor-container {
grid-template-columns: minmax(118px, 1fr) auto auto auto !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc {
display: flex !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button {
min-width: 52px !important;
width: 52px !important;
padding: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button-text {
font-size: 0 !important;
}
body.cablio-site .cablio-elementor-header .elementor-element-hdracc .elementor-button-text::before {
content: "K";
font-size: .95rem !important;
}
}
/* Final account polish: top action buttons first, customer panel below. */
body.cablio-site.logged-in.woocommerce-account .cablio-account-cta {
display: none !important;
}
body.cablio-site.woocommerce-account .woocommerce {
display: block !important;
width: 100% !important;
max-width: 100% !important;
}
body.cablio-site.woocommerce-account .woocommerce::after {
content: "" !important;
display: block !important;
clear: both !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation {
float: none !important;
width: 100% !important;
max-width: none !important;
margin: 0 0 22px !important;
padding: 0 !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation ul {
display: flex !important;
flex-wrap: wrap !important;
align-items: center !important;
gap: 12px !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li {
flex: 0 1 auto !important;
width: auto !important;
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-height: 46px !important;
padding: 12px 18px !important;
border: 1px solid rgba(22, 200, 255, .26) !important;
border-radius: 999px !important;
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
background: linear-gradient(135deg, rgba(22, 200, 255, .92), rgba(37, 99, 235, .92)) !important;
box-shadow: 0 14px 34px rgba(22, 132, 255, .16) !important;
font-size: .94rem !important;
font-weight: 900 !important;
line-height: 1 !important;
text-decoration: none !important;
white-space: nowrap !important;
}
/* Header cart: use a clean link to the cart page instead of the broken side mini-cart overlay. */
body.cablio-site .cablio-header-cart-link {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
min-height: 50px !important;
padding: 0 16px !important;
border: 1px solid rgba(120, 169, 210, .34) !important;
border-radius: 12px !important;
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
background: rgba(8, 18, 28, .82) !important;
box-shadow: 0 14px 34px rgba(0, 0, 0, .18) !important;
font-weight: 900 !important;
text-decoration: none !important;
white-space: nowrap !important;
}
body.cablio-site .cablio-header-cart-link:hover {
border-color: rgba(22, 200, 255, .62) !important;
color: var(--accent-2, #22d3ee) !important;
-webkit-text-fill-color: var(--accent-2, #22d3ee) !important;
background: rgba(22, 200, 255, .10) !important;
}
body.cablio-site .cablio-header-cart-icon {
font-size: 1.08rem !important;
line-height: 1 !important;
}
body.cablio-site .elementor-menu-cart__container,
body.cablio-site .elementor-menu-cart__main,
body.cablio-site .elementor-menu-cart__wrapper,
body.cablio-site .elementor-menu-cart--shown {
display: none !important;
visibility: hidden !important;
pointer-events: none !important;
}
@media (max-width: 640px) {
body.cablio-site .cablio-header-cart-link {
width: 52px !important;
min-width: 52px !important;
padding: 0 !important;
}
body.cablio-site .cablio-header-cart-link span:not(.cablio-header-cart-icon) {
display: none !important;
}
}
/* Account details / password change: keep every Woo account field readable on the dark theme. */
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm fieldset,
body.cablio-site.woocommerce-account form.edit-account fieldset {
display: grid !important;
gap: 14px !important;
margin: 24px 0 0 !important;
padding: 22px !important;
border: 1px solid rgba(120, 169, 210, .28) !important;
border-radius: 18px !important;
background:
radial-gradient(circle at 92% 0%, rgba(22, 200, 255, .12), transparent 34%),
linear-gradient(180deg, rgba(16, 34, 49, .88), rgba(7, 17, 27, .96)) !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm legend,
body.cablio-site.woocommerce-account form.edit-account legend {
width: auto !important;
margin: 0 0 8px !important;
padding: 0 12px !important;
color: #49f1ff !important;
-webkit-text-fill-color: #49f1ff !important;
background: #07111b !important;
font-size: 1.15rem !important;
font-weight: 900 !important;
line-height: 1.2 !important;
letter-spacing: .01em !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm label,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm em,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm span,
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm p,
body.cablio-site.woocommerce-account form.edit-account label,
body.cablio-site.woocommerce-account form.edit-account em,
body.cablio-site.woocommerce-account form.edit-account span,
body.cablio-site.woocommerce-account form.edit-account p {
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm em,
body.cablio-site.woocommerce-account form.edit-account em {
display: block !important;
margin-top: 6px !important;
color: rgba(230, 244, 255, .72) !important;
-webkit-text-fill-color: rgba(230, 244, 255, .72) !important;
font-size: .86rem !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm .required,
body.cablio-site.woocommerce-account form.edit-account .required {
color: #49f1ff !important;
-webkit-text-fill-color: #49f1ff !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm input,
body.cablio-site.woocommerce-account form.edit-account input {
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
caret-color: #49f1ff !important;
background: rgba(18, 36, 51, .98) !important;
}
body.cablio-site.woocommerce-account .woocommerce-EditAccountForm button.button,
body.cablio-site.woocommerce-account form.edit-account button.button {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: auto !important;
min-height: 48px !important;
padding: 13px 24px !important;
border: 0 !important;
border-radius: 14px !important;
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
background: linear-gradient(135deg, var(--accent), var(--accent-deep)) !important;
box-shadow: 0 16px 36px rgba(22, 132, 255, .22) !important;
font-weight: 900 !important;
text-decoration: none !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a {
border-color: rgba(73, 241, 255, .62) !important;
background: linear-gradient(135deg, rgba(34, 211, 238, .96), rgba(28, 130, 255, .96)) !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-content {
float: none !important;
clear: both !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site.woocommerce-account .cablio-account-dashboard {
width: 100% !important;
max-width: 1120px !important;
margin: 0 auto !important;
padding: 32px !important;
border: 1px solid rgba(120, 169, 210, .28) !important;
border-radius: 24px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .12), transparent 32%),
linear-gradient(180deg, rgba(16, 34, 49, .88), rgba(7, 17, 27, .96)) !important;
}
body.cablio-site.woocommerce-account .cablio-account-welcome {
margin: 0 0 24px !important;
padding: 30px !important;
border-radius: 22px !important;
}
body.cablio-site.woocommerce-account .cablio-account-welcome h2 {
margin: 8px 0 18px !important;
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
}
body.cablio-site.woocommerce-account .cablio-account-welcome p,
body.cablio-site.woocommerce-account .cablio-account-help p,
body.cablio-site.woocommerce-account .cablio-account-action small {
color: rgba(230, 244, 255, .88) !important;
-webkit-text-fill-color: rgba(230, 244, 255, .88) !important;
}
body.cablio-site.woocommerce-account .cablio-account-actions {
display: grid !important;
grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
gap: 16px !important;
}
body.cablio-site.woocommerce-account .cablio-account-action {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
text-decoration: none !important;
}
body.cablio-site.woocommerce-account .cablio-account-help {
display: grid !important;
grid-template-columns: 1fr auto auto !important;
align-items: center !important;
gap: 14px !important;
margin-top: 20px !important;
}
body.cablio-site:not(.logged-in).woocommerce-account .cablio-account-cta {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 16px !important;
margin: 18px 0 28px !important;
padding: 18px !important;
border: 1px solid rgba(120, 169, 210, .28) !important;
border-radius: 18px !important;
background:
radial-gradient(circle at 92% 0%, rgba(22, 200, 255, .12), transparent 36%),
linear-gradient(180deg, rgba(16, 34, 49, .95), rgba(7, 17, 27, .98)) !important;
}
body.cablio-site:not(.logged-in).woocommerce-account .cablio-account-cta p {
margin: 0 !important;
color: #f7fbff !important;
}
body.cablio-site input,
body.cablio-site textarea,
body.cablio-site select {
caret-color: var(--accent-2, #22d3ee) !important;
}
@media (max-width: 900px) {
body.cablio-site.woocommerce-account .cablio-account-dashboard {
padding: 22px !important;
}
body.cablio-site.woocommerce-account .cablio-account-actions,
body.cablio-site.woocommerce-account .cablio-account-help {
grid-template-columns: 1fr 1fr !important;
}
body.cablio-site.woocommerce-account .cablio-account-help p {
grid-column: 1 / -1 !important;
}
}
@media (max-width: 640px) {
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation ul {
display: grid !important;
grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
gap: 10px !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li a {
width: 100% !important;
min-height: 44px !important;
padding: 11px 12px !important;
font-size: .84rem !important;
}
body.cablio-site.woocommerce-account .cablio-account-dashboard {
padding: 16px !important;
border-radius: 18px !important;
}
body.cablio-site.woocommerce-account .cablio-account-welcome {
padding: 20px !important;
}
body.cablio-site.woocommerce-account .cablio-account-actions,
body.cablio-site.woocommerce-account .cablio-account-help,
body.cablio-site:not(.logged-in).woocommerce-account .cablio-account-cta {
display: grid !important;
grid-template-columns: 1fr !important;
}
}
/* ============================================================
* CABLIO polish 2026-05 - clean cart/checkout/shop layout
* ============================================================ */
/* Cart page: 2-column grid with proper Cart Totals panel */
body.cablio-site.woocommerce-cart .woocommerce {
display: grid !important;
grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr) !important;
gap: 28px !important;
align-items: start !important;
margin: 0 !important;
}
@media (max-width: 900px) {
body.cablio-site.woocommerce-cart .woocommerce {
grid-template-columns: 1fr !important;
}
}
body.cablio-site.woocommerce-cart .woocommerce-notices-wrapper,
body.cablio-site.woocommerce-cart form.woocommerce-cart-form {
grid-column: 1 !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals {
grid-column: 2 !important;
width: 100% !important;
max-width: none !important;
float: none !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals {
width: 100% !important;
float: none !important;
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals h2 {
margin: 0 0 18px !important;
font-size: 1.25rem !important;
font-weight: 700 !important;
letter-spacing: .02em !important;
color: #f7fbff !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals table.shop_table {
width: 100% !important;
margin: 0 0 18px !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
border-collapse: collapse !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals table.shop_table th,
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals table.shop_table td {
padding: 12px 0 !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
background: transparent !important;
vertical-align: top !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals table.shop_table th {
width: 42% !important;
font-weight: 600 !important;
color: rgba(247, 251, 255, .82) !important;
text-align: left !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals table.shop_table td {
text-align: right !important;
color: #f7fbff !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals .order-total th,
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals .order-total td,
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals .order-total td strong {
font-size: 1.1rem !important;
font-weight: 700 !important;
color: #16c8ff !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals .order-total th,
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals .order-total td {
border-bottom: none !important;
}
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
margin: 8px 0 0 !important;
padding: 0 !important;
}
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button {
display: block !important;
width: 100% !important;
padding: 14px 18px !important;
border-radius: 10px !important;
font-size: 1rem !important;
font-weight: 800 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
text-align: center !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .28) !important;
}
body.cablio-site.woocommerce-cart .cart_totals .shipping-calculator-button {
color: #16c8ff !important;
text-decoration: underline !important;
}
/* Cart product table */
body.cablio-site.woocommerce-cart form.woocommerce-cart-form {
padding: 0 !important;
margin: 0 !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
overflow: hidden !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form table.shop_table {
margin: 0 !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form table.shop_table th {
padding: 14px 18px !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
background: rgba(22, 200, 255, .06) !important;
font-weight: 700 !important;
color: #f7fbff !important;
text-transform: uppercase !important;
letter-spacing: .06em !important;
font-size: .82rem !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form table.shop_table td {
padding: 16px 18px !important;
border-bottom: 1px solid rgba(120, 169, 210, .12) !important;
vertical-align: middle !important;
color: #f7fbff !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .product-thumbnail img {
width: 64px !important;
height: 64px !important;
object-fit: cover !important;
border-radius: 10px !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .product-name a {
color: #f7fbff !important;
font-weight: 600 !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .quantity input.qty {
width: 70px !important;
padding: 8px 10px !important;
text-align: center !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 8px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .product-remove a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 28px !important;
height: 28px !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, .06) !important;
color: rgba(247, 251, 255, .7) !important;
font-weight: 700 !important;
text-decoration: none !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .product-remove a:hover {
background: rgba(255, 80, 80, .2) !important;
color: #ff7070 !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .actions {
padding: 16px 18px !important;
background: rgba(7, 17, 27, .4) !important;
border-top: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .coupon {
display: flex !important;
gap: 10px !important;
align-items: center !important;
}
body.cablio-site.woocommerce-cart .woocommerce-cart-form .coupon input.input-text {
flex: 1 !important;
min-width: 0 !important;
padding: 10px 12px !important;
}
/* ============================================================
* Shop page: filters sidebar + product grid
* ============================================================ */
body.cablio-site .woocommerce ul.products,
body.cablio-site ul.products {
display: grid !important;
grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)) !important;
gap: 22px !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
}
body.cablio-site .woocommerce ul.products li.product,
body.cablio-site ul.products li.product {
width: auto !important;
margin: 0 !important;
padding: 18px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}
body.cablio-site .woocommerce ul.products li.product:hover {
transform: translateY(-3px) !important;
border-color: rgba(22, 200, 255, .5) !important;
box-shadow: 0 18px 40px rgba(22, 200, 255, .18) !important;
}
body.cablio-site .woocommerce ul.products li.product img {
width: 100% !important;
height: auto !important;
aspect-ratio: 4 / 3 !important;
object-fit: cover !important;
border-radius: 10px !important;
margin-bottom: 12px !important;
background: rgba(7, 17, 27, .4) !important;
}
body.cablio-site .woocommerce ul.products li.product .woocommerce-loop-product__title {
font-size: 1rem !important;
font-weight: 700 !important;
color: #f7fbff !important;
margin: 0 0 6px !important;
padding: 0 !important;
}
body.cablio-site .woocommerce ul.products li.product .price {
display: block !important;
margin: 0 0 10px !important;
color: #16c8ff !important;
font-weight: 800 !important;
font-size: 1.05rem !important;
}
body.cablio-site .woocommerce ul.products li.product a.button {
display: inline-block !important;
margin: 0 !important;
padding: 10px 16px !important;
border-radius: 8px !important;
font-size: .85rem !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
}
/* Shop filters sidebar (Elementor Pro Product Categories widget) */
body.cablio-site .elementor-widget-woocommerce-product-categories ul.product-categories {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site .elementor-widget-woocommerce-product-categories ul.product-categories li {
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site .elementor-widget-woocommerce-product-categories ul.product-categories li a {
display: block !important;
padding: 10px 14px !important;
margin: 0 0 6px !important;
border-radius: 10px !important;
color: rgba(247, 251, 255, .82) !important;
text-decoration: none !important;
border: 1px solid rgba(120, 169, 210, .14) !important;
background: rgba(7, 17, 27, .4) !important;
transition: all .2s ease !important;
}
body.cablio-site .elementor-widget-woocommerce-product-categories ul.product-categories li a:hover,
body.cablio-site .elementor-widget-woocommerce-product-categories ul.product-categories li.current-cat a {
background: rgba(22, 200, 255, .14) !important;
border-color: rgba(22, 200, 255, .5) !important;
color: #fff !important;
}
/* Sorting dropdown */
body.cablio-site .woocommerce-ordering select.orderby {
padding: 10px 14px !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
color: #fff !important;
}
/* Pagination */
body.cablio-site .woocommerce nav.woocommerce-pagination {
margin: 30px 0 0 !important;
}
body.cablio-site .woocommerce nav.woocommerce-pagination ul {
display: flex !important;
gap: 6px !important;
border: none !important;
}
body.cablio-site .woocommerce nav.woocommerce-pagination ul li {
border: none !important;
}
body.cablio-site .woocommerce nav.woocommerce-pagination ul li a,
body.cablio-site .woocommerce nav.woocommerce-pagination ul li span {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 40px !important;
height: 40px !important;
padding: 0 12px !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
color: #f7fbff !important;
font-weight: 600 !important;
}
body.cablio-site .woocommerce nav.woocommerce-pagination ul li span.current,
body.cablio-site .woocommerce nav.woocommerce-pagination ul li a.current {
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border-color: transparent !important;
}
/* ============================================================
* Single product page: clean layout with image + summary
* ============================================================ */
body.cablio-site.single-product div.product {
display: grid !important;
grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr) !important;
gap: 36px !important;
margin: 0 0 36px !important;
}
@media (max-width: 900px) {
body.cablio-site.single-product div.product {
grid-template-columns: 1fr !important;
}
}
body.cablio-site.single-product div.product .woocommerce-product-gallery {
width: auto !important;
float: none !important;
margin: 0 !important;
}
body.cablio-site.single-product div.product .summary {
width: auto !important;
float: none !important;
margin: 0 !important;
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
}
body.cablio-site.single-product div.product .summary .product_title {
font-size: 1.7rem !important;
font-weight: 800 !important;
margin: 0 0 14px !important;
color: #f7fbff !important;
}
body.cablio-site.single-product div.product .summary .price {
font-size: 1.5rem !important;
font-weight: 800 !important;
color: #16c8ff !important;
margin: 0 0 14px !important;
}
body.cablio-site.single-product div.product .summary form.cart {
display: flex !important;
gap: 12px !important;
align-items: center !important;
margin: 18px 0 !important;
}
body.cablio-site.single-product div.product .summary form.cart .quantity input.qty {
width: 80px !important;
padding: 12px !important;
text-align: center !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
}
/* ============================================================
* CABLIO polish v2 - 2026-05 - slider + cart hard fix + responsive
* ============================================================ */
/* ============================================================
* Hero slider - responsive layout, gradient kept
* ============================================================ */
body.cablio-site .hero-slider {
position: relative !important;
width: 100% !important;
min-height: clamp(280px, 38vw, 460px) !important;
margin: 0 0 24px !important;
border-radius: 22px !important;
overflow: hidden !important;
background:
radial-gradient(circle at 70% 30%, rgba(22, 200, 255, .28), transparent 45%),
radial-gradient(circle at 20% 80%, rgba(106, 60, 255, .18), transparent 50%),
linear-gradient(135deg, #0a1828 0%, #07111b 60%, #050d17 100%) !important;
box-shadow:
inset 0 0 0 1px rgba(154, 185, 221, .12),
0 24px 56px rgba(0, 0, 0, .42) !important;
}
body.cablio-site .hero-slide {
position: absolute !important;
inset: 0 !important;
display: grid !important;
grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr) !important;
align-items: stretch !important;
opacity: 0 !important;
transform: scale(.99) !important;
transition: opacity .55s ease, transform .55s ease !important;
pointer-events: none !important;
}
body.cablio-site .hero-slide.is-active {
opacity: 1 !important;
transform: none !important;
pointer-events: auto !important;
}
body.cablio-site .hero-slide > img {
position: absolute !important;
inset: 0 !important;
width: 100% !important;
height: 100% !important;
object-fit: cover !important;
object-position: center !important;
opacity: .82 !important;
z-index: 0 !important;
}
body.cablio-site .hero-slide::after {
content: '' !important;
position: absolute !important;
inset: 0 !important;
background: linear-gradient(90deg, rgba(5, 13, 23, .92) 0%, rgba(5, 13, 23, .55) 45%, rgba(5, 13, 23, .15) 100%) !important;
z-index: 1 !important;
pointer-events: none !important;
}
body.cablio-site .hero-slide-copy {
position: relative !important;
z-index: 2 !important;
display: flex !important;
flex-direction: column !important;
justify-content: center !important;
gap: 12px !important;
max-width: 540px !important;
margin: 0 !important;
padding: clamp(22px, 4vw, 44px) !important;
background: transparent !important;
border: none !important;
backdrop-filter: none !important;
}
body.cablio-site .hero-slide-copy span {
display: inline-block !important;
width: fit-content !important;
padding: 6px 12px !important;
border-radius: 999px !important;
border: 1px solid rgba(22, 200, 255, .45) !important;
background: rgba(22, 200, 255, .12) !important;
color: #16c8ff !important;
font-size: .72rem !important;
font-weight: 700 !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
}
body.cablio-site .hero-slide-copy h2 {
margin: 0 !important;
font-size: clamp(1.5rem, 3.4vw, 2.6rem) !important;
line-height: 1.15 !important;
font-weight: 800 !important;
color: #f7fbff !important;
letter-spacing: -0.01em !important;
}
body.cablio-site .hero-slide-copy p {
margin: 0 !important;
font-size: clamp(.95rem, 1.4vw, 1.08rem) !important;
line-height: 1.55 !important;
color: rgba(247, 251, 255, .82) !important;
max-width: 480px !important;
}
body.cablio-site .hero-slide-copy a.ghost,
body.cablio-site .hero-slide-copy .btn {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
width: fit-content !important;
margin-top: 6px !important;
padding: 12px 22px !important;
border-radius: 12px !important;
font-size: .92rem !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
text-decoration: none !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .28) !important;
transition: transform .18s ease, box-shadow .18s ease !important;
}
body.cablio-site .hero-slide-copy a.ghost:hover,
body.cablio-site .hero-slide-copy .btn:hover {
transform: translateY(-2px) !important;
box-shadow: 0 20px 38px rgba(22, 200, 255, .38) !important;
}
body.cablio-site .slider-dots {
position: absolute !important;
right: clamp(14px, 3vw, 28px) !important;
bottom: clamp(14px, 3vw, 24px) !important;
z-index: 4 !important;
display: flex !important;
gap: 8px !important;
}
body.cablio-site .slider-dots button {
width: 10px !important;
height: 10px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, .35) !important;
cursor: pointer !important;
transition: width .25s ease, background .25s ease !important;
}
body.cablio-site .slider-dots button:hover {
background: rgba(255, 255, 255, .6) !important;
}
body.cablio-site .slider-dots button.is-active {
width: 32px !important;
background: #16c8ff !important;
}
/* Mobile slider — stack image as background, copy on top */
@media (max-width: 768px) {
body.cablio-site .hero-slider {
min-height: 360px !important;
border-radius: 16px !important;
}
body.cablio-site .hero-slide {
grid-template-columns: 1fr !important;
}
body.cablio-site .hero-slide::after {
background: linear-gradient(180deg, rgba(5, 13, 23, .55) 0%, rgba(5, 13, 23, .92) 70%) !important;
}
body.cablio-site .hero-slide-copy {
align-self: end !important;
padding: 24px 22px 64px !important;
}
body.cablio-site .hero-slide-copy h2 {
font-size: 1.55rem !important;
}
}
/* ============================================================
* Cart - HARD layout fix (overrides any previous CSS)
* ============================================================ */
body.cablio-site.woocommerce-cart .elementor-widget-woocommerce-cart {
margin: 0 !important;
}
body.cablio-site.woocommerce-cart .woocommerce {
display: grid !important;
grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr) !important;
gap: 28px !important;
align-items: start !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
}
@media (max-width: 960px) {
body.cablio-site.woocommerce-cart .woocommerce {
grid-template-columns: 1fr !important;
}
}
body.cablio-site.woocommerce-cart .woocommerce::before,
body.cablio-site.woocommerce-cart .woocommerce::after {
display: none !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form {
grid-column: 1 !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
float: none !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
overflow: hidden !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
}
body.cablio-site.woocommerce-cart .woocommerce-notices-wrapper {
grid-column: 1 / -1 !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals {
grid-column: 2 !important;
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 0 !important;
float: none !important;
display: block !important;
}
@media (max-width: 960px) {
body.cablio-site.woocommerce-cart .cart-collaterals {
grid-column: 1 !important;
}
}
body.cablio-site.woocommerce-cart .cart-collaterals > * {
width: 100% !important;
margin: 0 !important;
float: none !important;
}
body.cablio-site.woocommerce-cart .cart-collaterals .cart_totals {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 26px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .12), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
float: none !important;
}
body.cablio-site.woocommerce-cart .cart_totals h2 {
margin: 0 0 18px !important;
padding: 0 0 14px !important;
font-size: 1.2rem !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
color: #f7fbff !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
}
body.cablio-site.woocommerce-cart .cart_totals table.shop_table,
body.cablio-site.woocommerce-cart .cart_totals table.shop_table_responsive {
width: 100% !important;
margin: 0 0 18px !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
border-collapse: separate !important;
border-spacing: 0 !important;
}
body.cablio-site.woocommerce-cart .cart_totals table.shop_table th,
body.cablio-site.woocommerce-cart .cart_totals table.shop_table td {
padding: 14px 0 !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
background: transparent !important;
vertical-align: top !important;
font-size: .95rem !important;
}
body.cablio-site.woocommerce-cart .cart_totals table.shop_table th {
width: 42% !important;
font-weight: 600 !important;
color: rgba(247, 251, 255, .78) !important;
text-align: left !important;
}
body.cablio-site.woocommerce-cart .cart_totals table.shop_table td {
text-align: right !important;
color: #f7fbff !important;
}
body.cablio-site.woocommerce-cart .cart_totals .shipping td,
body.cablio-site.woocommerce-cart .cart_totals .shipping th {
text-align: left !important;
}
body.cablio-site.woocommerce-cart .cart_totals .shipping td {
font-size: .9rem !important;
}
body.cablio-site.woocommerce-cart .cart_totals .order-total th,
body.cablio-site.woocommerce-cart .cart_totals .order-total td {
padding: 18px 0 !important;
font-size: 1.15rem !important;
font-weight: 800 !important;
border-bottom: none !important;
}
body.cablio-site.woocommerce-cart .cart_totals .order-total td,
body.cablio-site.woocommerce-cart .cart_totals .order-total td strong,
body.cablio-site.woocommerce-cart .cart_totals .order-total td .amount {
color: #16c8ff !important;
font-size: 1.3rem !important;
}
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout {
margin: 14px 0 0 !important;
padding: 0 !important;
}
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button,
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.button {
display: block !important;
width: 100% !important;
margin: 0 !important;
padding: 16px 20px !important;
border-radius: 12px !important;
border: none !important;
font-size: 1rem !important;
font-weight: 800 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-align: center !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .32) !important;
transition: transform .18s ease, box-shadow .18s ease !important;
}
body.cablio-site.woocommerce-cart .cart_totals .wc-proceed-to-checkout a.checkout-button:hover {
transform: translateY(-2px) !important;
box-shadow: 0 20px 40px rgba(22, 200, 255, .42) !important;
}
body.cablio-site.woocommerce-cart .shipping-calculator-button {
display: inline-block !important;
margin-top: 6px !important;
color: #16c8ff !important;
text-decoration: underline !important;
text-decoration-color: rgba(22, 200, 255, .4) !important;
}
body.cablio-site.woocommerce-cart .woocommerce-shipping-destination {
margin: 8px 0 12px !important;
padding: 12px 14px !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .5) !important;
font-size: .88rem !important;
color: rgba(247, 251, 255, .78) !important;
line-height: 1.5 !important;
}
body.cablio-site.woocommerce-cart .woocommerce-shipping-destination strong {
color: #f7fbff !important;
}
/* Cart product table override */
body.cablio-site.woocommerce-cart form.woocommerce-cart-form table.shop_table {
margin: 0 !important;
border: none !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
border-collapse: separate !important;
border-spacing: 0 !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form thead th {
padding: 16px 18px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
background: rgba(22, 200, 255, .06) !important;
font-weight: 700 !important;
color: #f7fbff !important;
text-transform: uppercase !important;
letter-spacing: .08em !important;
font-size: .78rem !important;
text-align: left !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form tbody td {
padding: 18px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .12) !important;
vertical-align: middle !important;
color: #f7fbff !important;
background: transparent !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form tbody tr:last-child td {
border-bottom: none !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-thumbnail img {
width: 72px !important;
height: 72px !important;
object-fit: cover !important;
border-radius: 12px !important;
border: 1px solid rgba(120, 169, 210, .2) !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-name a {
color: #f7fbff !important;
font-weight: 600 !important;
text-decoration: none !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-name a:hover {
color: #16c8ff !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-price,
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-subtotal {
font-weight: 700 !important;
color: #f7fbff !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .quantity input.qty {
width: 72px !important;
padding: 8px 10px !important;
text-align: center !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
font-weight: 600 !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-remove a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 30px !important;
height: 30px !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, .06) !important;
color: rgba(247, 251, 255, .65) !important;
font-weight: 700 !important;
font-size: 1.1rem !important;
text-decoration: none !important;
transition: all .18s ease !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-remove a:hover {
background: rgba(255, 80, 80, .2) !important;
color: #ff8080 !important;
transform: scale(1.06) !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .actions {
padding: 20px 18px !important;
background: rgba(7, 17, 27, .42) !important;
border-top: 1px solid rgba(120, 169, 210, .16) !important;
display: flex !important;
flex-wrap: wrap !important;
gap: 14px !important;
justify-content: space-between !important;
align-items: center !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .coupon {
display: flex !important;
gap: 10px !important;
align-items: center !important;
flex: 1 1 auto !important;
min-width: 0 !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .coupon input.input-text {
flex: 1 1 auto !important;
min-width: 0 !important;
padding: 11px 14px !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .coupon button.button,
body.cablio-site.woocommerce-cart form.woocommerce-cart-form button[name='update_cart'],
body.cablio-site.woocommerce-cart form.woocommerce-cart-form button.button {
padding: 11px 18px !important;
border-radius: 10px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-size: .82rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
cursor: pointer !important;
white-space: nowrap !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form button[name='update_cart']:disabled {
opacity: .5 !important;
cursor: not-allowed !important;
}
/* Mobile cart - stacked rows */
@media (max-width: 768px) {
body.cablio-site.woocommerce-cart form.woocommerce-cart-form thead {
display: none !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form tbody tr {
display: grid !important;
grid-template-columns: 72px 1fr auto !important;
grid-template-areas:
'thumb name remove'
'thumb price quantity'
'thumb subtotal subtotal' !important;
gap: 8px 14px !important;
padding: 16px !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form tbody td {
padding: 0 !important;
border: none !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-thumbnail { grid-area: thumb !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-name { grid-area: name !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-price { grid-area: price !important; font-size: .9rem !important; color: rgba(247,251,255,.7) !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-quantity { grid-area: quantity !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-subtotal { grid-area: subtotal !important; padding-top: 8px !important; border-top: 1px dashed rgba(120, 169, 210, .14) !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .product-remove { grid-area: remove !important; justify-self: end !important; }
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .actions {
flex-direction: column !important;
align-items: stretch !important;
}
body.cablio-site.woocommerce-cart form.woocommerce-cart-form .coupon {
flex-direction: column !important;
align-items: stretch !important;
}
}
/* ============================================================
* Elementor Accordion (FAQ) styling
* ============================================================ */
body.cablio-site .elementor-accordion {
display: grid !important;
gap: 12px !important;
}
body.cablio-site .elementor-accordion .elementor-accordion-item {
border: 1px solid rgba(120, 169, 210, .2) !important;
border-radius: 14px !important;
overflow: hidden !important;
background:
radial-gradient(circle at 95% 0%, rgba(22, 200, 255, .06), transparent 30%),
linear-gradient(180deg, rgba(17, 33, 48, .82), rgba(7, 17, 27, .9)) !important;
transition: border-color .2s ease !important;
}
body.cablio-site .elementor-accordion .elementor-accordion-item:hover {
border-color: rgba(22, 200, 255, .35) !important;
}
body.cablio-site .elementor-accordion .elementor-tab-title {
padding: 18px 22px !important;
border: none !important;
background: transparent !important;
color: #f7fbff !important;
font-size: 1.02rem !important;
font-weight: 600 !important;
cursor: pointer !important;
}
body.cablio-site .elementor-accordion .elementor-tab-title.elementor-active {
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
color: #16c8ff !important;
}
body.cablio-site .elementor-accordion .elementor-accordion-icon {
color: #16c8ff !important;
}
body.cablio-site .elementor-accordion .elementor-tab-content {
padding: 18px 22px !important;
background: rgba(7, 17, 27, .42) !important;
color: rgba(247, 251, 255, .82) !important;
font-size: .96rem !important;
line-height: 1.65 !important;
border-top: none !important;
}
body.cablio-site .elementor-accordion .elementor-tab-content p {
margin: 0 0 10px !important;
}
body.cablio-site .elementor-accordion .elementor-tab-content p:last-child {
margin-bottom: 0 !important;
}
body.cablio-site .elementor-accordion .elementor-tab-content a {
color: #16c8ff !important;
text-decoration: underline !important;
text-decoration-color: rgba(22, 200, 255, .35) !important;
}
/* ============================================================
* Global responsive layout safety
* ============================================================ */
@media (max-width: 768px) {
body.cablio-site .container,
body.cablio-site main,
body.cablio-site .elementor-section .elementor-container {
padding-left: 16px !important;
padding-right: 16px !important;
}
body.cablio-site .trust-strip,
body.cablio-site .tile-grid {
grid-template-columns: 1fr 1fr !important;
}
body.cablio-site h1 { font-size: 1.7rem !important; }
body.cablio-site h2 { font-size: 1.35rem !important; }
}
@media (max-width: 480px) {
body.cablio-site .trust-strip,
body.cablio-site .tile-grid {
grid-template-columns: 1fr !important;
}
}
/* ============================================================
* Homepage editable slider - responsive + polished gradient
* ============================================================ */
body.cablio-site .cablio-editable-slider {
position: relative !important;
overflow: hidden !important;
min-height: clamp(320px, 38vw, 460px) !important;
border: 1px solid rgba(92, 158, 205, .26) !important;
border-radius: 22px !important;
background:
radial-gradient(circle at 75% 25%, rgba(22, 200, 255, .26), transparent 50%),
radial-gradient(circle at 15% 80%, rgba(106, 60, 255, .18), transparent 55%),
linear-gradient(135deg, #0a1828 0%, #07111b 60%, #050d17 100%) !important;
box-shadow:
inset 0 0 0 1px rgba(154, 185, 221, .12),
0 24px 56px rgba(0, 0, 0, .42) !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide {
display: none !important;
min-height: clamp(320px, 38vw, 460px) !important;
grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr) !important;
gap: clamp(18px, 3vw, 38px) !important;
align-items: center !important;
padding: clamp(22px, 4vw, 48px) !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide.is-active {
display: grid !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy {
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
max-width: 540px !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy .eyebrow {
display: inline-flex !important;
width: fit-content !important;
margin: 0 !important;
padding: 5px 12px !important;
border-radius: 999px !important;
border: 1px solid rgba(22, 200, 255, .45) !important;
background: rgba(22, 200, 255, .12) !important;
color: #16c8ff !important;
font-size: .72rem !important;
font-weight: 700 !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy h2 {
margin: 0 !important;
font-size: clamp(1.65rem, 3.2vw, 2.7rem) !important;
line-height: 1.1 !important;
font-weight: 800 !important;
text-transform: uppercase !important;
color: #f7fbff !important;
letter-spacing: -0.01em !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy p {
margin: 0 !important;
font-size: clamp(.95rem, 1.3vw, 1.08rem) !important;
line-height: 1.55 !important;
color: rgba(247, 251, 255, .82) !important;
max-width: 480px !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy a.btn {
display: inline-flex !important;
align-items: center !important;
width: fit-content !important;
margin-top: 6px !important;
padding: 13px 24px !important;
border-radius: 12px !important;
border: none !important;
font-size: .92rem !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
text-decoration: none !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .28) !important;
transition: transform .18s ease, box-shadow .18s ease !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy a.btn:hover {
transform: translateY(-2px) !important;
box-shadow: 0 20px 40px rgba(22, 200, 255, .42) !important;
}
body.cablio-site .cablio-editable-slider img {
width: 100% !important;
height: clamp(220px, 32vw, 380px) !important;
object-fit: cover !important;
border-radius: 16px !important;
box-shadow: 0 22px 70px rgba(0, 0, 0, .45) !important;
}
body.cablio-site .cablio-slider-arrow {
position: absolute !important;
top: 50% !important;
z-index: 4 !important;
display: grid !important;
place-items: center !important;
width: 44px !important;
height: 44px !important;
border: 1px solid rgba(255, 255, 255, .22) !important;
border-radius: 999px !important;
color: #fff !important;
background: rgba(7, 17, 27, .6) !important;
transform: translateY(-50%) !important;
cursor: pointer !important;
font-size: 1.4rem !important;
line-height: 1 !important;
transition: all .2s ease !important;
}
body.cablio-site .cablio-slider-arrow:hover {
border-color: #16c8ff !important;
background: rgba(22, 200, 255, .2) !important;
color: #16c8ff !important;
}
body.cablio-site .cablio-slider-prev { left: 16px !important; }
body.cablio-site .cablio-slider-next { right: 16px !important; }
body.cablio-site .cablio-slider-dots {
position: absolute !important;
left: 50% !important;
right: auto !important;
bottom: 18px !important;
transform: translateX(-50%) !important;
display: flex !important;
gap: 8px !important;
z-index: 4 !important;
}
body.cablio-site .cablio-slider-dots button {
width: 10px !important;
height: 10px !important;
padding: 0 !important;
border: 0 !important;
border-radius: 999px !important;
background: rgba(255, 255, 255, .35) !important;
cursor: pointer !important;
transition: width .25s ease, background .25s ease !important;
}
body.cablio-site .cablio-slider-dots button:hover {
background: rgba(255, 255, 255, .65) !important;
}
body.cablio-site .cablio-slider-dots button.is-active {
width: 32px !important;
background: #16c8ff !important;
}
/* Mobile slider */
@media (max-width: 900px) {
body.cablio-site .cablio-editable-slider .cablio-slide {
grid-template-columns: 1fr !important;
gap: 18px !important;
}
body.cablio-site .cablio-editable-slider img {
height: clamp(180px, 50vw, 280px) !important;
order: -1 !important;
}
body.cablio-site .cablio-editable-slider .cablio-slide-copy h2 {
font-size: 1.6rem !important;
}
body.cablio-site .cablio-slider-arrow {
width: 38px !important;
height: 38px !important;
}
body.cablio-site .cablio-slider-prev { left: 8px !important; }
body.cablio-site .cablio-slider-next { right: 8px !important; }
}
/* Hide arrow buttons on very small screens (use dots only) */
@media (max-width: 480px) {
body.cablio-site .cablio-slider-arrow {
display: none !important;
}
}
/* ============================================================
* CABLIO polish v3 - 2026-05 - HARD cart fix + account icons + addresses
* ============================================================ */
/* Cart - Elementor widget structure */
body.cablio-site .elementor-widget-woocommerce-cart {
--sections-background-color: rgba(15, 28, 42, .92) !important;
--sections-border-color: rgba(120, 169, 210, .26) !important;
--sections-border-radius: 16px !important;
--sections-margin: 20px !important;
--sections-padding: 26px !important;
--sections-descriptions-color: rgba(247, 251, 255, .82) !important;
--headings-color: #f7fbff !important;
--price-text-color: #f7fbff !important;
--price-total-text-color: #16c8ff !important;
--form-background: rgba(7, 17, 27, .6) !important;
--form-color: #f7fbff !important;
--form-border-color: rgba(120, 169, 210, .3) !important;
--button-text-color: #fff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .e-cart__container {
display: grid !important;
grid-template-columns: minmax(0, 1.55fr) minmax(280px, 1fr) !important;
gap: 24px !important;
align-items: start !important;
width: 100% !important;
max-width: none !important;
}
@media (max-width: 960px) {
body.cablio-site .elementor-widget-woocommerce-cart .e-cart__container {
grid-template-columns: 1fr !important;
}
}
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section {
width: 100% !important;
max-width: none !important;
margin: 0 !important;
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
color: #f7fbff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section h2,
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section h3,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals h2 {
margin: 0 0 18px !important;
padding: 0 0 14px !important;
font-size: 1.15rem !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
color: #f7fbff !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section,
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section .woocommerce,
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals,
body.cablio-site .elementor-widget-woocommerce-cart .cart-collaterals,
body.cablio-site .elementor-widget-woocommerce-cart .cart-collaterals .cart_totals,
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table,
body.cablio-site .elementor-widget-woocommerce-cart table.cart {
background-color: transparent !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table,
body.cablio-site .elementor-widget-woocommerce-cart table.cart {
width: 100% !important;
margin: 0 !important;
border: none !important;
border-collapse: separate !important;
border-spacing: 0 !important;
box-shadow: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th,
body.cablio-site .elementor-widget-woocommerce-cart table.cart thead th {
padding: 14px 12px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .22) !important;
background: transparent !important;
color: #f7fbff !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .08em !important;
font-size: .76rem !important;
text-align: left !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody td,
body.cablio-site .elementor-widget-woocommerce-cart table.cart tbody td {
padding: 16px 12px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .12) !important;
background: transparent !important;
color: #f7fbff !important;
vertical-align: middle !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody tr:last-child td {
border-bottom: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-thumbnail img {
width: 64px !important;
height: 64px !important;
object-fit: cover !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .2) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-name a {
color: #f7fbff !important;
font-weight: 600 !important;
text-decoration: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-name a:hover { color: #16c8ff !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-price,
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal,
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal .amount {
font-weight: 700 !important;
color: #f7fbff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .quantity input.qty {
width: 72px !important;
padding: 8px 10px !important;
text-align: center !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
font-weight: 600 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-remove a,
body.cablio-site .elementor-widget-woocommerce-cart .product-remove a.remove {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 30px !important;
height: 30px !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, .06) !important;
color: rgba(247, 251, 255, .65) !important;
font-weight: 700 !important;
font-size: 1.1rem !important;
text-decoration: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-remove a:hover {
background: rgba(255, 80, 80, .2) !important;
color: #ff8080 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .actions {
padding: 18px 0 0 !important;
background: transparent !important;
border-top: 1px solid rgba(120, 169, 210, .14) !important;
display: flex !important;
flex-wrap: wrap !important;
gap: 12px !important;
justify-content: space-between !important;
align-items: center !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .coupon {
display: flex !important;
gap: 10px !important;
align-items: center !important;
flex: 1 1 auto !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .coupon input.input-text {
flex: 1 1 auto !important;
min-width: 0 !important;
padding: 11px 14px !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart button.button,
body.cablio-site .elementor-widget-woocommerce-cart input.button,
body.cablio-site .elementor-widget-woocommerce-cart a.button {
padding: 11px 18px !important;
border-radius: 10px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-size: .82rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
cursor: pointer !important;
white-space: nowrap !important;
text-decoration: none !important;
box-shadow: 0 8px 22px rgba(22, 200, 255, .22) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart button.button:disabled,
body.cablio-site .elementor-widget-woocommerce-cart button[name='update_cart']:disabled {
opacity: .5 !important;
cursor: not-allowed !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table { margin: 0 0 18px !important; }
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table th,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table td {
padding: 13px 0 !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
background: transparent !important;
vertical-align: top !important;
font-size: .95rem !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table th {
width: 42% !important;
font-weight: 600 !important;
color: rgba(247, 251, 255, .78) !important;
text-align: left !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table td {
text-align: right !important;
color: #f7fbff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .order-total th,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .order-total td {
padding: 18px 0 !important;
font-size: 1.1rem !important;
font-weight: 800 !important;
border-bottom: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .order-total td,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .order-total td .amount,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .order-total td strong {
color: #16c8ff !important;
font-size: 1.25rem !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .wc-proceed-to-checkout {
margin: 14px 0 0 !important;
padding: 0 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.checkout-button,
body.cablio-site .elementor-widget-woocommerce-cart .wc-proceed-to-checkout a.button {
display: block !important;
width: 100% !important;
padding: 16px 20px !important;
border-radius: 12px !important;
font-size: 1rem !important;
font-weight: 800 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-align: center !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .32) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .shipping-calculator-button {
color: #16c8ff !important;
text-decoration: underline !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-shipping-destination {
margin: 8px 0 12px !important;
padding: 12px 14px !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .5) !important;
font-size: .88rem !important;
color: rgba(247, 251, 255, .78) !important;
line-height: 1.5 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-shipping-destination strong { color: #f7fbff !important; }
body.cablio-site .elementor-widget-woocommerce-cart .wc-empty-cart-message,
body.cablio-site .elementor-widget-woocommerce-cart .cart-empty {
padding: 40px !important;
border-radius: 16px !important;
background: linear-gradient(180deg, #102231, #07111b) !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
color: #f7fbff !important;
text-align: center !important;
font-size: 1.05rem !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .return-to-shop {
margin: 18px 0 0 !important;
text-align: center !important;
}
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead { display: none !important; }
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody tr {
display: grid !important;
grid-template-columns: 64px 1fr auto !important;
gap: 6px 12px !important;
padding: 14px 0 !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody td { padding: 0 !important; border: none !important; }
body.cablio-site .elementor-widget-woocommerce-cart .actions { flex-direction: column !important; align-items: stretch !important; }
body.cablio-site .elementor-widget-woocommerce-cart .coupon { flex-direction: column !important; align-items: stretch !important; }
}
/* ============================================================
* Account dashboard tile icons (SVG inline)
* ============================================================ */
body.cablio-site.woocommerce-account .cablio-account-action::before {
content: "" !important;
display: block !important;
width: 48px !important;
height: 48px !important;
border: none !important;
border-radius: 14px !important;
background-color: rgba(22, 200, 255, .14) !important;
background-image: none !important;
background-position: center center !important;
background-repeat: no-repeat !important;
background-size: 26px 26px !important;
box-shadow: inset 0 0 0 1px rgba(22, 200, 255, .35) !important;
}
body.cablio-site.woocommerce-account .cablio-account-action.is-orders::before {
background-image: url("data:image/svg+xml;utf8,") !important;
}
body.cablio-site.woocommerce-account .cablio-account-action.is-downloads::before {
background-image: url("data:image/svg+xml;utf8,") !important;
}
body.cablio-site.woocommerce-account .cablio-account-action.is-addresses::before {
background-image: url("data:image/svg+xml;utf8,") !important;
}
body.cablio-site.woocommerce-account .cablio-account-action.is-account::before {
background-image: url("data:image/svg+xml;utf8,") !important;
}
body.cablio-site.woocommerce-account .cablio-account-action:hover::before {
background-color: rgba(22, 200, 255, .22) !important;
box-shadow: inset 0 0 0 1px rgba(22, 200, 255, .55) !important;
}
/* ============================================================
* Account addresses page - 2-column responsive grid
* ============================================================ */
body.cablio-site.woocommerce-account .cablio-account-addresses { display: block !important; }
body.cablio-site.woocommerce-account .cablio-account-addresses > p {
margin: 0 0 18px !important;
color: rgba(247, 251, 255, .78) !important;
font-size: .96rem !important;
}
body.cablio-site.woocommerce-account .cablio-account-addresses .u-columns,
body.cablio-site.woocommerce-account .cablio-account-addresses .woocommerce-Addresses,
body.cablio-site.woocommerce-account .cablio-account-addresses .col2-set {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
gap: 18px !important;
width: 100% !important;
max-width: none !important;
}
body.cablio-site.woocommerce-account .cablio-account-addresses .u-columns::before,
body.cablio-site.woocommerce-account .cablio-account-addresses .u-columns::after,
body.cablio-site.woocommerce-account .cablio-account-addresses .col2-set::before,
body.cablio-site.woocommerce-account .cablio-account-addresses .col2-set::after {
display: none !important;
content: none !important;
}
body.cablio-site.woocommerce-account .cablio-account-addresses .col-1,
body.cablio-site.woocommerce-account .cablio-account-addresses .col-2,
body.cablio-site.woocommerce-account .cablio-account-addresses .woocommerce-Address {
width: 100% !important;
max-width: none !important;
padding: 22px !important;
margin: 0 !important;
float: none !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .72), rgba(7, 17, 27, .82)) !important;
box-shadow: 0 14px 32px rgba(0, 0, 0, .26) !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title {
display: flex !important;
justify-content: space-between !important;
align-items: center !important;
gap: 12px !important;
margin: 0 0 14px !important;
padding: 0 0 12px !important;
border-bottom: 1px solid rgba(120, 169, 210, .18) !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title h2,
body.cablio-site.woocommerce-account .woocommerce-Address-title h3 {
margin: 0 !important;
padding: 0 !important;
font-size: 1rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .06em !important;
color: #f7fbff !important;
border: none !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title a.edit,
body.cablio-site.woocommerce-account .woocommerce-Address-title a.cablio-account-action-button {
padding: 8px 16px !important;
border-radius: 999px !important;
background: rgba(22, 200, 255, .14) !important;
border: 1px solid rgba(22, 200, 255, .4) !important;
color: #16c8ff !important;
font-size: .76rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address-title a.edit:hover {
background: rgba(22, 200, 255, .26) !important;
color: #fff !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address address {
margin: 0 !important;
padding: 0 !important;
font-style: normal !important;
color: rgba(247, 251, 255, .82) !important;
line-height: 1.65 !important;
font-size: .96rem !important;
}
/* ============================================================
* v4 - Order details + testimonials + downloads empty state
* ============================================================ */
body.cablio-site .woocommerce-order-details,
body.cablio-site .woocommerce-customer-details {
margin: 0 0 24px !important;
}
body.cablio-site .woocommerce-customer-details .woocommerce-columns,
body.cablio-site .woocommerce-customer-details .col2-set,
body.cablio-site .woocommerce-customer-details .u-columns {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
gap: 18px !important;
}
body.cablio-site .woocommerce-customer-details .woocommerce-columns::before,
body.cablio-site .woocommerce-customer-details .woocommerce-columns::after,
body.cablio-site .woocommerce-customer-details .col2-set::before,
body.cablio-site .woocommerce-customer-details .col2-set::after { display: none !important; content: none !important; }
body.cablio-site .woocommerce-customer-details .woocommerce-column,
body.cablio-site .woocommerce-customer-details .col-1,
body.cablio-site .woocommerce-customer-details .col-2 {
width: 100% !important;
max-width: none !important;
padding: 0 !important;
margin: 0 !important;
float: none !important;
}
body.cablio-site .woocommerce-customer-details address,
body.cablio-site .woocommerce-order-details address,
body.cablio-site .woocommerce-Address address,
body.cablio-site address {
display: block !important;
margin: 0 !important;
padding: 22px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 14px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .82), rgba(7, 17, 27, .9)) !important;
color: #f7fbff !important;
font-style: normal !important;
line-height: 1.65 !important;
font-size: .96rem !important;
box-shadow: 0 12px 28px rgba(0, 0, 0, .26) !important;
}
body.cablio-site .woocommerce-customer-details address strong,
body.cablio-site .woocommerce-order-details address strong,
body.cablio-site address strong { color: #f7fbff !important; }
body.cablio-site .woocommerce-customer-details--phone,
body.cablio-site .woocommerce-customer-details--email {
margin: 8px 0 0 !important;
padding: 0 !important;
background: transparent !important;
color: rgba(247, 251, 255, .82) !important;
}
body.cablio-site .woocommerce-order-details h2,
body.cablio-site .woocommerce-customer-details h2,
body.cablio-site .woocommerce-order-details h3 {
margin: 0 0 16px !important;
padding: 0 0 12px !important;
font-size: 1.4rem !important;
font-weight: 800 !important;
color: #f7fbff !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
}
body.cablio-site .woocommerce-order .woocommerce-notice,
body.cablio-site .woocommerce-thankyou-order-received {
margin: 0 0 24px !important;
padding: 18px 22px !important;
border: 1px solid rgba(22, 200, 255, .35) !important;
border-radius: 14px !important;
background: rgba(22, 200, 255, .08) !important;
color: #f7fbff !important;
font-size: 1.05rem !important;
}
body.cablio-site .woocommerce-order-overview {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)) !important;
gap: 12px !important;
margin: 0 0 24px !important;
padding: 0 !important;
list-style: none !important;
}
body.cablio-site .woocommerce-order-overview li {
margin: 0 !important;
padding: 16px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 12px !important;
background: rgba(7, 17, 27, .5) !important;
color: #f7fbff !important;
text-align: left !important;
}
body.cablio-site .woocommerce-order-overview li strong {
display: block !important;
margin-top: 4px !important;
color: #16c8ff !important;
}
body.cablio-site .cablio-downloads-empty {
display: flex !important;
flex-wrap: wrap !important;
gap: 16px !important;
align-items: center !important;
justify-content: space-between !important;
padding: 22px 26px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
color: #f7fbff !important;
}
body.cablio-site .cablio-downloads-empty span {
font-size: 1rem !important;
color: rgba(247, 251, 255, .85) !important;
}
body.cablio-site .cablio-downloads-empty a.button,
body.cablio-site .cablio-downloads-empty a.cablio-account-action-button {
padding: 12px 22px !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-size: .82rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
box-shadow: 0 12px 28px rgba(22, 200, 255, .25) !important;
}
/* ============================================================
* Testimonials section on home
* ============================================================ */
body.cablio-site .cablio-testimonials {
display: grid !important;
gap: 18px !important;
}
body.cablio-site .cablio-testimonials-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)) !important;
gap: 18px !important;
}
body.cablio-site .cablio-testimonial-card {
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 18px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .82), rgba(7, 17, 27, .9)) !important;
box-shadow: 0 14px 32px rgba(0, 0, 0, .26) !important;
}
body.cablio-site .cablio-testimonial-stars {
font-size: .95rem !important;
letter-spacing: .15em !important;
color: #ffc436 !important;
}
body.cablio-site .cablio-testimonial-quote {
margin: 0 !important;
color: rgba(247, 251, 255, .9) !important;
font-size: 1rem !important;
line-height: 1.6 !important;
font-style: italic !important;
}
body.cablio-site .cablio-testimonial-author {
display: flex !important;
align-items: center !important;
gap: 12px !important;
margin: 0 !important;
padding-top: 12px !important;
border-top: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .cablio-testimonial-avatar {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 42px !important;
height: 42px !important;
border-radius: 50% !important;
background: linear-gradient(135deg, #16c8ff, #6a3cff) !important;
color: #fff !important;
font-weight: 800 !important;
font-size: 1rem !important;
}
body.cablio-site .cablio-testimonial-meta {
display: flex !important;
flex-direction: column !important;
gap: 2px !important;
}
body.cablio-site .cablio-testimonial-name {
color: #f7fbff !important;
font-weight: 700 !important;
font-size: .95rem !important;
}
body.cablio-site .cablio-testimonial-role {
color: rgba(247, 251, 255, .6) !important;
font-size: .82rem !important;
}
/* ============================================================
* v5 - Cart layout HARD fix (force wide form column + table-layout)
* ============================================================ */
/* Force the 2-column layout container to give cart form ~65% */
body.cablio-site .elementor-widget-woocommerce-cart .e-cart__container,
body.cablio-site .woocommerce-cart .woocommerce {
display: grid !important;
grid-template-columns: minmax(0, 2fr) minmax(280px, 1fr) !important;
gap: 24px !important;
align-items: start !important;
width: 100% !important;
max-width: none !important;
flex-wrap: nowrap !important;
}
@media (max-width: 1024px) {
body.cablio-site .elementor-widget-woocommerce-cart .e-cart__container,
body.cablio-site .woocommerce-cart .woocommerce {
grid-template-columns: 1fr !important;
}
}
/* Reduce internal section padding so columns fit */
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section {
padding: 18px !important;
}
/* Cart product table - use auto layout, allow names to flow */
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table,
body.cablio-site .elementor-widget-woocommerce-cart table.cart,
body.cablio-site .woocommerce-cart-form table.shop_table {
table-layout: auto !important;
width: 100% !important;
}
/* Make header labels show on desktop properly */
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead,
body.cablio-site .woocommerce-cart-form table.shop_table thead {
display: table-header-group !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th,
body.cablio-site .woocommerce-cart-form table.shop_table thead th {
padding: 12px 8px !important;
white-space: nowrap !important;
}
/* Specific column widths to prevent vertical text wrapping */
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-remove,
body.cablio-site .woocommerce-cart-form table.shop_table .product-remove {
width: 36px !important;
padding: 12px 4px !important;
text-align: center !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-thumbnail,
body.cablio-site .woocommerce-cart-form table.shop_table .product-thumbnail {
width: 80px !important;
padding: 12px 8px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-name,
body.cablio-site .woocommerce-cart-form table.shop_table .product-name {
width: auto !important;
min-width: 160px !important;
padding: 12px 10px !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: break-word !important;
hyphens: none !important;
font-size: .95rem !important;
line-height: 1.4 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-name a,
body.cablio-site .woocommerce-cart-form table.shop_table .product-name a {
display: block !important;
white-space: normal !important;
word-break: normal !important;
overflow-wrap: break-word !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-price,
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-subtotal,
body.cablio-site .woocommerce-cart-form table.shop_table .product-price,
body.cablio-site .woocommerce-cart-form table.shop_table .product-subtotal {
width: 100px !important;
padding: 12px 8px !important;
text-align: right !important;
white-space: nowrap !important;
font-variant-numeric: tabular-nums !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-quantity,
body.cablio-site .woocommerce-cart-form table.shop_table .product-quantity {
width: 100px !important;
padding: 12px 8px !important;
text-align: center !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table .product-quantity input.qty,
body.cablio-site .woocommerce-cart-form table.shop_table .product-quantity input.qty {
width: 64px !important;
padding: 6px 8px !important;
}
/* Smaller thumbnail */
body.cablio-site .elementor-widget-woocommerce-cart .product-thumbnail img,
body.cablio-site .woocommerce-cart-form .product-thumbnail img {
width: 56px !important;
height: 56px !important;
object-fit: cover !important;
}
/* Price/subtotal numerics consistent size */
body.cablio-site .elementor-widget-woocommerce-cart .product-price .amount,
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal .amount,
body.cablio-site .woocommerce-cart-form .product-price .amount,
body.cablio-site .woocommerce-cart-form .product-subtotal .amount {
font-weight: 700 !important;
white-space: nowrap !important;
font-size: .92rem !important;
}
/* Mobile: stack rows */
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead,
body.cablio-site .woocommerce-cart-form table.shop_table thead {
display: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody tr,
body.cablio-site .woocommerce-cart-form table.shop_table tbody tr {
display: grid !important;
grid-template-columns: 56px 1fr auto !important;
grid-template-areas:
'thumb name remove'
'thumb price quantity'
'thumb subtotal subtotal' !important;
gap: 6px 12px !important;
padding: 14px !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table tbody td,
body.cablio-site .woocommerce-cart-form table.shop_table tbody td {
padding: 0 !important;
border: none !important;
width: auto !important;
text-align: left !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-thumbnail,
body.cablio-site .woocommerce-cart-form .product-thumbnail { grid-area: thumb !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-name,
body.cablio-site .woocommerce-cart-form .product-name { grid-area: name !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-price,
body.cablio-site .woocommerce-cart-form .product-price { grid-area: price !important; font-size: .88rem !important; color: rgba(247,251,255,.7) !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-quantity,
body.cablio-site .woocommerce-cart-form .product-quantity { grid-area: quantity !important; text-align: right !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal,
body.cablio-site .woocommerce-cart-form .product-subtotal { grid-area: subtotal !important; padding-top: 6px !important; border-top: 1px dashed rgba(120, 169, 210, .14) !important; text-align: right !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-remove,
body.cablio-site .woocommerce-cart-form .product-remove { grid-area: remove !important; justify-self: end !important; }
}
/* ============================================================
* v6 - Fix overlapping blocks, cart radical simplify, lost-password,
* orders table padding, mark highlight removal
* ============================================================ */
/* ============================================================
* Adresy page - remove nested box (address inside .woocommerce-Address)
* Fix header layout (EDYTUJ on right, title on left)
* ============================================================ */
body.cablio-site.woocommerce-account .woocommerce-Address {
position: relative !important;
display: block !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address .woocommerce-Address-title,
body.cablio-site.woocommerce-account .woocommerce-Address header.title {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: space-between !important;
gap: 12px !important;
margin: 0 0 14px !important;
padding: 0 0 12px !important;
border-bottom: 1px solid rgba(120, 169, 210, .18) !important;
text-align: left !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address .woocommerce-Address-title h2,
body.cablio-site.woocommerce-account .woocommerce-Address .woocommerce-Address-title h3,
body.cablio-site.woocommerce-account .woocommerce-Address header.title h2,
body.cablio-site.woocommerce-account .woocommerce-Address header.title h3 {
flex: 1 1 auto !important;
order: 1 !important;
margin: 0 !important;
padding: 0 !important;
font-size: 1rem !important;
text-align: left !important;
}
body.cablio-site.woocommerce-account .woocommerce-Address .woocommerce-Address-title a.edit,
body.cablio-site.woocommerce-account .woocommerce-Address .woocommerce-Address-title a.cablio-account-action-button,
body.cablio-site.woocommerce-account .woocommerce-Address header.title a.edit {
flex: 0 0 auto !important;
order: 2 !important;
margin: 0 !important;
}
/* Strip nested box styling from when inside .woocommerce-Address */
body.cablio-site.woocommerce-account .woocommerce-Address address {
display: block !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
border-radius: 0 !important;
background: transparent !important;
box-shadow: none !important;
color: rgba(247, 251, 255, .82) !important;
font-style: normal !important;
line-height: 1.65 !important;
font-size: .96rem !important;
}
/* But on order-view page, address SHOULD have box (no .woocommerce-Address wrapper there) */
body.cablio-site.woocommerce-view-order .woocommerce-customer-details address,
body.cablio-site.woocommerce-order-received .woocommerce-customer-details address {
display: block !important;
margin: 0 !important;
padding: 22px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 14px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .82), rgba(7, 17, 27, .9)) !important;
color: #f7fbff !important;
font-style: normal !important;
line-height: 1.65 !important;
font-size: .96rem !important;
}
/* ============================================================
* Mark highlight (yellow/black background on order status text)
* Make it just bold accent color
* ============================================================ */
body.cablio-site mark,
body.cablio-site .woocommerce mark,
body.cablio-site .woocommerce-order mark,
body.cablio-site .woocommerce-MyAccount-content mark {
background: transparent !important;
background-color: transparent !important;
color: #16c8ff !important;
font-weight: 700 !important;
padding: 0 !important;
}
/* ============================================================
* Lost password form - dark theme, no white background
* ============================================================ */
body.cablio-site.woocommerce-lost-password .woocommerce,
body.cablio-site.woocommerce-account .woocommerce form.lost_reset_password,
body.cablio-site .woocommerce form.lost_reset_password {
margin: 0 !important;
padding: 28px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, #102231, #07111b) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
color: #f7fbff !important;
}
body.cablio-site .woocommerce form.lost_reset_password p,
body.cablio-site.woocommerce-lost-password p {
color: rgba(247, 251, 255, .82) !important;
}
body.cablio-site .woocommerce form.lost_reset_password label,
body.cablio-site .woocommerce-account .woocommerce form label {
color: #f7fbff !important;
font-weight: 600 !important;
margin-bottom: 6px !important;
}
body.cablio-site .woocommerce form.lost_reset_password input.input-text,
body.cablio-site .woocommerce-account .woocommerce form input.input-text,
body.cablio-site .woocommerce-account .woocommerce form input[type='text'],
body.cablio-site .woocommerce-account .woocommerce form input[type='email'],
body.cablio-site .woocommerce-account .woocommerce form input[type='password'] {
width: 100% !important;
padding: 12px 14px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
font-size: .96rem !important;
}
body.cablio-site .woocommerce form.lost_reset_password input.input-text:focus,
body.cablio-site .woocommerce-account .woocommerce form input:focus {
border-color: #16c8ff !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(22, 200, 255, .18) !important;
}
body.cablio-site .woocommerce form.lost_reset_password button.button,
body.cablio-site .woocommerce form.lost_reset_password button[type='submit'] {
margin-top: 8px !important;
padding: 13px 28px !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
cursor: pointer !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .28) !important;
}
/* ============================================================
* Orders table - padding so order numbers don't hug edge
* ============================================================ */
body.cablio-site.woocommerce-account table.woocommerce-orders-table,
body.cablio-site.woocommerce-account table.shop_table_responsive,
body.cablio-site.woocommerce-account .woocommerce-orders-table {
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
border-collapse: separate !important;
border-spacing: 0 !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table thead th {
padding: 14px 18px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .22) !important;
background: transparent !important;
color: #f7fbff !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .08em !important;
font-size: .76rem !important;
text-align: left !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table tbody td {
padding: 16px 18px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .12) !important;
background: transparent !important;
color: rgba(247, 251, 255, .9) !important;
vertical-align: middle !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table tbody tr:last-child td {
border-bottom: none !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-number a {
color: #f7fbff !important;
font-weight: 700 !important;
text-decoration: none !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions {
text-align: right !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-actions a.button {
padding: 8px 18px !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
font-size: .76rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
}
/* ============================================================
* Cart - RADICAL simplify: hide thumbnail on desktop, remove price
* column, keep only: remove | name | quantity | subtotal
* Names get full width to flow naturally
* ============================================================ */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-thumbnail,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-thumbnail,
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-price,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-price {
display: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-name,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-name {
width: auto !important;
min-width: 0 !important;
padding: 16px 14px !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
hyphens: none !important;
font-size: 1rem !important;
font-weight: 600 !important;
line-height: 1.4 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-name a,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-name a {
display: inline !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
color: #f7fbff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-quantity,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-quantity {
width: 110px !important;
padding: 16px 8px !important;
text-align: center !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-subtotal,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-subtotal {
width: 110px !important;
padding: 16px 14px 16px 8px !important;
text-align: right !important;
white-space: nowrap !important;
font-weight: 700 !important;
font-variant-numeric: tabular-nums !important;
display: table-cell !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-remove,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-remove {
width: 44px !important;
padding: 16px 4px !important;
text-align: center !important;
}
/* Hide the corresponding header columns for thumbnail and price */
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th.product-thumbnail,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-thumbnail,
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th.product-price,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-price {
display: none !important;
}
/* Subtotal header should always show */
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th.product-subtotal,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-subtotal {
display: table-cell !important;
text-align: right !important;
padding-right: 14px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart table.shop_table thead th.product-quantity,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-quantity {
display: table-cell !important;
text-align: center !important;
}
/* Mobile cart - back to stacked card style */
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table thead {
display: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table tbody tr {
display: grid !important;
grid-template-columns: 1fr auto !important;
grid-template-areas:
'name remove'
'quantity subtotal' !important;
gap: 8px 12px !important;
padding: 14px !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table tbody td {
padding: 0 !important;
border: none !important;
width: auto !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-name { grid-area: name !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-quantity { grid-area: quantity !important; text-align: left !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal { grid-area: subtotal !important; text-align: right !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-remove { grid-area: remove !important; justify-self: end !important; }
}
/* ============================================================
* v7 - Single-column cart layout (form full width, totals below)
* ============================================================ */
/* When cart is in one-column layout */
body.cablio-site .elementor-widget-woocommerce-cart.e-cart-layout-one-column .e-cart__container,
body.cablio-site .elementor-widget-woocommerce-cart .e-cart__container {
display: grid !important;
grid-template-columns: 1fr !important;
gap: 24px !important;
width: 100% !important;
max-width: none !important;
}
/* Each section panel */
body.cablio-site .elementor-widget-woocommerce-cart .e-cart-section {
width: 100% !important;
margin: 0 !important;
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 92% 8%, rgba(22, 200, 255, .08), transparent 28%),
linear-gradient(180deg, #102231, #07111b) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .35) !important;
color: #f7fbff !important;
}
/* Cart product table - now has full width */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table {
width: 100% !important;
table-layout: auto !important;
margin: 0 !important;
border: none !important;
border-collapse: collapse !important;
background: transparent !important;
box-shadow: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form thead th,
body.cablio-site .woocommerce-cart-form table.shop_table thead th {
padding: 14px 16px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .22) !important;
background: transparent !important;
color: #f7fbff !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .08em !important;
font-size: .76rem !important;
white-space: nowrap !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form tbody td,
body.cablio-site .woocommerce-cart-form table.shop_table tbody td {
padding: 18px 16px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .12) !important;
background: transparent !important;
vertical-align: middle !important;
color: #f7fbff !important;
}
/* Force product name to flow naturally — full row width */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-name,
body.cablio-site .woocommerce-cart-form table.shop_table .product-name {
width: auto !important;
min-width: 280px !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
word-wrap: normal !important;
hyphens: none !important;
font-size: 1rem !important;
font-weight: 600 !important;
line-height: 1.4 !important;
text-align: left !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-name a,
body.cablio-site .woocommerce-cart-form table.shop_table .product-name a {
display: inline !important;
color: #f7fbff !important;
white-space: normal !important;
word-break: keep-all !important;
text-decoration: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-name a:hover {
color: #16c8ff !important;
}
/* Thumbnail */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-thumbnail,
body.cablio-site .woocommerce-cart-form table.shop_table .product-thumbnail {
width: 80px !important;
display: table-cell !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-thumbnail img,
body.cablio-site .woocommerce-cart-form table.shop_table .product-thumbnail img {
width: 56px !important;
height: 56px !important;
object-fit: cover !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .2) !important;
display: block !important;
}
/* Price column - keep visible in single-column layout */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-price,
body.cablio-site .woocommerce-cart-form table.shop_table .product-price {
display: table-cell !important;
width: 120px !important;
text-align: right !important;
white-space: nowrap !important;
font-weight: 600 !important;
font-variant-numeric: tabular-nums !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form thead th.product-price,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-price {
display: table-cell !important;
text-align: right !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form thead th.product-thumbnail,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-thumbnail {
display: table-cell !important;
}
/* Quantity */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-quantity {
width: 110px !important;
text-align: center !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-quantity input.qty {
width: 72px !important;
padding: 8px 10px !important;
text-align: center !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
font-weight: 600 !important;
}
/* Subtotal */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-subtotal {
width: 130px !important;
text-align: right !important;
white-space: nowrap !important;
font-weight: 800 !important;
color: #16c8ff !important;
font-variant-numeric: tabular-nums !important;
}
/* Remove button */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-remove {
width: 44px !important;
text-align: center !important;
padding: 14px 4px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-remove a {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
width: 30px !important;
height: 30px !important;
border-radius: 50% !important;
background: rgba(255, 255, 255, .06) !important;
color: rgba(247, 251, 255, .65) !important;
font-weight: 700 !important;
font-size: 1.1rem !important;
text-decoration: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-remove a:hover {
background: rgba(255, 80, 80, .2) !important;
color: #ff8080 !important;
}
/* Mobile cart - card layout */
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table thead {
display: none !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table tbody tr {
display: grid !important;
grid-template-columns: 56px 1fr auto !important;
grid-template-areas:
'thumb name remove'
'thumb price quantity'
'thumb subtotal subtotal' !important;
gap: 6px 12px !important;
padding: 14px !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table tbody td {
padding: 0 !important;
border: none !important;
width: auto !important;
text-align: left !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .product-thumbnail { grid-area: thumb !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-name { grid-area: name !important; min-width: 0 !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-price { grid-area: price !important; font-size: .88rem !important; color: rgba(247,251,255,.7) !important; text-align: left !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-quantity { grid-area: quantity !important; text-align: right !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-subtotal { grid-area: subtotal !important; padding-top: 6px !important; border-top: 1px dashed rgba(120, 169, 210, .14) !important; text-align: right !important; }
body.cablio-site .elementor-widget-woocommerce-cart .product-remove { grid-area: remove !important; justify-self: end !important; }
}
/* Cart totals section - now below the form */
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals,
body.cablio-site .elementor-widget-woocommerce-cart .cart-collaterals {
width: 100% !important;
max-width: 480px !important;
margin-left: auto !important;
float: none !important;
}
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals,
body.cablio-site .elementor-widget-woocommerce-cart .cart-collaterals {
max-width: none !important;
}
}
/* ============================================================
* v8 - FINAL polish: address cards (clean), cart wider+thumbs,
* shop sidebar+grid, full responsive
* ============================================================ */
/* ============================================================
* ADDRESSES - new template-based layout (no overlapping)
* ============================================================ */
body.cablio-site.woocommerce-account .cablio-account-addresses {
display: block !important;
}
body.cablio-site.woocommerce-account .cablio-addresses-intro {
margin: 0 0 20px !important;
color: rgba(247, 251, 255, .82) !important;
font-size: .96rem !important;
}
body.cablio-site.woocommerce-account .cablio-addresses-grid {
display: grid !important;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)) !important;
gap: 18px !important;
width: 100% !important;
max-width: none !important;
}
body.cablio-site.woocommerce-account .cablio-address-card {
display: flex !important;
flex-direction: column !important;
gap: 0 !important;
width: 100% !important;
margin: 0 !important;
padding: 0 !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 18px !important;
overflow: hidden !important;
background:
radial-gradient(circle at 92% 8%, rgba(22, 200, 255, .10), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .82), rgba(7, 17, 27, .9)) !important;
box-shadow: 0 14px 32px rgba(0, 0, 0, .26) !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__header {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
justify-content: space-between !important;
flex-wrap: nowrap !important;
gap: 12px !important;
margin: 0 !important;
padding: 18px 22px !important;
border-bottom: 1px solid rgba(120, 169, 210, .18) !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__title {
flex: 1 1 auto !important;
min-width: 0 !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
font-size: 1rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .06em !important;
color: #f7fbff !important;
text-align: left !important;
white-space: nowrap !important;
overflow: hidden !important;
text-overflow: ellipsis !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__edit {
flex: 0 0 auto !important;
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
margin: 0 !important;
padding: 8px 18px !important;
min-height: 0 !important;
border-radius: 999px !important;
border: 1px solid rgba(22, 200, 255, .4) !important;
background: rgba(22, 200, 255, .14) !important;
background-image: none !important;
color: #16c8ff !important;
-webkit-text-fill-color: #16c8ff !important;
font-size: .76rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
text-decoration: none !important;
white-space: nowrap !important;
box-shadow: none !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__edit:hover {
background: rgba(22, 200, 255, .26) !important;
background-image: none !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
transform: none !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__body {
padding: 18px 22px !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__body address {
display: block !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
box-shadow: none !important;
color: rgba(247, 251, 255, .92) !important;
font-style: normal !important;
line-height: 1.7 !important;
font-size: .96rem !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__empty {
margin: 0 !important;
padding: 16px !important;
border: 1px dashed rgba(120, 169, 210, .28) !important;
border-radius: 10px !important;
color: rgba(247, 251, 255, .65) !important;
font-style: italic !important;
text-align: center !important;
}
/* Mobile addresses */
@media (max-width: 480px) {
body.cablio-site.woocommerce-account .cablio-address-card__header {
flex-wrap: wrap !important;
padding: 16px 18px !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__title {
white-space: normal !important;
}
body.cablio-site.woocommerce-account .cablio-address-card__body {
padding: 16px 18px !important;
}
}
/* ============================================================
* CART - show thumbnails (override v6 hide)
* ============================================================ */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-thumbnail,
body.cablio-site .woocommerce-cart .woocommerce-cart-form table.shop_table .product-thumbnail {
display: table-cell !important;
width: 80px !important;
padding: 16px 8px 16px 16px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table thead th.product-thumbnail,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-thumbnail {
display: table-cell !important;
width: 80px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form .product-thumbnail img,
body.cablio-site .woocommerce-cart-form .product-thumbnail img {
display: block !important;
width: 56px !important;
height: 56px !important;
object-fit: cover !important;
border-radius: 12px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
background: rgba(7, 17, 27, .5) !important;
}
/* Show price column too in single-column layout */
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-price,
body.cablio-site .woocommerce-cart-form table.shop_table .product-price {
display: table-cell !important;
width: 110px !important;
padding: 16px 12px !important;
text-align: right !important;
white-space: nowrap !important;
font-weight: 600 !important;
color: rgba(247, 251, 255, .8) !important;
font-variant-numeric: tabular-nums !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table thead th.product-price,
body.cablio-site .woocommerce-cart-form table.shop_table thead th.product-price {
display: table-cell !important;
text-align: right !important;
}
/* Hide price/thumb on mobile (we have grid layout there) */
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-cart .woocommerce-cart-form table.shop_table .product-price {
display: none !important;
}
}
/* ============================================================
* SHOP - sidebar filters + product grid
* ============================================================ */
body.cablio-site .cablio-shop-body .elementor-container {
align-items: flex-start !important;
}
body.cablio-site .cablio-shop-sidebar > .elementor-widget-wrap {
position: sticky !important;
top: 100px !important;
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
padding: 22px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 92% 8%, rgba(22, 200, 255, .08), transparent 32%),
linear-gradient(180deg, rgba(17, 33, 48, .76), rgba(7, 17, 27, .86)) !important;
box-shadow: 0 14px 32px rgba(0, 0, 0, .26) !important;
}
body.cablio-site .cablio-shop-sidebar .elementor-widget-heading h3 {
margin: 0 0 4px !important;
padding: 0 0 12px !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
color: #f7fbff !important;
font-size: .92rem !important;
font-weight: 700 !important;
letter-spacing: .14em !important;
text-transform: uppercase !important;
}
/* Categories filter list */
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories li {
margin: 0 0 6px !important;
padding: 0 !important;
border: none !important;
}
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories li a {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 8px !important;
padding: 10px 14px !important;
border-radius: 10px !important;
border: 1px solid rgba(120, 169, 210, .14) !important;
background: rgba(7, 17, 27, .42) !important;
color: rgba(247, 251, 255, .82) !important;
text-decoration: none !important;
font-size: .92rem !important;
font-weight: 500 !important;
transition: all .18s ease !important;
}
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories li a:hover,
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories li.current-cat a {
background: rgba(22, 200, 255, .14) !important;
border-color: rgba(22, 200, 255, .5) !important;
color: #fff !important;
}
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-categories ul.product-categories .count {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 26px !important;
height: 22px !important;
padding: 0 6px !important;
border-radius: 999px !important;
background: rgba(22, 200, 255, .18) !important;
color: #16c8ff !important;
font-size: .72rem !important;
font-weight: 700 !important;
}
/* Price filter */
body.cablio-site .cablio-shop-sidebar .elementor-widget-woocommerce-product-price form.woocommerce-widget-price-filter,
body.cablio-site .cablio-shop-sidebar form.woocommerce-widget-price-filter {
margin: 0 !important;
}
body.cablio-site .cablio-shop-sidebar .price_slider_wrapper {
margin: 8px 0 !important;
}
body.cablio-site .cablio-shop-sidebar .ui-slider {
position: relative !important;
height: 4px !important;
background: rgba(120, 169, 210, .22) !important;
border-radius: 999px !important;
margin: 16px 6px !important;
}
body.cablio-site .cablio-shop-sidebar .ui-slider .ui-slider-range {
position: absolute !important;
height: 100% !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
border-radius: 999px !important;
}
body.cablio-site .cablio-shop-sidebar .ui-slider .ui-slider-handle {
position: absolute !important;
top: 50% !important;
width: 14px !important;
height: 14px !important;
margin-left: -7px !important;
margin-top: -7px !important;
border-radius: 50% !important;
background: #16c8ff !important;
border: 2px solid #fff !important;
box-shadow: 0 4px 12px rgba(22, 200, 255, .4) !important;
cursor: pointer !important;
}
body.cablio-site .cablio-shop-sidebar .price_slider_amount {
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
margin-top: 12px !important;
}
body.cablio-site .cablio-shop-sidebar .price_slider_amount .price_label {
color: rgba(247, 251, 255, .82) !important;
font-size: .88rem !important;
}
body.cablio-site .cablio-shop-sidebar .price_slider_amount button.button {
padding: 10px 16px !important;
border-radius: 999px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-size: .76rem !important;
font-weight: 700 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
cursor: pointer !important;
}
/* Product grid main column */
body.cablio-site .cablio-shop-main {
width: 75% !important;
}
body.cablio-site .cablio-shop-main .woocommerce-result-count {
margin: 0 0 14px !important;
color: rgba(247, 251, 255, .68) !important;
font-size: .88rem !important;
}
body.cablio-site .cablio-shop-main .woocommerce-ordering {
margin: 0 0 18px !important;
text-align: right !important;
}
body.cablio-site .cablio-shop-main .woocommerce-ordering select.orderby {
padding: 10px 14px !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
color: #fff !important;
font-size: .9rem !important;
cursor: pointer !important;
}
/* Responsive shop layout */
@media (max-width: 1024px) {
body.cablio-site .cablio-shop-body .elementor-container {
flex-wrap: wrap !important;
}
body.cablio-site .cablio-shop-sidebar,
body.cablio-site .cablio-shop-main {
width: 100% !important;
}
body.cablio-site .cablio-shop-sidebar > .elementor-widget-wrap {
position: static !important;
margin-bottom: 18px !important;
}
}
/* ============================================================
* GLOBAL responsive breakpoints (mobile / tablet / desktop)
* ============================================================ */
/* Tablet: 768-1024 */
@media (max-width: 1024px) {
body.cablio-site .elementor-section.elementor-section-boxed > .elementor-container,
body.cablio-site main.cablio-elementor-main > .elementor-section {
max-width: 100% !important;
}
body.cablio-site h1 { font-size: clamp(1.6rem, 4vw, 2.4rem) !important; }
body.cablio-site h2 { font-size: clamp(1.3rem, 3vw, 1.8rem) !important; }
}
/* Mobile: <768 */
@media (max-width: 768px) {
body.cablio-site .elementor-container {
padding-left: 14px !important;
padding-right: 14px !important;
}
body.cablio-site h1 { font-size: 1.55rem !important; line-height: 1.2 !important; }
body.cablio-site h2 { font-size: 1.25rem !important; line-height: 1.25 !important; }
body.cablio-site h3 { font-size: 1.1rem !important; }
/* Account dashboard tiles - 2 cols on mobile */
body.cablio-site.woocommerce-account .cablio-account-actions {
grid-template-columns: 1fr 1fr !important;
gap: 10px !important;
}
body.cablio-site.woocommerce-account .cablio-account-action {
min-height: 0 !important;
padding: 14px !important;
}
body.cablio-site.woocommerce-account .cablio-account-action::before {
width: 38px !important;
height: 38px !important;
background-size: 22px 22px !important;
}
body.cablio-site.woocommerce-account .cablio-account-action span {
font-size: .92rem !important;
}
body.cablio-site.woocommerce-account .cablio-account-action small {
font-size: .78rem !important;
}
/* MyAccount nav pills - smaller, wrap nicely */
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation ul {
gap: 8px !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li a {
padding: 8px 14px !important;
font-size: .82rem !important;
min-height: 0 !important;
}
/* Testimonials - 1 column */
body.cablio-site .cablio-testimonials-grid {
grid-template-columns: 1fr !important;
}
}
/* Phone: <480 */
@media (max-width: 480px) {
body.cablio-site.woocommerce-account .cablio-account-actions {
grid-template-columns: 1fr !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation ul {
flex-direction: column !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li {
width: 100% !important;
}
body.cablio-site.woocommerce-account .woocommerce-MyAccount-navigation li a {
width: 100% !important;
justify-content: flex-start !important;
}
/* Cart totals full width on phone */
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals,
body.cablio-site .elementor-widget-woocommerce-cart .cart-collaterals {
max-width: none !important;
}
}
/* ============================================================
* v9 - Homepage tiles: aligned icons + lift+glow animation
* ============================================================ */
/* Tiles container - equal-height grid */
body.cablio-site .cablio-elementor-tiles > .elementor-container {
align-items: stretch !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-column {
display: flex !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap {
display: flex !important;
flex-direction: column !important;
gap: 14px !important;
width: 100% !important;
padding: 28px 24px !important;
border: 1px solid rgba(120, 169, 210, .22) !important;
border-radius: 22px !important;
background:
radial-gradient(circle at 88% 12%, rgba(22, 200, 255, .12), transparent 38%),
linear-gradient(180deg, rgba(17, 33, 48, .88), rgba(7, 17, 27, .94)) !important;
box-shadow: 0 18px 40px rgba(0, 0, 0, .32) !important;
position: relative !important;
overflow: hidden !important;
isolation: isolate !important;
transition: transform .35s cubic-bezier(.2, .8, .2, 1), border-color .35s ease, box-shadow .35s ease !important;
}
/* Soft animated background sweep on hover */
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap::before {
content: '' !important;
position: absolute !important;
inset: -2px !important;
background: conic-gradient(from 200deg, transparent 0%, rgba(22, 200, 255, .35) 18%, transparent 38%) !important;
opacity: 0 !important;
transition: opacity .55s ease !important;
z-index: -1 !important;
pointer-events: none !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap:hover {
transform: translateY(-8px) !important;
border-color: rgba(22, 200, 255, .55) !important;
box-shadow:
0 26px 56px rgba(0, 0, 0, .42),
0 0 0 1px rgba(22, 200, 255, .25),
0 0 30px rgba(22, 200, 255, .18) !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap:hover::before {
opacity: 1 !important;
animation: cablioTileGlow 3.6s linear infinite !important;
}
@keyframes cablioTileGlow {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
/* Heading at top */
body.cablio-site .cablio-elementor-tiles .elementor-widget-heading {
order: 1 !important;
margin: 0 !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-heading h3 {
margin: 0 !important;
font-size: 1.18rem !important;
font-weight: 800 !important;
color: #f7fbff !important;
letter-spacing: .01em !important;
}
/* Icon image - centered, fixed-height container, no built-in animation */
body.cablio-site .cablio-elementor-tiles .elementor-widget-image,
body.cablio-site .cablio-tile-icon {
order: 2 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 140px !important;
margin: 4px 0 !important;
padding: 12px !important;
border-radius: 18px !important;
background:
radial-gradient(circle at 50% 40%, rgba(22, 200, 255, .14), transparent 60%),
rgba(7, 17, 27, .42) !important;
border: 1px solid rgba(120, 169, 210, .14) !important;
overflow: hidden !important;
transition: transform .5s cubic-bezier(.2, .8, .2, 1), background .35s ease !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-image .elementor-widget-container,
body.cablio-site .cablio-elementor-tiles .elementor-widget-image a,
body.cablio-site .cablio-elementor-tiles .elementor-widget-image figure {
display: flex !important;
align-items: center !important;
justify-content: center !important;
width: 100% !important;
height: 100% !important;
margin: 0 !important;
padding: 0 !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-image img {
width: auto !important;
height: 100% !important;
max-width: 100% !important;
max-height: 100% !important;
object-fit: contain !important;
margin: 0 !important;
padding: 0 !important;
border-radius: 0 !important;
transform: none !important;
animation: cablioTileFloat 4.6s ease-in-out infinite !important;
filter: drop-shadow(0 8px 16px rgba(22, 200, 255, .18)) !important;
}
@keyframes cablioTileFloat {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(-6px); }
}
/* On hover: icon container subtly scales + brighter glow */
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap:hover .elementor-widget-image {
background:
radial-gradient(circle at 50% 40%, rgba(22, 200, 255, .26), transparent 65%),
rgba(7, 17, 27, .5) !important;
transform: scale(1.04) !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap:hover .elementor-widget-image img {
filter: drop-shadow(0 12px 22px rgba(22, 200, 255, .42)) !important;
}
/* Disable any inherited Elementor hover animations on tiles */
body.cablio-site .cablio-elementor-tiles .elementor-animation-grow-rotate,
body.cablio-site .cablio-elementor-tiles [class*='elementor-animation-'] {
animation: cablioTileFloat 4.6s ease-in-out infinite !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-animation-grow-rotate:hover {
transform: none !important;
}
/* Description text */
body.cablio-site .cablio-elementor-tiles .elementor-widget-text-editor {
order: 3 !important;
margin: 0 !important;
flex: 1 1 auto !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-text-editor p {
margin: 0 !important;
color: rgba(247, 251, 255, .76) !important;
font-size: .94rem !important;
line-height: 1.55 !important;
}
/* Button */
body.cablio-site .cablio-elementor-tiles .elementor-widget-button {
order: 4 !important;
margin-top: auto !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-button .elementor-button {
display: inline-flex !important;
align-items: center !important;
gap: 8px !important;
width: 100% !important;
justify-content: center !important;
padding: 12px 18px !important;
border-radius: 12px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
background-color: transparent !important;
color: #fff !important;
border: none !important;
font-weight: 700 !important;
letter-spacing: .04em !important;
text-transform: uppercase !important;
font-size: .82rem !important;
box-shadow: 0 12px 28px rgba(22, 200, 255, .22) !important;
transition: transform .25s ease, box-shadow .25s ease !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-button .elementor-button:hover {
transform: translateY(-2px) !important;
box-shadow: 0 18px 36px rgba(22, 200, 255, .35) !important;
background: linear-gradient(135deg, #2dd4ff, #1495ce) !important;
}
/* Stagger entrance animation when tiles come into view */
body.cablio-site .cablio-elementor-tiles .elementor-column {
animation: cablioTileEnter .8s cubic-bezier(.2, .8, .2, 1) both !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(1) { animation-delay: 0s !important; }
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(2) { animation-delay: .1s !important; }
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(3) { animation-delay: .2s !important; }
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(4) { animation-delay: .3s !important; }
@keyframes cablioTileEnter {
from { opacity: 0; transform: translateY(28px); }
to { opacity: 1; transform: translateY(0); }
}
/* Stagger float animation - each tile floats with offset */
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(2) .elementor-widget-image img { animation-delay: .4s !important; }
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(3) .elementor-widget-image img { animation-delay: .8s !important; }
body.cablio-site .cablio-elementor-tiles .elementor-column:nth-child(4) .elementor-widget-image img { animation-delay: 1.2s !important; }
/* Mobile: tiles 2 cols / 1 col */
@media (max-width: 1024px) {
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap {
padding: 22px 18px !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-image,
body.cablio-site .cablio-tile-icon {
height: 120px !important;
}
}
@media (max-width: 600px) {
body.cablio-site .cablio-elementor-tiles .elementor-widget-image,
body.cablio-site .cablio-tile-icon {
height: 100px !important;
}
body.cablio-site .cablio-elementor-tiles .elementor-widget-heading h3 {
font-size: 1.05rem !important;
}
}
/* Respect motion preferences */
@media (prefers-reduced-motion: reduce) {
body.cablio-site .cablio-elementor-tiles .elementor-widget-image img,
body.cablio-site .cablio-elementor-tiles .elementor-column,
body.cablio-site .cablio-elementor-tiles .elementor-widget-wrap::before {
animation: none !important;
}
}
/* ============================================================
* v10 - Category filter pills + checkout dark theme
* ============================================================ */
body.cablio-site .cablio-cat-filter {
display: flex !important;
flex-direction: column !important;
gap: 6px !important;
margin: 0 !important;
}
body.cablio-site .cablio-cat-pill {
display: flex !important;
align-items: center !important;
justify-content: space-between !important;
gap: 10px !important;
padding: 11px 16px !important;
border-radius: 12px !important;
border: 1px solid rgba(120, 169, 210, .18) !important;
background: rgba(7, 17, 27, .42) !important;
color: rgba(247, 251, 255, .82) !important;
text-decoration: none !important;
font-size: .94rem !important;
font-weight: 500 !important;
transition: all .18s ease !important;
}
body.cablio-site .cablio-cat-pill:hover {
background: linear-gradient(135deg, rgba(22, 200, 255, .18), rgba(22, 200, 255, .08)) !important;
border-color: rgba(22, 200, 255, .55) !important;
color: #fff !important;
transform: translateX(2px) !important;
}
body.cablio-site .cablio-cat-pill em {
display: inline-flex !important;
align-items: center !important;
justify-content: center !important;
min-width: 28px !important;
height: 22px !important;
padding: 0 8px !important;
border-radius: 999px !important;
background: rgba(22, 200, 255, .18) !important;
color: #16c8ff !important;
font-size: .72rem !important;
font-weight: 700 !important;
font-style: normal !important;
}
body.cablio-site .cablio-cat-pill.is-all {
font-weight: 700 !important;
background: linear-gradient(135deg, rgba(22, 200, 255, .14), rgba(22, 200, 255, .04)) !important;
border-color: rgba(22, 200, 255, .35) !important;
color: #f7fbff !important;
}
/* Highlight current category on /kategoria-produktu/X/ pages */
body.cablio-site.tax-product_cat .cablio-cat-pill[href*="/kategoria-produktu/"] {
/* link with current category in URL would be highlighted via JS - simple version: hover only */
}
/* ============================================================
* Elementor checkout - dark panels + Polish form
* ============================================================ */
body.cablio-site .elementor-widget-woocommerce-checkout-page {
--sections-background-color: rgba(15, 28, 42, .92) !important;
--sections-border-color: rgba(120, 169, 210, .26) !important;
--sections-border-radius: 16px !important;
--headings-color: #f7fbff !important;
--form-fields-color: #f7fbff !important;
--form-fields-background-color: rgba(7, 17, 27, .6) !important;
--form-fields-border-color: rgba(120, 169, 210, .3) !important;
--form-fields-focus-border-color: #16c8ff !important;
}
body.cablio-site .elementor-widget-woocommerce-checkout-page .e-checkout__container,
body.cablio-site .woocommerce-checkout {
display: grid !important;
grid-template-columns: minmax(0, 1.4fr) minmax(320px, 1fr) !important;
gap: 24px !important;
align-items: start !important;
}
@media (max-width: 1024px) {
body.cablio-site .elementor-widget-woocommerce-checkout-page .e-checkout__container,
body.cablio-site .woocommerce-checkout {
grid-template-columns: 1fr !important;
}
}
body.cablio-site .elementor-widget-woocommerce-checkout-page .e-checkout-section,
body.cablio-site .woocommerce-checkout #customer_details,
body.cablio-site .woocommerce-checkout #order_review,
body.cablio-site .woocommerce-checkout .woocommerce-additional-fields,
body.cablio-site form.checkout_coupon,
body.cablio-site .woocommerce-checkout #payment {
padding: 24px !important;
border: 1px solid rgba(120, 169, 210, .26) !important;
border-radius: 16px !important;
background:
radial-gradient(circle at 92% 8%, rgba(22, 200, 255, .08), transparent 30%),
linear-gradient(180deg, #102231, #07111b) !important;
color: #f7fbff !important;
box-shadow: 0 14px 32px rgba(0, 0, 0, .26) !important;
}
body.cablio-site .woocommerce-checkout #customer_details {
display: block !important;
width: 100% !important;
float: none !important;
}
body.cablio-site .woocommerce-checkout #customer_details .col-1,
body.cablio-site .woocommerce-checkout #customer_details .col-2 {
width: 100% !important;
float: none !important;
padding: 0 !important;
margin: 0 0 18px !important;
}
body.cablio-site .woocommerce-checkout h3,
body.cablio-site .elementor-widget-woocommerce-checkout-page h3,
body.cablio-site .elementor-widget-woocommerce-checkout-page h4 {
margin: 0 0 18px !important;
padding: 0 0 12px !important;
border-bottom: 1px solid rgba(120, 169, 210, .2) !important;
color: #f7fbff !important;
font-size: 1.1rem !important;
font-weight: 700 !important;
text-transform: uppercase !important;
letter-spacing: .06em !important;
}
body.cablio-site .woocommerce-checkout label,
body.cablio-site .elementor-widget-woocommerce-checkout-page label {
display: block !important;
margin-bottom: 6px !important;
color: rgba(247, 251, 255, .85) !important;
font-size: .88rem !important;
font-weight: 500 !important;
}
body.cablio-site .woocommerce-checkout .required {
color: #16c8ff !important;
text-decoration: none !important;
}
body.cablio-site .woocommerce-checkout input[type='text'],
body.cablio-site .woocommerce-checkout input[type='email'],
body.cablio-site .woocommerce-checkout input[type='tel'],
body.cablio-site .woocommerce-checkout input[type='password'],
body.cablio-site .woocommerce-checkout textarea,
body.cablio-site .woocommerce-checkout select,
body.cablio-site .elementor-widget-woocommerce-checkout-page input.input-text,
body.cablio-site .elementor-widget-woocommerce-checkout-page textarea,
body.cablio-site .elementor-widget-woocommerce-checkout-page select {
width: 100% !important;
padding: 12px 14px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
font-size: .96rem !important;
}
body.cablio-site .woocommerce-checkout input:focus,
body.cablio-site .woocommerce-checkout textarea:focus,
body.cablio-site .woocommerce-checkout select:focus {
border-color: #16c8ff !important;
outline: none !important;
box-shadow: 0 0 0 3px rgba(22, 200, 255, .18) !important;
}
body.cablio-site .woocommerce-checkout-review-order-table {
width: 100% !important;
border: none !important;
border-collapse: collapse !important;
background: transparent !important;
}
body.cablio-site .woocommerce-checkout-review-order-table th,
body.cablio-site .woocommerce-checkout-review-order-table td {
padding: 12px 14px !important;
border: none !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
background: transparent !important;
color: #f7fbff !important;
font-size: .94rem !important;
}
body.cablio-site .woocommerce-checkout-review-order-table thead th {
font-weight: 700 !important;
color: rgba(247, 251, 255, .82) !important;
text-transform: uppercase !important;
letter-spacing: .04em !important;
font-size: .82rem !important;
}
body.cablio-site .woocommerce-checkout-review-order-table tfoot tr.order-total td,
body.cablio-site .woocommerce-checkout-review-order-table tfoot tr.order-total th,
body.cablio-site .woocommerce-checkout-review-order-table tfoot tr.order-total .amount {
color: #16c8ff !important;
font-size: 1.15rem !important;
font-weight: 800 !important;
}
body.cablio-site ul#shipping_method,
body.cablio-site ul.shipping_method {
list-style: none !important;
margin: 0 !important;
padding: 0 !important;
display: flex !important;
flex-direction: column !important;
gap: 6px !important;
}
body.cablio-site ul#shipping_method li,
body.cablio-site ul.shipping_method li {
display: flex !important;
align-items: center !important;
gap: 8px !important;
padding: 10px 12px !important;
border: 1px solid rgba(120, 169, 210, .18) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .42) !important;
}
body.cablio-site ul#shipping_method li label {
margin: 0 !important;
color: #f7fbff !important;
font-weight: 500 !important;
cursor: pointer !important;
flex: 1 !important;
}
body.cablio-site ul#shipping_method input[type='radio'] {
accent-color: #16c8ff !important;
width: 16px !important;
height: 16px !important;
}
body.cablio-site .showcoupon,
body.cablio-site .woocommerce-form-coupon-toggle a {
color: #16c8ff !important;
text-decoration: underline !important;
}
body.cablio-site .woocommerce-checkout #payment ul.payment_methods {
padding: 0 !important;
margin: 0 !important;
border-bottom: 1px solid rgba(120, 169, 210, .14) !important;
}
body.cablio-site .woocommerce-checkout #payment ul.payment_methods li {
padding: 14px 0 !important;
background: transparent !important;
border: none !important;
}
body.cablio-site .woocommerce-checkout #payment ul.payment_methods li label {
color: #f7fbff !important;
font-weight: 600 !important;
}
body.cablio-site .woocommerce-checkout #payment .payment_box {
background: rgba(7, 17, 27, .5) !important;
color: rgba(247, 251, 255, .82) !important;
border-radius: 10px !important;
padding: 14px !important;
margin-top: 8px !important;
}
body.cablio-site .woocommerce-checkout #payment .payment_box::before {
display: none !important;
}
body.cablio-site #place_order,
body.cablio-site button#place_order {
width: 100% !important;
padding: 16px 24px !important;
border-radius: 12px !important;
background: linear-gradient(135deg, #16c8ff, #0a78a8) !important;
color: #fff !important;
border: none !important;
font-size: 1rem !important;
font-weight: 800 !important;
letter-spacing: .06em !important;
text-transform: uppercase !important;
cursor: pointer !important;
box-shadow: 0 14px 32px rgba(22, 200, 255, .32) !important;
margin-top: 14px !important;
}
body.cablio-site #place_order:hover {
transform: translateY(-2px) !important;
box-shadow: 0 20px 40px rgba(22, 200, 255, .42) !important;
}
body.cablio-site .woocommerce-privacy-policy-text {
color: rgba(247, 251, 255, .68) !important;
font-size: .82rem !important;
line-height: 1.5 !important;
}
body.cablio-site .woocommerce-privacy-policy-link {
color: #16c8ff !important;
}
@media (max-width: 768px) {
body.cablio-site .elementor-widget-woocommerce-checkout-page .e-checkout-section,
body.cablio-site .woocommerce-checkout #customer_details,
body.cablio-site .woocommerce-checkout #order_review,
body.cablio-site .woocommerce-checkout #payment {
padding: 18px !important;
}
}
/* v11 - Orders table: bold white text, no dark cells */
body.cablio-site.woocommerce-account table.woocommerce-orders-table tbody td,
body.cablio-site.woocommerce-account table.woocommerce-orders-table tbody td a,
body.cablio-site.woocommerce-account table.shop_table_responsive tbody td,
body.cablio-site.woocommerce-account table.shop_table tbody td {
color: #f7fbff !important;
-webkit-text-fill-color: #f7fbff !important;
font-weight: 500 !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-number,
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-number a {
color: #ffffff !important;
-webkit-text-fill-color: #ffffff !important;
font-weight: 800 !important;
font-size: 1rem !important;
letter-spacing: .02em !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-status {
color: #f7fbff !important;
font-weight: 600 !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-date,
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-total {
color: rgba(247, 251, 255, .92) !important;
font-weight: 600 !important;
}
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-total .amount,
body.cablio-site.woocommerce-account table.woocommerce-orders-table .woocommerce-orders-table__cell-order-total strong {
color: #ffffff !important;
font-weight: 700 !important;
}
/* v12 - Fix vertical-wrapping prices and shipping labels */
/* Single product price - never wrap */
body.cablio-site .cablio-product-buy-panel .product-price,
body.cablio-site .cablio-product-summary .product-price,
body.cablio-site .product .price,
body.cablio-site .single-product .summary .price {
white-space: nowrap !important;
font-variant-numeric: tabular-nums !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
}
body.cablio-site .cablio-product-buy-panel .product-price .amount,
body.cablio-site .product .price .amount,
body.cablio-site .single-product .summary .price .amount {
white-space: nowrap !important;
display: inline !important;
}
/* Cart totals shipping list - labels on one line */
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .woocommerce-shipping-totals.shipping td,
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals .shipping td {
text-align: left !important;
padding-left: 0 !important;
}
body.cablio-site .elementor-widget-woocommerce-cart ul#shipping_method,
body.cablio-site .elementor-widget-woocommerce-cart ul.shipping_method,
body.cablio-site .cart_totals ul#shipping_method {
display: flex !important;
flex-direction: column !important;
gap: 6px !important;
margin: 0 !important;
padding: 0 !important;
list-style: none !important;
width: 100% !important;
}
body.cablio-site .elementor-widget-woocommerce-cart ul#shipping_method li,
body.cablio-site .cart_totals ul#shipping_method li {
display: flex !important;
flex-direction: row !important;
align-items: center !important;
flex-wrap: nowrap !important;
gap: 10px !important;
width: 100% !important;
padding: 8px 10px !important;
margin: 0 !important;
border: 1px solid rgba(120, 169, 210, .14) !important;
border-radius: 8px !important;
background: rgba(7, 17, 27, .35) !important;
white-space: normal !important;
}
body.cablio-site .elementor-widget-woocommerce-cart ul#shipping_method li input[type='radio'],
body.cablio-site .cart_totals ul#shipping_method li input[type='radio'] {
flex: 0 0 auto !important;
width: 16px !important;
height: 16px !important;
margin: 0 !important;
accent-color: #16c8ff !important;
}
body.cablio-site .elementor-widget-woocommerce-cart ul#shipping_method li label,
body.cablio-site .cart_totals ul#shipping_method li label {
flex: 1 1 auto !important;
margin: 0 !important;
padding: 0 !important;
color: #f7fbff !important;
font-size: .9rem !important;
font-weight: 500 !important;
white-space: normal !important;
word-break: keep-all !important;
overflow-wrap: normal !important;
cursor: pointer !important;
line-height: 1.35 !important;
}
/* Cart totals: shipping td needs wider column when methods listed */
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table .shipping {
display: table-row !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table .shipping th {
width: auto !important;
vertical-align: top !important;
padding-top: 14px !important;
}
body.cablio-site .elementor-widget-woocommerce-cart .cart_totals table.shop_table .shipping td {
width: 60% !important;
}
/* All amount values: never wrap */
body.cablio-site .woocommerce-Price-amount,
body.cablio-site .amount {
white-space: nowrap !important;
font-variant-numeric: tabular-nums !important;
}
/* v13 - Address change at checkout: unhide country, style shipping toggle */
/* Re-show country field — was hidden because PL was hardcoded */
body.cablio-site #billing_country_field,
body.cablio-site #shipping_country_field,
body.cablio-site .woocommerce-billing-fields #billing_country_field,
body.cablio-site .woocommerce-shipping-fields #shipping_country_field,
body.cablio-site .wc-block-components-address-form__country,
body.cablio-site [data-field-id="billing-country"],
body.cablio-site [data-field-id="shipping-country"] {
display: block !important;
}
/* "Ship to a different address?" — visible, styled */
body.cablio-site .woocommerce-shipping-fields h3,
body.cablio-site #ship-to-different-address {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 14px 18px !important;
margin: 18px 0 !important;
border: 1px solid rgba(22, 200, 255, .35) !important;
border-radius: 12px !important;
background: rgba(22, 200, 255, .08) !important;
color: #f7fbff !important;
font-size: 1rem !important;
font-weight: 600 !important;
text-transform: none !important;
letter-spacing: 0 !important;
cursor: pointer !important;
}
body.cablio-site #ship-to-different-address label,
body.cablio-site .woocommerce-shipping-fields h3 label {
display: inline-flex !important;
align-items: center !important;
gap: 10px !important;
margin: 0 !important;
padding: 0 !important;
border: none !important;
background: transparent !important;
color: #f7fbff !important;
font-weight: 600 !important;
cursor: pointer !important;
font-size: 1rem !important;
}
body.cablio-site #ship-to-different-address-checkbox,
body.cablio-site input[name="ship_to_different_address"] {
width: 18px !important;
height: 18px !important;
accent-color: #16c8ff !important;
cursor: pointer !important;
}
/* Shipping fields wrapper - shown when toggle is checked */
body.cablio-site .shipping_address {
margin-top: 14px !important;
padding-top: 14px !important;
border-top: 1px dashed rgba(120, 169, 210, .25) !important;
}
/* Select2 (country dropdown) - dark theme */
body.cablio-site .woocommerce .select2-container--default .select2-selection--single {
height: auto !important;
min-height: 46px !important;
padding: 4px 8px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
background: rgba(7, 17, 27, .6) !important;
}
body.cablio-site .woocommerce .select2-container--default .select2-selection--single .select2-selection__rendered {
line-height: 38px !important;
color: #fff !important;
-webkit-text-fill-color: #fff !important;
padding-left: 6px !important;
}
body.cablio-site .woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow {
height: 100% !important;
top: 0 !important;
right: 8px !important;
}
body.cablio-site .woocommerce .select2-container--default .select2-selection--single .select2-selection__arrow b {
border-color: #16c8ff transparent transparent !important;
}
/* Select2 dropdown panel */
body.cablio-site .select2-dropdown,
body.cablio-site .select2-container--default .select2-dropdown {
background: #102231 !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 10px !important;
}
body.cablio-site .select2-container--default .select2-results__option {
color: #f7fbff !important;
background: transparent !important;
padding: 10px 14px !important;
}
body.cablio-site .select2-container--default .select2-results__option--highlighted[aria-selected],
body.cablio-site .select2-container--default .select2-results__option--highlighted {
background: rgba(22, 200, 255, .18) !important;
color: #fff !important;
}
body.cablio-site .select2-search--dropdown .select2-search__field {
padding: 10px 12px !important;
border: 1px solid rgba(120, 169, 210, .3) !important;
border-radius: 8px !important;
background: rgba(7, 17, 27, .6) !important;
color: #fff !important;
}