/* SES Smart Battery Landing.
   Layout, colours and text live in the Elementor template ("Smart Batteries Category Landing").
   This file only styles the [ses_smart_models] shortcode and a few details Elementor has no control for. */

/* ---- Hero / intro product shots: blend the light photo backdrop into the section background ---- */
.ses-sm-blend img{mix-blend-mode:multiply}
.ses-sm-hero .elementor-button,.ses-sm-cta .elementor-button,.ses-sm-acc .elementor-button{white-space:nowrap}

/* ---- Feature strips: thin dividers between icon boxes ---- */
.ses-sm-features>.elementor-widget-icon-box+.elementor-widget-icon-box,
.ses-sm-protect-grid>.elementor-widget-icon-box+.elementor-widget-icon-box{border-left:1px solid #D9E1E8}
.ses-sm-env-grid .elementor-icon-box-wrapper{align-items:center}

/* ---- Communication diagram ---- */
.ses-sm-diagram .ses-sm-node{position:relative}
.ses-sm-diagram .ses-sm-bus{position:relative}
.ses-sm-diagram .ses-sm-bus:before{content:"";position:absolute;left:0;right:0;top:50%;border-top:2px solid #0B3563}
.ses-sm-diagram .ses-sm-bus>.elementor-widget{position:relative;z-index:1}
.ses-sm-diagram .ses-sm-targets{position:relative}
.ses-sm-diagram .ses-sm-targets:before{content:"";position:absolute;left:0;top:25%;bottom:25%;border-left:2px solid #0B3563}
.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box{position:relative}
.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:before{content:"";position:absolute;left:-18px;top:50%;width:18px;border-top:2px solid #0B3563}
.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:after{content:"";position:absolute;left:-7px;top:50%;margin-top:-4px;border:5px solid transparent;border-left-color:#0B3563;border-right-width:0}

/* ---- Standards chips ---- */
.ses-sm-chips>.elementor-widget-heading{flex:1 1 0;min-width:96px}

/* ---- Accessories cards ---- */
.ses-sm-acc-grid .elementor-image-box-img img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:4px}
.ses-sm-acc-grid .elementor-widget-image-box{transition:box-shadow .2s ease,transform .2s ease}
.ses-sm-acc-grid .elementor-widget-image-box:hover{box-shadow:0 10px 30px rgba(6,32,53,.1);transform:translateY(-2px)}

/* ---- [ses_smart_models] ---- */
.ses-sm-models{font-family:Inter,sans-serif;width:100%}
.ses-sm-models__bar{display:flex;align-items:center;justify-content:space-between;gap:16px 24px;flex-wrap:wrap;margin:0 0 26px}
.ses-sm-tabs{display:flex;flex-wrap:wrap;border:1px solid #D9E1E8;border-radius:4px;overflow:hidden;background:#fff}
.ses-sm-tab{appearance:none;margin:0;padding:11px 26px;min-width:118px;border:0;border-right:1px solid #D9E1E8;border-radius:0;background:#fff;font:600 13px/1.2 Inter,sans-serif;color:#0A2A43;cursor:pointer;transition:background .2s ease,color .2s ease}
.ses-sm-tab:last-child{border-right:0}
.ses-sm-tab:hover,.ses-sm-tab:focus{background:#EAF0F6;color:#0A2A43}
.ses-sm-tab.is-active,.ses-sm-tab.is-active:hover,.ses-sm-tab.is-active:focus{background:#0B3563;color:#fff}
.ses-sm-models__all{display:inline-flex;align-items:center;gap:8px;font:700 13px/1.2 Inter,sans-serif;color:#0B3563!important;text-decoration:underline;text-underline-offset:3px}
.ses-sm-models__all:hover{color:#0A2A43!important}
.ses-sm-models__note{margin:0;padding:16px 18px;border:1px dashed #B9C6D0;border-radius:6px;font-size:14px;color:#4B5A66}

.ses-sm-panel{position:relative;padding:0 46px}
.ses-sm-panel[hidden]{display:none}
.ses-sm-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;-ms-overflow-style:none;padding:4px 0 8px}
.ses-sm-track::-webkit-scrollbar{display:none}
.ses-sm-card{flex:0 0 calc((100% - 48px)/3);scroll-snap-align:start;display:flex;flex-direction:column;align-items:center;margin:0;padding:22px 20px 24px;background:#fff;border:1px solid #E4E9EB;border-radius:6px;text-align:center;transition:box-shadow .2s ease,transform .2s ease}
.ses-sm-card:hover{box-shadow:0 10px 30px rgba(6,32,53,.1);transform:translateY(-2px)}
.ses-sm-card__media{display:block;width:100%;margin:0 0 14px}
.ses-sm-card__media img{display:block;width:100%;height:170px;object-fit:contain;mix-blend-mode:multiply}
.ses-sm-card__title{margin:0 0 8px;font:700 17px/1.3 Inter,sans-serif;color:#0A2A43}
.ses-sm-card__title a{color:inherit!important;text-decoration:none}
.ses-sm-card__spec{display:flex;justify-content:center;flex-wrap:wrap;gap:4px 14px;margin:0 0 6px;font:500 14px/1.4 Inter,sans-serif;color:#33475B}
.ses-sm-card__spec span{color:#B9C6D0}
.ses-sm-card__note{margin:0 0 16px;font:400 13px/1.4 Inter,sans-serif;color:#4B5A66}
.ses-sm-card__link{display:inline-flex;align-items:center;gap:8px;margin-top:auto;font:700 13px/1.2 Inter,sans-serif;letter-spacing:.6px;text-transform:uppercase;color:#0B3563!important;text-decoration:none}
.ses-sm-card__link:hover{color:#0A2A43!important}
.ses-sm-card__link svg{transition:transform .2s ease}
.ses-sm-card__link:hover svg{transform:translateX(3px)}
.ses-sm-nav{position:absolute;top:50%;z-index:2;display:flex;align-items:center;justify-content:center;width:36px;height:36px;margin-top:-18px;padding:0;border:0;border-radius:50%;background:transparent;color:#0A2A43;cursor:pointer;transition:background .2s ease,opacity .2s ease}
.ses-sm-nav:hover,.ses-sm-nav:focus{background:#E3EEF7;color:#0A2A43}
.ses-sm-nav--prev{left:0}
.ses-sm-nav--prev svg{transform:rotate(180deg)}
.ses-sm-nav--next{right:0}
.ses-sm-nav:disabled{opacity:.25;cursor:default;background:transparent}
.ses-sm-panel.is-static .ses-sm-nav{visibility:hidden}
.ses-sm-panel.is-static .ses-sm-track{justify-content:flex-start}

@media(max-width:1024px){
	.ses-sm-card{flex-basis:calc((100% - 24px)/2)}
	.ses-sm-features>.elementor-widget-icon-box:nth-child(odd),
	.ses-sm-protect-grid>.elementor-widget-icon-box:nth-child(4n+1){border-left:0}
}
@media(max-width:767px){
	.ses-sm-panel{padding:0 34px}
	.ses-sm-card{flex-basis:100%}
	.ses-sm-tab{flex:1 1 33%;min-width:0;padding:10px 8px;border-bottom:1px solid #D9E1E8}
	.ses-sm-protect-grid>.elementor-widget-icon-box:nth-child(odd){border-left:0}
	.ses-sm-diagram .ses-sm-bus:before,.ses-sm-diagram .ses-sm-targets:before,.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:before,.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:after{display:none}
}

/* ---- v1.0.1: soft edges on product shots, communication diagram layout ---- */
.ses-sm-blend img{-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-composite:intersect}
.ses-sm-diagram{flex-wrap:nowrap!important;align-items:center!important}
.ses-sm-diagram>.elementor-widget-heading{flex:0 0 132px!important;width:132px!important;max-width:132px!important}
.ses-sm-diagram>.ses-sm-bus{flex:1 1 80px!important;width:auto!important;min-width:80px}
.ses-sm-diagram>.ses-sm-targets{flex:0 0 228px!important;width:228px!important}
@media(max-width:767px){.ses-sm-diagram{flex-direction:column!important;align-items:stretch!important;gap:10px!important}.ses-sm-diagram>.elementor-widget-heading,.ses-sm-diagram>.ses-sm-bus,.ses-sm-diagram>.ses-sm-targets{flex:0 0 auto!important;width:100%!important;max-width:none!important}.ses-sm-diagram>.ses-sm-targets{padding-left:0!important}}
.ses-sm-diagram .ses-sm-targets:before{content:""!important;display:block!important;position:absolute;left:0;top:calc(50% - 35px)!important;bottom:auto!important;height:70px!important;width:0!important;border-left:2px solid #0B3563;background:none!important;opacity:1!important}
.ses-sm-diagram .ses-sm-bus:before{content:""!important;display:block!important;height:0!important;width:auto!important;background:none!important;opacity:1!important}

/* ---- v1.0.2: product shots in the hero and intro blend into the section background ---- */
.ses-sm-hero .elementor-widget-image img,.ses-sm-intro .elementor-widget-image img{mix-blend-mode:multiply;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(90deg,transparent 0,#000 12%,#000 88%,transparent 100%),linear-gradient(180deg,transparent 0,#000 12%,#000 88%,transparent 100%);mask-composite:intersect}

/* ---- v1.0.3: mobile tidy-up ---- */
.ses-sm-chips .elementor-heading-title{text-align:center}
@media(max-width:767px){.ses-sm-features>.elementor-widget-icon-box{border-left:0!important}.ses-sm-diagram .ses-sm-bus:before,.ses-sm-diagram .ses-sm-targets:before,.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:before,.ses-sm-diagram .ses-sm-targets>.elementor-widget-icon-box:after{display:none!important}.ses-sm-diagram .ses-sm-targets .elementor-icon-box-wrapper,.ses-sm-env-grid .elementor-icon-box-wrapper{display:flex!important;flex-direction:row!important;align-items:center!important;gap:16px;text-align:left!important}.ses-sm-diagram .ses-sm-targets .elementor-icon-box-icon,.ses-sm-env-grid .elementor-icon-box-icon{margin:0!important}.ses-sm-cta:before{background-image:linear-gradient(90deg,rgba(6,32,58,.95) 0%,rgba(6,32,58,.82) 100%)!important}}
