:root {
   --ssc-border-radius:4px;
   --ssc-double-border-radius:8px;
   --ssc-primary-color: #000;
   --ssc-secondary-color: #eee;
   --ssc-button-border-radius:8px
}

body.shock-side-cart-open {
	overflow: hidden;
}

#shock-side-cart {		
	position: fixed;
	top: 0;
	transform: translateX(100%);
	right: 0;
	width: 100%;
	max-width: 480px;
	height: 100%;
	background: #fff;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	transition: transform .32s cubic-bezier(.68, 0, .29, 1);
	padding: 10px 20px 20px;
	box-sizing: border-box;	
}

#shock-side-cart-overlay {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #2937444D;
	z-index: 999998;
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.32s ease-out, visibility 0s 0.32s;
}

#shock-side-cart-overlay.visible {
	opacity: 1;
	visibility: visible;
	transition: opacity 0.32s ease-out, visibility 0s 0s;
}

#shock-side-cart.visible {
	transform: translateX(0);
}

/* laat de inner wrapper zelf een flex-column zijn */
#shock-side-cart .shock-side-cart__content {
	display: flex;
	flex-direction: column;
	flex: 1 1 auto;
	min-height: 0;   /* belangrijk: voorkomt dat de items de footer wegduwen */
}

#shock-side-cart .cart-header {
	background: #fff;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: stretch;	
	flex: 0 0 auto;
}

.ssc-title {
	font-weight: 500;
	font-size: 20px;
	line-height: 100%;
	color: #293744;
	margin: 0;
}

#shock-side-cart .close-cart {
	position: absolute;
	top: 20px;
	right: 25px;
	border: none;
	background: none;
	cursor: pointer;
	padding: 0;
	display: flex;
	justify-content: center;
	align-items: center;	
	transition: 0.24s ease-out opacity;
	height:auto;
}

#shock-side-cart .close-cart:hover {
	opacity:.7;
}

#shock-side-cart .close-cart .icon-close-sharp::before {
  font-size: 14px;   /* vervangt width/height */
  line-height: 1;
  display: block;
  color: #293744; 
}

#shock-side-cart .cart-items {
	flex: 1 1 auto;
	min-height: 0;
	overflow-y: auto;
	scrollbar-width:thin;
	padding-right:10px;
}

#shock-side-cart .cart-header-actions {
	margin-bottom: 10px;
	padding-bottom:10px;
	border-bottom:1px solid var(--ssc-secondary-color);
}

#shock-side-cart .side-cart-item {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	margin-top: 8px;
	padding: 8px 0px;
	transition: 0.24s ease-out opacity;
}

#shock-side-cart .cart-shipping-actions {
	padding: 8px 0px;
}

#shock-side-cart .side-cart-item .side-cart-item-left {
	display: flex;
	align-items: flex-start;
	justify-content: left;
	gap: 15px;
}

#shock-side-cart .side-cart-item .side-cart-item-right {
	display: flex;
	align-items: end;
	justify-content: right;
	gap: 5px;
	flex-direction: column;
	padding-top: 10px;
}

#shock-side-cart .side-cart-thumb {
	flex: 0 0 64px;
	width: 64px;
}

#shock-side-cart .side-cart-thumb img {
	width: 64px;
	height: 68px;	
	border-radius: var(--ssc-double-border-radius);
}

#shock-side-cart .side-cart-qty {
	display: flex;
	align-items: center;
	background: var(--ssc-secondary-color);
	padding: 0;
	height: 2rem;
	justify-content: space-between;
	width: 112px;
	margin-top: 5px;
	border-radius: var(--ssc-border-radius);
	overflow: hidden;
}

#shock-side-cart .qty-btn:focus {
	outline: none;
}

#shock-side-cart .qty-btn {
	background: transparent;
	border: none;
	border-radius: 0%;
	padding: 0;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2.5rem;
	height: 100%;
	transition: 0.24s ease-out background-color;
}

#shock-side-cart .qty-btn:hover {
	background: #d5d5d5;
}

#shock-side-cart .item-qty {
	display: inline-block;
	text-align: center;
}

#shock-side-cart .side-cart-remove button {
	background: none;
	border: none;
	font-size: 18px;
	cursor: pointer;
}

#shock-side-cart .remove-item {
	cursor: pointer;
}

#shock-side-cart .side-cart-title {
	line-height: 1.5;
}

#shock-side-cart .side-cart-title a {
	color: #293744;
}

#shock-side-cart .side-cart-variation-attributes {
	margin-top: 0;
	font-size: 14px;
	line-height: 1.35;
}

#shock-side-cart .side-cart-price {
	min-width: 80px;
	font-weight: 500;
	line-height: 100%;
	letter-spacing: 0%;
	text-align: right;	
	margin-top:10px;
}

#shock-side-cart .side-cart-price .tax_label {
	display:inline-block;
}

#shock-side-cart .upsell-item {
	background: var(--ssc-secondary-color);
	border-radius: var(--ssc-double-border-radius);
	padding: 10px;
	margin-bottom: 10px;
	display: flex;
	align-items: center;
	gap: 20px;
}

#shock-side-cart .upsell-item .upsell-item-image {
	width: 64px;
}

#shock-side-cart .upsell-item .upsell-top-content {
	width: calc(100% - 64px);
	display: flex;
    align-items: flex-start;
	gap:10px;
}

#shock-side-cart .upsell-item .upsell-top-content .upsell-info {
	flex:1 1 auto;
	min-width: 0;
}

#shock-side-cart .upsell-item .upsell-top-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

#shock-side-cart .upsell-item img {
	width: 100%;
	height: 100%;
	border-radius: var(--ssc-double-border-radius);
	object-fit: contain;
}

#shock-side-cart .upsell-title {
	font-weight: 600;
	font-weight: 500;
	font-size: 16px;
	line-height: 28px;
	color: #293744;
}

#shock-side-cart .upsell-desc {
	font-weight: 450;
	font-size: 14px;
	line-height: 20px;
	color: #293744;
}

#shock-side-cart .upsell-price {	
	font-size: 16px;
	line-height: 28px;
	color: #293744;
	white-space: nowrap;
}

#shock-side-cart .shock-side-add-to-cart {
	background: var(--ssc-primary-color);
	color: #ffffff;		
	border-radius: var(--ssc-button-border-radius);
	padding: 11px 15px;
	cursor: pointer;
	font-weight: 700;
	font-size: 14px;
	line-height: 100%;
	transition: 0.5s ease all;
}

#shock-side-cart .shock-side-add-to-cart:hover {
	opacity:0.8;	
}

#shock-side-cart .shock-side-add-to-cart:focus {
	outline: none;
}

#shock-side-cart .upsell-price-flex {
	flex: 0 0 100px;
    max-width: 100px;
    margin-left: auto;      /* duwt kolom helemaal naar rechts */
    display: flex;
    flex-direction: column;
    align-items: flex-end;  /* rechts uitlijnen */
    text-align: right;
    gap: 5px;   
}

#shock-side-cart .cart-footer {
	background: #fff;
	border-top: 1px solid var(--ssc-secondary-color);
	padding-top: 10px;	
	flex: 0 0 auto;
	margin-top: auto;
	position: sticky;
	bottom: 0;	
}

#shock-side-cart .side-cart-summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 1.5rem;
}

#shock-side-cart .side-cart-summary strong {
	font-weight: 400;
	font-size: 1rem;
	letter-spacing: 0;	
}

#shock-side-cart .side-cart-summary .side-cart-total-amount,
#shock-side-cart .side-cart-summary .side-cart-total-amount .woocommerce-Price-amount,
#shock-side-cart .side-cart-summary .side-cart-total-amount .woocommerce-Price-amount bdi {	
	font-size: 1.25rem;
	letter-spacing: 0;	
}

#shock-side-cart .ssc-btn {
	width: 100%;
	display: block;
	padding: 15px;
	border-radius: 6px;
	border: none;
	font-weight: 600;
	font-size: 16px;
	position: relative;
	background-color: var(--ssc-primary-color);
	color: #fff;		
	line-height: 1;
	text-transform: none;
	cursor: pointer;	
	padding: 15px 20px;
	float: none;	
	border-radius: var(--ssc-button-border-radius);
	border: 0;
	text-align: center;	
	-webkit-appearance: none;
	transition: 0.5s ease all;
}

#shock-side-cart .ssc-btn:hover {	
	opacity:0.8;
}

#shock-side-cart .ssc-btn:focus,
#shock-side-cart .continue-shopping:focus {
	outline: none;
}

/* Floating Action Button (open cart) */
.ssc-fab{
  position: fixed;
  right: 18px;
  bottom: 18px;
  width: 60px;
  height: 60px;
  border: 0;
  border-radius: 50%;
  background: var(--ssc-primary-color);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 9999;
  box-shadow: 0 8px 24px rgba(0,0,0,.15);
  transition: all .5s ease;
  padding: 0;
  line-height: 1;
}

.ssc-fab:hover { opacity:0.8; }
.ssc-fab:active { opacity:0.8; }

.ssc-fab-icon::before{
  /* iconfont grootte */
  font-size: 22px;
  line-height: 1;
  /* icon wit, contrasterend met primary */
  color: #fff;
  margin-top:5px;
}

/* Teller-badge rechtsboven op de knop */
.ssc-fab-count{
  box-sizing: border-box;
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 22px;
  height: 22px;
  padding: 0 5px;
  border-radius: 22px;
  background: var(--ssc-secondary-color);
  color: #000;
  font-size: 15px;  
  line-height: 20px;  
  font-weight: normal;
}

/* Verberg badge als 0 (optioneel) */
.ssc-fab-count.is-zero{ display:none; }

/* Verberg FAB op mobiel/desktop obv admin-toggle */
@media (max-width: 768px){
  .ssc-hide-mobile { display: none !important; }
}
@media (min-width: 768px){
  .ssc-hide-desktop { display: none !important; }
}


@media (max-width: 480px){
  .ssc-fab{ right: 14px; bottom: 14px; width: 52px; height: 52px; }
  .ssc-fab-icon::before{ font-size: 20px; }
}

#shock-side-cart .product-progress {	
	text-align: center;
}

#shock-side-cart .progress-text {
	margin-top: 0;
	margin-bottom: 10px;
	font-weight: 450;
	font-size: 14px;
	line-height: 100%;	
	text-align: center;	
}

#shock-side-cart .progress-bar {
	width: 100%;
	height: 6px;
	background-color: var(--ssc-secondary-color);
	border-radius: 4px;
	overflow: hidden;
	margin-top: 5px;
}

#shock-side-cart .progress-fill {
	height: 100%;
	background-color: var(--ssc-primary-color);
	width: 0;
	transition: width 0.4s ease;
}

#shock-side-cart .side-cart-item .side-cart-item-right .subscription-text {
	font-weight: 450;
	font-size: 11px;
	line-height: 100%;
	letter-spacing: 2%;
	text-align: center;
	color: #22272180;
	text-transform: uppercase;
}

#shock-side-cart .side-cart-summary .side-cart-subtotal .tax-content {
	font-weight: 400;
	font-size: 0.75rem;
	display: block;	
	opacity: 0.6;
	margin-top: 0.5rem;
}

#shock-side-cart .side-cart-summary .side-cart-subtotal .tax-content .woocommerce-Price-amount bdi {
	font-size: 0.75rem;
}

#shock-side-cart .side-cart-shipping {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 0.5rem;
}

#shock-side-cart .side-cart-shipping .shipping-content {	
	font-size: 1rem;
	letter-spacing: 0;
	text-align: right;	
}

#shock-side-cart .side-cart-shipping strong {
	font-weight: 400;
	font-size: 1rem;
	letter-spacing: 0;	
}

#shock-side-cart .side-cart-subtotal {
	display: flex;
	flex-direction: column;
	text-align: right;
	line-height: 1;
}

#shock-side-cart .side-cart-item.removing {
	filter: blur(2.5px) brightness(0.95);
	opacity: 0.4;
	pointer-events: none;
	transition: filter 0.24s, opacity 0.24s;
}

#shock-side-cart .side-cart-item.updating {
	opacity: 0.4;
}

#shock-side-cart .progress-fill {
	transition: width 0.7s cubic-bezier(.4, .7, .1, 1.1);
}

#shock-side-cart .side-cart-item-right button {
	background: transparent;
	padding: 0;
	border: none;
	transition: 0.24s ease-out opacity;
	height:auto;
}

#shock-side-cart .side-cart-item-right button:hover {
	opacity: 0.6;
}

#shock-side-cart .side-cart-item-right button:focus {
	outline: none;
}

#shock-side-cart .side-cart-item-right .remove-item .icon-close-sharp::before {
  font-size: 10px;
  line-height: 1;
  display: block;
  color: currentColor;
}

#shock-side-cart.is-loading .cart-header-actions {
	opacity: 1 !important;
	pointer-events: auto !important;
	z-index: 9999;
}

#shock-side-cart.is-loading .cart-items,
#shock-side-cart.is-loading .cart-footer,
#shock-side-cart.is-loading .cart-shipping-actions {
	opacity: 0.35;
	pointer-events: none;
}

#shock-side-cart.is-loading::before,
#shock-side-cart.is-loading::after {
	content: "";
	position: absolute;
	inset: 0;
	z-index: 9999;
	pointer-events: none;
}

#shock-side-cart.is-loading::before {
	background: rgba(255, 255, 255, 0.6);
	border-radius: 1rem 0 0 1rem;
}

#shock-side-cart.is-loading::after {
	width: 36px;
	height: 36px;
	margin: auto;
	border: 3px solid rgba(0, 0, 0, 0.15);
	border-top-color: rgba(0, 0, 0, 0.65);
	border-radius: 50%;
	animation: ssc-spin 0.8s linear infinite;
}

@keyframes ssc-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (max-width: 600px) {
	#shock-side-cart {
		width: calc(100% - 1rem);
	}
	#shock-side-cart .side-cart-qty {
		width: 90px;
	}
	#shock-side-cart .side-cart-qty,
	#shock-side-cart .side-cart-qty .qty-btn,
	#shock-side-cart .side-cart-price {
		font-size:14px;
	}
}

@media (max-width: 550px) {
	#shock-side-cart .upsell-item .upsell-item-image {
		/*width: 55px;*/
	}

	#shock-side-cart .upsell-item .upsell-top-content {
		width: 100%;		
	}

	#shock-side-cart {
		padding: 20px 15px 15px;
	}
	
	#shock-side-cart .close-cart {
		top: 25px;
	}
}


/* Cart counter (zelfde stijl als wishlist) */
.cart-counter,
.cart-counter-link .cart-counter {
  position: relative;
  display: inline-block;
  line-height: 1;
  vertical-align: middle;
  color: #000;
  cursor:pointer;
}

.cart-counter {
  margin-top:3px;
}

.cart-counter > span {
  position: relative;
  display: inline-block;
  line-height: 1;
  vertical-align: middle;
  color: #000;	
}

.cart-counter:focus,
.cart-counter-link:focus {
  outline: none;
}

/* Icon grootte */
.cart-counter .icon-cart,
.cart-counter .icon-cart-filled {
  font-size: 20px;
  line-height: 1;
}
.cart-counter .icon-cart::before,
.cart-counter .icon-cart-filled::before {
  font-size: 20px;
  color: #000;
}

/* Teller rechtsboven */
.cart-counter .cart-count {
  position: absolute;
  top: -6px;      /* tweak naar smaak */
  right: -10px;   /* tweak naar smaak */
  font-size: 14px;
  line-height: 1;
}

/* Link reset */
.cart-counter-link {
  text-decoration: none;
  color: inherit;
}

#shock-side-cart .ssc-error,
#shock-side-cart .ssc-message {
  padding: .75rem 1rem;
  border-radius: var(--ssc-border-radius);
  font-size: .9rem;
  line-height: 1.4;
  margin:0 !important;
  
}
#shock-side-cart .ssc-error {
  background:#ffe6e6;
  color:#b73535;
  border:1px solid #f5b5b5;
}
#shock-side-cart .ssc-message {
  background:#e8f7ef;
  color:#257a3e;
  border:1px solid #bfe7cf;
}

.woocommerce-notices-wrapper > .woocommerce-error {
  margin-bottom:10px !important;
}
