/*
 * Kreabel Off-canvas Checkout
 * Clean unminified stylesheet
 * Scope: front off-canvas, panier, confirmation ajout panier, compte, auth, checkout, paiement, popup PDF.
 * Important: CSS only. No PHP/JS logic is changed.
 */

:root {
  --kboc-black: #050505;
  --kboc-white: #ffffff;
  --kboc-blue: #2385e5;
  --kboc-blue-dark: #176fc7;
  --kboc-green: #58cf72;
  --kboc-red: #d71920;
  --kboc-grey-50: #f6f6f6;
  --kboc-grey-100: #eeeeee;
  --kboc-grey-200: #dedede;
  --kboc-grey-300: #c7c7c7;
  --kboc-grey-500: #8f8f8f;
  --kboc-text: #111111;
  --kboc-muted: #626262;
  --kboc-radius-sm: 14px;
  --kboc-radius-md: 18px;
  --kboc-radius-lg: 22px;
  --kboc-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
  --kboc-shadow-soft: 0 8px 18px rgba(0, 0, 0, 0.06);
  --kboc-panel-width: min(100vw, 520px);
  --kboc-font: inherit;
  --kboc-panel-padding: 22px;
}

/* --------------------------------------------------------------------------
   Global off-canvas shell
   -------------------------------------------------------------------------- */

html.kboc-no-scroll,
html.kboc-no-scroll body {
  overflow: hidden !important;
}

.kboc-root,
.kboc-root * {
  box-sizing: border-box;
}

.kboc-icon--account .kboc-badge{
	display: none;
}

.kboc-root {
  position: fixed;
  inset: 0;
  z-index: 2147483647;
  pointer-events: none;
  visibility: hidden;
  color: var(--kboc-text);
  font-family: var(--kboc-font);
}

.kboc-root.is-open {
    pointer-events: auto;
    visibility: visible;
    z-index: 2147483647;
}

.kboc-overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.42);
  opacity: 0;
  transition: opacity 0.22s ease;
}

.kboc-root.is-open .kboc-overlay {
  opacity: 1;
}

.kboc-panel {
  position: absolute;
  top: 0;
  right: 0;
  width: var(--kboc-panel-width);
  max-width: 100vw;
  height: 100%;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-radius: 20px;
  background: #E8E8E8;
  transform: translateX(100%);
  transition: transform 0.24s ease;
}

.kboc-root.is-open .kboc-panel {
  transform: translateX(0);
}

.kboc-panel__header {
  flex: 0 0 auto;
  min-height: 78px;
  display: grid;
  grid-template-columns: 54px minmax(0, 1fr) 54px;
  align-items: center;
  gap: 10px;
  padding: 18px 22px 12px;
}

.kboc-panel__title-wrap {
  display: contents;
}

.kboc-icon {
  position: relative;
  grid-column: 1;
  width: 42px;
  height: 46px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--kboc-blue);
}

/*.kboc-icon svg {
  display: block;
  width: 30px;
  height: 33px;
}*/

.kboc-icon--account svg {
  display: none;
}

.kboc-icon--account::before {
  content: "";
  display: block;
  width: 34px;
  height: 37px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
  background-image: url("data:image/svg+xml,%3Csvg width='34' height='37' viewBox='0 0 34 37' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M17 17C21.4183 17 25 13.4183 25 9C25 4.58172 21.4183 1 17 1C12.5817 1 9 4.58172 9 9C9 13.4183 12.5817 17 17 17Z' stroke='%232385e5' stroke-width='3'/%3E%3Cpath d='M2 35C2 27.8203 8.71573 22 17 22C25.2843 22 32 27.8203 32 35' stroke='%232385e5' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");
}

.kboc-badge, .kboc-header-badge {
    position: absolute;
    top: 4px;
    right: -12px;
    min-width: 25px;
    height: 25px;
    padding: 0px;
    border-radius: 999px;
    background: var(--kboc-blue);
    color: var(--kboc-white);
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
}

.kboc-title {
  grid-column: 2;
  margin: 0;
  color: var(--kboc-black);
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 28px;
  text-align: center;
}

.kboc-close {
  grid-column: 3;
  width: 22px;
  height: 22px;
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
}

.kboc-root[data-kboc-view="forgot"] .kboc-title,
.kboc-root[data-kboc-view="forgot"] .kboc-icon,
.kboc-root[data-kboc-view="added"] .kboc-title {
  visibility: hidden;
}

.kboc-panel__body {
  flex: 1 1 auto;
  overflow-y: auto;
  overflow-x: hidden;
  padding: 14px 22px 28px;
  scrollbar-color: rgba(0, 0, 0, 0.20) rgba(255, 255, 255, 0.9);
  scrollbar-width: thin;
}

.kboc-panel__body::-webkit-scrollbar {
  width: 7px;
}

.kboc-panel__body::-webkit-scrollbar-track {
  background: rgba(255, 255, 255, 0.9);
}

.kboc-panel__body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.20);
}

.kboc-loader {
  display: flex;
  justify-content: center;
  padding: 80px 0;
}

.kboc-loader span {
  width: 34px;
  height: 34px;
  border: 4px solid rgba(0, 0, 0, 0.12);
  border-top-color: var(--kboc-blue);
  border-radius: 50%;
  animation: kboc-spin 0.7s linear infinite;
}

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

/* --------------------------------------------------------------------------
   Shared elements
   -------------------------------------------------------------------------- */

.kboc-view {
  width: 100%;
}

.kboc-view__head {
  margin: 0 0 18px;
  text-align: center;
}

.kboc-view__head h3,
.kboc-choice-hero h3,
.kboc-added-hero h3 {
  margin: 0;
  font-size: 28px;
  line-height: 1.08;
  font-weight: 700;
  letter-spacing: -0.02em;
}

.kboc-view__head p {
  margin: 8px 0 0;
  color: var(--kboc-muted);
  font-size: 14px;
  line-height: 1.25;
}

.kboc-view--cart > .kboc-view__head {
  display: none;
}

.kboc-alert {
  margin: 0 0 16px;
  padding: 14px 16px;
  border-radius: var(--kboc-radius-sm);
  text-align: center;
  font-size: 14px;
  line-height: 1.25;
  font-weight: 700;
}

.kboc-alert--danger {
  color: #8a1111;
  background: #ffe8e8;
}

.kboc-alert--success {
  color: #0f6a28;
  background: #e6f8eb;
}

.kboc-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  text-decoration: none;
  cursor: pointer;
  padding: 10px 20px;
  gap: 10px;
  min-width: 180px;
  height: 55px;
  border-radius: 20px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-size: 18px;
  line-height: 21px;
  text-align: center;
  transition: filter 0.18s ease, transform 0.18s ease;
}

.kboc-btn:hover {
  filter: brightness(0.96);
}

.kboc-btn:active {
  transform: translateY(1px);
}

.kboc-btn--primary {
  background: var(--kboc-blue);
  color: var(--kboc-white);
}

.kboc-btn--dark {
  background: var(--kboc-black);
  color: var(--kboc-white);
}

.kboc-btn--icon-left {
      position: relative;
}

.kboc-btn--icon-right {
  justify-content: center;
  position: relative;
}

.kboc-btn--icon-right svg,
.kboc-btn--icon-left svg {
	position: absolute;
	width: 29px;
    height: 31px;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
}



.kboc-btn--icon-left svg {
	position: absolute;
	width: 29px;
    height: 31px;
	left: 20px;
    right: auto;
    top: 50%;
    transform: translateY(-50%);
}

.kboc-view--account .kboc-btn--icon-right,
.kboc-view--account .kboc-btn--icon-left,
.kboc-account-bottom-links{
	width: 100%;    
	    padding: 17px 61px 17px 61px;
    display: block;
    text-align: left;
}

.kboc-back,
.kboc-link-button {
  border: 0;
  padding: 0;
  background: transparent;
  color: var(--kboc-black);
  cursor: pointer;
  font: inherit;
}

.kboc-back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 18px;
  font-size: 15px;
  line-height: 1.2;
  font-weight: 700;
}

.kboc-empty {
  padding: 70px 0;
  text-align: center;
}

.kboc-empty .material-icons {
  font-size: 54px;
}

.kboc-empty .h4 {
  margin: 12px 0 8px;
  font-size: 24px;
  font-weight: 700;
}

.kboc-empty p {
  margin: 0 0 24px;
  color: var(--kboc-muted);
}

/* --------------------------------------------------------------------------
   Cart
   -------------------------------------------------------------------------- */

.kboc-products {
  display: grid;
  gap: 16px;
}

.kboc-product__subcontent{
	display: flex;
    width: 100%;
	gap: 10px;
}

.kboc-product {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 14px;
  align-items: center;
  padding: 22px 48px;
  height: 163px;
  background: #FFFFFF;
  border-radius: 20px;
  
}

.kboc-product__image,
.kboc-mini-product__image,
.kboc-added-product__image {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: var(--kboc-white);
}

.kboc-product__image {
    width: 84px;
    height: 51px;
}

.kboc-product__image img,
.kboc-mini-product__image img,
.kboc-added-product__image img,
.kboc-related-card__image img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
}

.kboc-product .h4 {
  margin: 0 0 8px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-size: 16px;
  line-height: 19px;
  color: var(--kboc-black);
}

.kboc-product .h4 a {
  color: var(--kboc-black);
  text-decoration: none;
}

.kboc-product__attrs {
  margin: 0 0 8px;
  color: var(--kboc-muted);
  font-size: 13px;
  line-height: 1.2;
}

.kboc-product__price {
  display: block;
  margin-bottom: 8px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-size: 25px;
  line-height: 29px;
  color: var(--kboc-black);
}

.kboc-product__eco {
  display: block;
  margin-bottom: 10px;
  color: var(--kboc-green);
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 16px;
  display: flex;
  align-items: center;
  color: #61D277;
}

.kboc-product__availability,
.kboc-related-card__stock {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  color: var(--kboc-black);
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  font-size: 14px;
  line-height: 16px;
}

.kboc-product__availability > span:first-child:not(.dlpro-delivery-available),
.kboc-related-card__stock > span:first-child:not(.dlpro-delivery-available) {
  flex: 0 0 auto;
  width: 9px;
  height: 9px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--kboc-green);
}

.kboc-product__availability > svg,
.kboc-related-card__stock > svg {
  flex: 0 0 10px;
  width: 10px;
  height: 10px;
  margin-top: 3px;
}

.kboc-product__availability .dlpro-delivery-available,
.kboc-related-card__stock .dlpro-delivery-available,
.kboc-product__availability .dlpro-delivery-available span,
.kboc-related-card__stock .dlpro-delivery-available span {
  flex: 1 1 auto;
  width: auto;
  height: auto;
  margin-top: 0;
  border-radius: 0;
  background: transparent;
}

.kboc-product__actions {
  display: grid;
  gap: 10px;
  justify-items: center;
}

.kboc-product__actions .kboc-qty,
.kboc-added-product__qty {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: var(--kboc-white);
  padding: 7px 17px;
  gap: 10px;
  width: 72px;
  height: 49px;
  border: 1px solid #8F8F8F;
  border-radius: 15px;
}

.kboc-product__actions .kboc-qty button,
.kboc-added-product__qty button {
  border: 0;
  padding: 0;
  background: transparent;
  cursor: pointer;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  font-size: 25px;
  line-height: 20px;
  text-align: center;
  color: #000000;
}

.kboc-product__actions .kboc-qty span,
.kboc-added-product__qty span {
  min-width: 16px;
  text-align: center;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  text-align: center;
  color: #000000;
}

.kboc-delete {
  width: 72px;
  height: 55px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 15px;
  background: var(--kboc-black);
  color: var(--kboc-white);
  cursor: pointer;
}

.kboc-delete .material-icons {
  font-size: 28px;
}

.kboc-voucher {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin: 18px 0;
      padding: 0px 15px;
}

.kboc-voucher label {
  display: none;
}

.kboc-voucher div {
display: flex;
flex-direction: row;
align-items: center;
padding: 0px;
gap: 20px;
width: 440px;
height: 55px;
}

.kboc-voucher input {
  width: 240px;
 height: 55px;
  border: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 9px 7px;
  gap: 10px;
  background: #FFFFFF;
  box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.1);
  border-radius: 20px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #000000;
}

.kboc-voucher button {
	    display: flex;
    flex-direction: row;
    align-items: center;
    padding: 10px 20px;
    gap: 10px;
    width: 180px;
    min-width: 180px;
    height: 55px;
    background: #1C7EE1;
    border-radius: 20px;
    justify-content: center;
    color: #fff;
    border: none;
}

.kboc-info-card {
  display: grid;
  grid-template-columns: 52px 1fr;
  margin: 20px 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 20px 30px;
  gap: 50px;
  height: 116px;
  background: #1C7EE1;
  box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  text-align: center;
  color: #FFFFFF;
}

.kboc-info-card a,
.kboc-info-card [data-kboc-delivery-pdf] {
  color: var(--kboc-white);
  text-decoration: underline;
  font-weight: 700;
  cursor: pointer;
}

.kboc-info-card__icon {
  display: grid;
  gap: 6px;
  justify-items: center;
  font-weight: 700;
}

.kboc-info-card__icon .material-icons {
  font-size: 40px;
}

.kboc-cart-footer {
  display: grid;
  gap: 14px;
  margin-top: 20px;
}

.kboc-total,
.kboc-added-total {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 22px;
  padding: 16px 18px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  color: var(--kboc-black);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-total span,
.kboc-added-total span {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 600;
	font-size: 18px;
	line-height: 20px;
	color: #000000;
}

.kboc-total strong,
.kboc-added-total strong {
	font-family: 'Raleway';
	font-style: normal;
	font-weight: 700;
	font-size: 25px;
	line-height: 20px;
	color: #000000;
}

/* --------------------------------------------------------------------------
   Added-to-cart confirmation
   -------------------------------------------------------------------------- */

.kboc-added-hero {
  margin: 4px 0 24px;
  text-align: center;
}

.kboc-added-product {
  display: grid;
  grid-template-columns: 86px minmax(0, 1fr) 88px;
  gap: 14px;
  align-items: center;
  margin-bottom: 18px;
  padding: 16px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-added-product__image {
  width: 86px;
  height: 86px;
}

.kboc-added-product__content .h4 {
  margin: 0 0 8px;
  font-size: 17px;
  line-height: 1.12;
  font-weight: 700;
}

.kboc-added-product__content strong {
  display: block;
  margin-bottom: 8px;
  font-size: 26px;
  line-height: 1;
  font-weight: 700;
}

.kboc-added-product__content span {
  font-size: 14px;
  line-height: 1.2;
}

.kboc-added-actions {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin: 18px 0 16px;
}

.kboc-added-actions .kboc-btn {
  min-height: 54px;
  padding-inline: 12px;
  white-space: nowrap;
}

.kboc-added-note {
  max-width: 360px;
  margin: 0 auto 24px;
  text-align: center;
  font-size: 15px;
  line-height: 1.25;
}

.kboc-related {
  margin-top: 18px;
}

.kboc-related__track {
  display: flex;
  gap: 14px;
  overflow-x: auto;
  padding: 0 2px 12px;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
}

.kboc-related__track::-webkit-scrollbar {
  height: 7px;
}

.kboc-related__track::-webkit-scrollbar-track {
  border-radius: 999px;
  background: var(--kboc-grey-200);
}

.kboc-related__track::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: var(--kboc-black);
}

.kboc-related-card {
  flex: 0 0 200px;
  width: 200px;
  padding: 18px 16px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  scroll-snap-align: start;
}

.kboc-related-card__image {
  height: 142px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.kboc-related-card .h4 {
  min-height: 50px;
  margin: 0 0 12px;
  font-size: 18px;
  line-height: 1.12;
  font-weight: 700;
}

.kboc-related-card .h4 a {
  color: var(--kboc-black);
  text-decoration: none;
}

.kboc-related-card strong {
  display: block;
  margin-bottom: 10px;
  font-size: 25px;
  font-weight: 700;
}

.kboc-related-card__actions {
  display: flex;
  gap: 10px;
  margin-top: 16px;
}

.kboc-related-card__heart,
.kboc-related-card__cart {
  width: 54px;
  height: 54px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: var(--kboc-radius-md);
  cursor: pointer;
}

.kboc-related-card__heart {
  background: var(--kboc-grey-200);
  color: var(--kboc-white);
}

.kboc-related-card__cart {
  background: var(--kboc-blue);
  color: var(--kboc-white);
}

/* --------------------------------------------------------------------------
   Checkout choice
   -------------------------------------------------------------------------- */

.kboc-choice-hero {
  margin: 4px 0 24px;
  text-align: center;
}

.kboc-choice-actions {
  display: grid;
  gap: 14px;
  margin-bottom: 20px;
}

.kboc-choice-note {
width: 470px;
font-family: 'Raleway';
font-style: normal;
font-weight: 500;
font-size: 16px;
line-height: 19px;
text-align: center;
color: #000000;
margin: 20px 0px 30px;
}



.kboc-products--mini {
  gap: 12px;
  margin-bottom: 22px;
}

.kboc-mini-product {
  display: grid;
  grid-template-columns: 78px 1fr 82px;
  gap: 12px;
  align-items: center;
  min-height: 78px;
  padding: 12px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-mini-product__image {
  width: 72px;
  height: 58px;
}

.kboc-mini-product__name {
  font-size: 17px;
  line-height: 1.12;
  font-weight: 700;
}

.kboc-total--choice {
  margin-bottom: 18px;
}

.kboc-view--checkout-choice > .kboc-btn--dark,
.kboc-view--checkout-choice > .kboc-btn--primary {
  margin-bottom: 14px;
  width: 100%;
}

.kboc-view--checkout-choice > .kboc-btn--primary:first-child {
  margin-top: 30px;
}

.kboc-view--checkout-choice > .kboc-btn--primary:last-child {
  margin-bottom: 0;
}

.kboc-view--checkout-choice .kboc-choice-actions{
	    margin-top: 35px;
}

/* --------------------------------------------------------------------------
   Account
   -------------------------------------------------------------------------- */

.kboc-account-hello {
  margin: 24px 0 20px;
  font-size: 18px;
  line-height: 1.2;
  font-weight: 700;
}

.kboc-account-details,
.kboc-account-grid a,
.kboc-account-row {
  display: block;
  margin-bottom: 16px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  color: var(--kboc-black);
  text-decoration: none;
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-account-details summary,
.kboc-account-grid a,
.kboc-account-row {
  position: relative;
  min-height: 56px;
      padding: 17px 61px 17px 61px;
  list-style: none;
  cursor: pointer;
  font-size: 18px;
  line-height: 1.18;
  font-weight: 500;
}

.kboc-account-details summary::-webkit-details-marker {
  display: none;
}

.kboc-account-details summary::after,
.kboc-account-grid a::after,
.kboc-account-row::after,
.kboc-view--account .kboc-btn--icon-right::after {
  content: "›";
  position: absolute;
  top: 50%;
  right: 22px;
  transform: translateY(-50%);
  font-size: 34px;
  line-height: 1;
  font-weight: 300;
}

.kboc-account-details[open] summary::after {
  content: "⌄";
  font-size: 26px;
  font-weight: 600;
}

.kboc-account-fields {
  display: grid;
  gap: 14px;
  padding: 0 22px 22px;
}

.kboc-account-fields div {
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-grey-50);
  color: var(--kboc-grey-500);
  box-shadow: var(--kboc-shadow-soft);
  font-size: 16px;
}

.kboc-account-section-title {
  margin: 28px 0 18px;
  text-align: center;
  font-size: 25px;
  line-height: 1.1;
  font-weight: 700;
}

.kboc-account-bottom-links {
  display: flex;
  justify-content: center;
  gap: 26px;
  margin: 22px 0;
  font-size: 16px;
}

.kboc-account-bottom-links a {
  color: var(--kboc-black);
  text-decoration: none;
}

.kboc-account-bottom-links a:last-child {
  text-decoration: underline;
}

.kboc-choice-list {
  display: grid;
  gap: 16px;
}

.kboc-choice-list button {
  min-height: 74px;
  border: 0;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  padding: 16px 18px;
  text-align: left;
  color: var(--kboc-black);
  cursor: pointer;
}

.kboc-choice-list strong {
  display: block;
  margin-bottom: 6px;
  font-size: 18px;
}

.kboc-choice-list span {
  display: block;
  color: var(--kboc-muted);
  font-size: 14px;
}

/* --------------------------------------------------------------------------
   Authentication: login, register, forgotten password
   Supports both native PrestaShop forms and custom auth form templates.
   -------------------------------------------------------------------------- */
.kboc-core-form,
.kboc-auth-form,
.kboc-forgot-form {
  width: 100%;
}

.kboc-core-form form,
.kboc-auth-form,
.kboc-forgot-form {
  display: grid;
  gap: 14px;
}

.kboc-core-form .form-group,
.kboc-core-form .form-floating,
.kboc-core-form .mb-3,
.kboc-auth-form .kboc-field {
  margin-bottom: 14px;
}

.kboc-core-form label,
.kboc-auth-form label,
.kboc-forgot-form label {
  display: block;
  margin-bottom: 7px;
  color: var(--kboc-black);
  text-align: left;
  font-size: 14px;
  line-height: 1.2;
  font-weight: 700;
}

.kboc-core-form input[type="text"],
.kboc-core-form input[type="email"],
.kboc-core-form input[type="password"],
.kboc-core-form input[type="tel"],
.kboc-core-form input[type="date"],
.kboc-core-form select,
.kboc-auth-form input,
.kboc-forgot-form input {
  width: 100%;
  min-height: 54px;
  border: 0;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  padding: 0 16px;
  color: var(--kboc-black);
  text-align: center;
  font-size: 16px;
  outline: none;
}

.kboc-core-form input:focus,
.kboc-auth-form input:focus,
.kboc-forgot-form input:focus,
.kboc-core-form select:focus {
  box-shadow: 0 0 0 2px rgba(35, 133, 229, 0.18), var(--kboc-shadow-soft);
}

.kboc-core-form .btn,
.kboc-auth-form .btn,
.kboc-auth-form .kboc-btn,
.kboc-forgot-form .kboc-btn {
  min-height: 54px;
  border: 0 !important;
  border-radius: var(--kboc-radius-md) !important;
  background: var(--kboc-blue) !important;
  color: var(--kboc-white) !important;
  font-size: 17px !important;
  font-weight: 700 !important;
}

.kboc-field--password {
  position: relative;
}

.kboc-password-toggle {
  position: absolute;
  right: 12px;
  bottom: 10px;
  width: 34px;
  height: 34px;
  border: 0;
  background: transparent;
  color: var(--kboc-muted);
  cursor: pointer;
}

.kboc-auth-forgot {
  display: inline-block;
  margin: 8px 0 18px;
  border: 0;
  background: transparent;
  color: var(--kboc-black);
  text-decoration: underline;
  cursor: pointer;
  font-size: 15px;
  font-weight: 700;
}

.kboc-auth-register-link {
  margin: 14px 0 20px;
  text-align: center;
}

.kboc-auth-register-link strong {
  display: inline-block;
  margin-right: 6px;
}

.kboc-auth-register-link button,
.kboc-alt-actions button {
  border: 0;
  background: transparent;
  color: var(--kboc-black);
  text-decoration: underline;
  cursor: pointer;
  font-weight: 700;
}

.kboc-new-customer-card {
  margin: 20px 0 14px;
  padding: 18px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  text-align: center;
}

.kboc-new-customer-card strong {
  display: block;
  margin-bottom: 8px;
  font-size: 18px;
  font-weight: 700;
}

.kboc-new-customer-card p {
  margin: 0;
  color: var(--kboc-muted);
  font-size: 14px;
  line-height: 1.3;
}

.kboc-auth-email-box {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 12px;
  margin-bottom: 18px;
}

.kboc-auth-email-box input {
  border: 0;
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 9px 30px;
  gap: 143px;
  height: 55px;
  background: #FFFFFF;
  box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  text-align: center;
  color: #000000;
}

.kboc-view--login .btn.btn-basic {
    font-family: 'Raleway';
    font-style: normal;
    font-weight: 500 !important;
    font-size: 16px !important;
    line-height: 19px;
    text-align: center;
    color: #000000 !important;
    background: transparent !important;
}

.kboc-view--login .buttons-wrapper--invert-mobile{
	    flex-direction: column;
}

.kboc-view--login .password-field button[data-ps-action="toggle-password"]{
	display: none !important;
}

.kboc-social-login {
  margin-top: 18px;
  text-align: center;
}

.kboc-social-login > span {
  display: block;
  margin-bottom: 14px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 26px;
  text-align: center;
  color: #000000;
}

.kboc-social-login > div {
  display: flex;
  justify-content: center;
  gap: 12px;
}

.kboc-social {
  width: 52px;
  height: 52px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  text-decoration: none;
  color: var(--kboc-white);
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  font-weight: 700;
}

.kboc-social--facebook {
  background: #1877f2;
}

.kboc-social--google {
  background: #ffffff;
  color: #222222;
  border: 1px solid var(--kboc-grey-200);
}

.kboc-social--apple {
  background: #000000;
}

.kboc-password-rules {
  display: grid;
  gap: 8px;
  margin: 10px 0 16px;
  text-align: left;
  color: var(--kboc-muted);
  font-size: 13px;
}

.kboc-password-rules div {
  display: flex;
  align-items: center;
  gap: 8px;
}

.kboc-password-rules span {
  width: 18px;
  height: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--kboc-grey-200);
  color: var(--kboc-black);
  font-size: 12px;
  font-weight: 700;
}

.kboc-password-rules .is-valid span {
  background: var(--kboc-green);
  color: var(--kboc-white);
}

.kboc-forgot-title {
  margin: 12px 0 18px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 700;
  font-size: 24px;
  line-height: 28px;
  text-align: center;
  color: #000000;
}

.kboc-brand-footer {
  margin-top: 54px;
  text-align: center;
}

.kboc-brand-logo {
  font-size: 40px;
  line-height: 1;
  font-weight: 700;
  letter-spacing: -0.04em;
}

.kboc-brand-logo span {
  color: var(--kboc-blue);
}

.kboc-brand-footer p {
  max-width: 340px;
  margin: 18px auto 0;
  font-size: 14px;
  line-height: 1.25;
}

.kboc-brand-footer a {
  color: var(--kboc-black);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   Native checkout wrapper inside off-canvas
   -------------------------------------------------------------------------- */

.kboc-view--checkout > .kboc-view__head,
.kboc-native-checkout > .kboc-view__head {
  display: none;
}

.kboc-checkout-summary {
  margin-bottom: 16px;
}

.kboc-summary-toggle {
  width: 100%;
  min-height: 54px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 10px;
  border: 0;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  padding: 0 18px;
  color: var(--kboc-black);
  cursor: pointer;
  font-size: 16px;
  font-weight: 700;
}

.kboc-summary-toggle > span:first-child {
  margin-right: auto;
}

.kboc-summary-toggle::after {
  content: '';
  width: 9px;
  height: 9px;
  flex: 0 0 auto;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
  transition: transform 0.2s ease;
}

.kboc-summary-toggle[aria-expanded="true"]::after {
  transform: rotate(-135deg);
}

.kboc-summary-content {
  margin-top: 12px;
  padding: 14px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-summary-products,
.kboc-summary-lines {
  display: grid;
  gap: 10px;
}

.kboc-summary-product,
.kboc-summary-lines > div {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: 10px;
  align-items: center;
  font-size: 13px;
}

.kboc-summary-product__name {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.kboc-summary-lines__total {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid var(--kboc-grey-200);
  font-size: 15px !important;
  font-weight: 700;
}

.kboc-checkout-process .step,
.kboc-native-checkout .step {
  display: none !important;
  margin-bottom: 16px;
  padding: 16px;
  border: 0 !important;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-checkout-process .step.step--current,
.kboc-checkout-process .step.kboc-step-visible,
.kboc-native-checkout .step.step--current,
.kboc-native-checkout .step.kboc-step-visible {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  height: auto !important;
}

.kboc-checkout-process .step__content,
.kboc-native-checkout .step__content {
  display: block !important;
  margin-top: 16px;
}

.kboc-checkout-process .step__title h1,
.kboc-checkout-process .step__title p,
.kboc-checkout-process .step__title-left,
.kboc-native-checkout .step__title h1,
.kboc-native-checkout .step__title p,
.kboc-native-checkout .step__title-left {
  margin: 0;
  text-align: center;
  font-size: 22px !important;
  line-height: 1.12;
  font-weight: 700 !important;
}

.kboc-checkout-process .step__title hr,
.kboc-native-checkout .step__title hr {
  display: none;
}

.kboc-checkout-process input[type="text"],
.kboc-checkout-process input[type="email"],
.kboc-checkout-process input[type="password"],
.kboc-checkout-process input[type="tel"],
.kboc-checkout-process input[type="date"],
.kboc-checkout-process select,
.kboc-checkout-process textarea,
.kboc-native-checkout input[type="text"],
.kboc-native-checkout input[type="email"],
.kboc-native-checkout input[type="password"],
.kboc-native-checkout input[type="tel"],
.kboc-native-checkout input[type="date"],
.kboc-native-checkout select,
.kboc-native-checkout textarea {
  min-height: 52px;
  border: 1px solid var(--kboc-grey-200) !important;
  border-radius: var(--kboc-radius-sm) !important;
  background: var(--kboc-white) !important;
  padding: 0 14px;
  color: var(--kboc-black);
  text-align: center;
  font-size: 15px;
}

.kboc-checkout-process textarea,
.kboc-native-checkout textarea {
  min-height: 100px;
  padding-top: 12px;
}

.kboc-checkout-process .buttons-wrapper,
.kboc-native-checkout .buttons-wrapper {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 12px !important;
}

.kboc-checkout-process .btn[data-ps-action="toggle-password"] {
    position: absolute;
    top: 50%;
    right: 18px;
    bottom: auto;
    transform: translateY(-50%);
    width: 38px;
    height: 38px;
    border: 0;
    background: transparent;
    color: #cfcfcf;
    padding: 0;
    cursor: pointer;
}

.kboc-checkout-process .form-check:not(.form-check-inline) {
    display: flex;
    gap: 10px;
}

.kboc-checkout-process .btn:not([data-ps-action="toggle-password"]),
.kboc-native-checkout .btn:not([data-ps-action="toggle-password"]) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-decoration: none !important;
	cursor: pointer !important;
	padding: 10px 20px !important;
	gap: 10px !important;
	min-width: 180px !important;
	height: 55px !important;
	border-radius: 20px !important;
	font-family: 'Raleway' !important;
	font-style: normal !important;
	font-weight: 700 !important;
	font-size: 18px !important;
	line-height: 21px !important;
	text-align: center !important;
	transition: filter 0.18s ease, transform 0.18s ease !important;
	width: 100%;
}

.kboc-checkout-process .btn-primary:not([data-ps-action="toggle-password"]),
.kboc-native-checkout .btn-primary:not([data-ps-action="toggle-password"]) {
	border: 0 !important;
	background: #1C7EE1!important;
	color: var(--kboc-white) !important;
	
}

.kboc-checkout-process .btn-outline-primary,
.kboc-native-checkout .btn-outline-primary {
  background: var(--kboc-white) !important;
  border-color: var(--kboc-black) !important;
  color: var(--kboc-black) !important;
}

/* --------------------------------------------------------------------------
   Addresses, delivery options, payment options
   -------------------------------------------------------------------------- */

.kboc-checkout-process .address__list,
.kboc-checkout-process .delivery-options,
.kboc-checkout-process .delivery-options__list,
.kboc-checkout-process .payment-options,
.kboc-checkout-process .payment-options__list,
.kboc-native-checkout .address__list,
.kboc-native-checkout .delivery-options,
.kboc-native-checkout .delivery-options__list,
.kboc-native-checkout .payment-options,
.kboc-native-checkout .payment-options__list {
  display: grid !important;
  gap: 14px !important;
}

.kboc-checkout-process .address-card,
.kboc-checkout-process .delivery-option,
.kboc-checkout-process .payment-option,
.kboc-native-checkout .address-card,
.kboc-native-checkout .delivery-option,
.kboc-native-checkout .payment-option {
  padding: 16px !important;
  border: 0 !important;
  border-radius: var(--kboc-radius-md) !important;
}

.kboc-checkout-process .address-card.selected,
.kboc-checkout-process .address-card--selected,
.kboc-checkout-process .delivery-option.selected,
.kboc-checkout-process .delivery-option:has(input:checked),
.kboc-checkout-process .payment-option.selected,
.kboc-checkout-process .payment-option:has(input:checked),
.kboc-native-checkout .address-card.selected,
.kboc-native-checkout .address-card--selected,
.kboc-native-checkout .delivery-option.selected,
.kboc-native-checkout .delivery-option:has(input:checked),
.kboc-native-checkout .payment-option.selected,
.kboc-native-checkout .payment-option:has(input:checked) {
  outline: none;
}

.kboc-checkout-process .address-card__container,
.kboc-native-checkout .address-card__container {
  padding: 0 !important;
}

.kboc-checkout-process .address-card__header,
.kboc-checkout-process .payment-option__form-check,
.kboc-checkout-process .payment-option label,
.kboc-native-checkout .address-card__header,
.kboc-native-checkout .payment-option__form-check,
.kboc-native-checkout .payment-option label {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.kboc-checkout-process .address-card__alias,
.kboc-checkout-process .payment-option__label,
.kboc-checkout-process .payment-option label span,
.kboc-native-checkout .address-card__alias,
.kboc-native-checkout .payment-option__label,
.kboc-native-checkout .payment-option label span {
  color: var(--kboc-black) !important;
  font-size: 16px !important;
  line-height: 1.2;
}

.kboc-checkout-process .address-card__content,
.kboc-native-checkout .address-card__content {
  margin-top: 12px;
  color: var(--kboc-muted);
  font-size: 14px;
  line-height: 1.35;
}

.kboc-checkout-process .address-card__actions,
.kboc-native-checkout .address-card__actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  margin-top: 12px !important;
}

.kboc-checkout-process .address-card__actions a,
.kboc-native-checkout .address-card__actions a {
  color: var(--kboc-black) !important;
  text-decoration: underline;
  font-size: 14px;
  font-weight: 700;
}

.kboc-checkout-process .payment-option img,
.kboc-native-checkout .payment-option img {
  max-height: 34px;
  width: auto;
}

.kboc-checkout-process .payment-option__additional-information,
.kboc-checkout-process .additional-information,
.kboc-native-checkout .payment-option__additional-information,
.kboc-native-checkout .additional-information {
  margin-top: 12px;
  padding: 12px;
  border-radius: var(--kboc-radius-sm);
  background: var(--kboc-grey-50);
  color: var(--kboc-muted);
  font-size: 13px;
  line-height: 1.35;
}

.kboc-checkout-process .payment-option__additional-information p,
.kboc-checkout-process .additional-information p,
.kboc-native-checkout .payment-option__additional-information p,
.kboc-native-checkout .additional-information p {
  margin: 0;
}

.kboc-checkout-process .payment-option .btn,
.kboc-checkout-process .payment-option button:not([type="radio"]):not([type="checkbox"]),
.kboc-checkout-process .payment-options__list .btn,
.kboc-native-checkout .payment-option .btn,
.kboc-native-checkout .payment-option button:not([type="radio"]):not([type="checkbox"]),
.kboc-native-checkout .payment-options__list .btn {
  display: none !important;
}

.kboc-checkout-process .payment-option__action,
.kboc-checkout-process .payment-option .payment-option__button,
.kboc-native-checkout .payment-option__action,
.kboc-native-checkout .payment-option .payment-option__button {
  display: none !important;
}

.kboc-checkout-process .js-alert-payment-conditions,
.kboc-native-checkout .js-alert-payment-conditions {
  display: none;
}


.kboc-checkout-process .js-alert-payment-conditions.kboc-alert,
.kboc-native-checkout .js-alert-payment-conditions.kboc-alert,
.kboc-checkout-process .kboc-required-message,
.kboc-native-checkout .kboc-required-message {
  margin: 12px 0 14px;
  text-align: left;
}

.kboc-checkout-process .kboc-required-checkbox-error,
.kboc-native-checkout .kboc-required-checkbox-error {
  outline: 2px solid var(--kboc-red);
  outline-offset: 4px;
  border-radius: 8px;
}

.kboc-checkout-process input[type="checkbox"][aria-invalid="true"],
.kboc-native-checkout input[type="checkbox"][aria-invalid="true"] {
  border-color: var(--kboc-red) !important;
}

/* --------------------------------------------------------------------------
   Radios and checkboxes
   -------------------------------------------------------------------------- */

.kboc-checkout-process .custom-radio,
.kboc-native-checkout .custom-radio {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 26px !important;
  height: 26px !important;
  min-width: 26px !important;
  margin: 0 !important;
}

.kboc-checkout-process input[type="radio"],
.kboc-checkout-process input[type="checkbox"],
.kboc-checkout-process .form-check-input,
.kboc-native-checkout input[type="radio"],
.kboc-native-checkout input[type="checkbox"],
.kboc-native-checkout .form-check-input,
.kboc-core-form input[type="radio"],
.kboc-core-form input[type="checkbox"] {
  appearance: none !important;
  -webkit-appearance: none !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 2px solid var(--kboc-black) !important;
  background: var(--kboc-white) !important;
  box-shadow: none !important;
  cursor: pointer;
}

.kboc-checkout-process input[type="radio"],
.kboc-native-checkout input[type="radio"],
.kboc-core-form input[type="radio"] {
  border-radius: 50% !important;
  margin-right: 10px !important;
}

.kboc-checkout-process input[type="checkbox"],
.kboc-native-checkout input[type="checkbox"],
.kboc-core-form input[type="checkbox"] {
  border-radius: 6px !important;
}

.kboc-checkout-process input[type="radio"]:checked,
.kboc-checkout-process .form-check-input[type="radio"]:checked,
.kboc-native-checkout input[type="radio"]:checked,
.kboc-native-checkout .form-check-input[type="radio"]:checked,
.kboc-core-form input[type="radio"]:checked {
  background: radial-gradient(circle at center, var(--kboc-blue) 0 45%, transparent 48%) var(--kboc-white) !important;
  border-color: var(--kboc-black) !important;
}

.kboc-checkout-process input[type="checkbox"]:checked,
.kboc-checkout-process .form-check-input[type="checkbox"]:checked,
.kboc-native-checkout input[type="checkbox"]:checked,
.kboc-native-checkout .form-check-input[type="checkbox"]:checked,
.kboc-core-form input[type="checkbox"]:checked {
  background-color: var(--kboc-blue) !important;
  border-color: var(--kboc-blue) !important;
  background-image: url("data:image/svg+xml,%3Csvg width='18' height='14' viewBox='0 0 18 14' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1.5 7L6.5 12L16.5 2' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 14px 12px !important;
}

.kboc-checkout-process #conditions-to-approve,
.kboc-checkout-process .js-conditions-to-approve,
.kboc-native-checkout #conditions-to-approve,
.kboc-native-checkout .js-conditions-to-approve {
  margin-top: 16px;
  padding: 14px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
}

.kboc-checkout-process #checkout-payment-step .ps-hidden-by-js{
	    margin-top: 1rem !important;
		    padding: 14px 14px 0px;
}

.kboc-checkout-process #conditions-to-approve  .form-check{
    display: flex;
    gap: 10px;
    padding: 0 ;
}

.kboc-checkout-process #conditions-to-approve label,
.kboc-checkout-process .js-conditions-to-approve label,
.kboc-native-checkout #conditions-to-approve label,
.kboc-native-checkout .js-conditions-to-approve label {
  gap: 12px;
  color: var(--kboc-black);
  font-size: 14px;
  line-height: 1.3;
}

/* --------------------------------------------------------------------------
   Delivery date / retrieval slot selector
   -------------------------------------------------------------------------- */

.kboc-delivery-date {
  margin: 16px 0;
  padding: 16px;
  border-radius: var(--kboc-radius-md);
  background: var(--kboc-blue);
  color: var(--kboc-white);
}

.kboc-delivery-date__title {
  margin-bottom: 6px;
  text-align: center;
  font-size: 20px;
  line-height: 1.15;
}

.kboc-delivery-date__intro {
  margin: 0 0 14px;
  text-align: center;
  font-size: 14px;
  line-height: 1.25;
}

.kboc-delivery-date__fields {
  display: grid;
  gap: 12px;
}

.kboc-delivery-date__fields label {
  display: grid;
  gap: 6px;
  margin: 0;
  font-size: 14px;
}

.kboc-delivery-date__fields input,
.kboc-delivery-date__fields select {
  min-height: 50px;
  border: 0 !important;
  border-radius: var(--kboc-radius-sm) !important;
  background: var(--kboc-white) !important;
  color: var(--kboc-black);
  text-align: center;
}

.kboc-delivery-date__preview {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  margin-top: 14px;
  padding: 12px;
  border-radius: var(--kboc-radius-sm);
  background: rgba(255, 255, 255, 0.16);
}

/* --------------------------------------------------------------------------
   PDF popup
   -------------------------------------------------------------------------- */

.kboc-pdf-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px;
}

.kboc-pdf-modal__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.58);
}

.kboc-pdf-modal__dialog {
  position: relative;
  width: min(920px, 96vw);
  height: min(780px, 88vh);
  border-radius: var(--kboc-radius-lg);
  background: var(--kboc-white);
  overflow: hidden;
  box-shadow: 0 24px 70px rgba(0, 0, 0, 0.34);
}

.kboc-pdf-modal__close {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 2;
  width: 40px;
  height: 40px;
  border: 0;
  border-radius: 50%;
  background: var(--kboc-black);
  color: var(--kboc-white);
  cursor: pointer;
  font-size: 28px;
  line-height: 1;
}

.kboc-pdf-modal__frame {
  width: 100%;
  height: 100%;
  border: 0;
  background: var(--kboc-white);
}

/* --------------------------------------------------------------------------
   Order delivery slot display: BO and customer account
   -------------------------------------------------------------------------- */

.kboc-admin-delivery-slot,
.kboc-order-delivery-slot {
  margin: 12px 0;
  padding: 14px;
  border-radius: var(--kboc-radius-sm);
  background: var(--kboc-grey-50);
  border-left: 4px solid var(--kboc-blue);
}

.kboc-admin-delivery-slot strong,
.kboc-order-delivery-slot strong {
  display: block;
  margin-bottom: 4px;
}

/* --------------------------------------------------------------------------
   Responsive
   -------------------------------------------------------------------------- */

@media (max-width: 560px) {
  :root {
    --kboc-panel-width: 100vw;
    --kboc-panel-padding: 18px;
  }

  .kboc-panel__header {
    min-height: 70px;
    padding: 16px 18px 10px;
    grid-template-columns: 48px minmax(0, 1fr) 48px;
  }

  .kboc-panel__body {
    padding: 12px 18px 24px;
  }

  .kboc-title {
    font-size: 25px;
  }

  .kboc-view__head h3,
  .kboc-choice-hero h3,
  .kboc-added-hero h3 {
    font-size: 26px;
  }

  .kboc-product {
    grid-template-columns: minmax(0, 1fr) 76px;
    gap: 10px;
    padding: 14px;
  }
  
  .

  .kboc-product__image,
  .kboc-added-product__image {
    width: 72px;
    height: 72px;
  }

  .kboc-product .h4,
  .kboc-added-product__content .h4 {
    font-size: 15px;
  }

  .kboc-product__price,
  .kboc-added-product__content strong {
    font-size: 22px;
  }

  .kboc-product__actions .kboc-qty,
  .kboc-added-product__qty,
  .kboc-delete {
    width: 76px;
    min-width: 76px;
    height: 50px;
  }

  .kboc-product__actions .kboc-qty {
    gap: 7px;
  }

  .kboc-product__actions .kboc-qty button,
  .kboc-added-product__qty button {
    font-size: 20px;
  }

  .kboc-product__actions .kboc-qty span,
  .kboc-added-product__qty span {
    font-size: 19px;
  }

  .kboc-voucher {
    padding: 0;
  }

  .kboc-info-card {
    grid-template-columns: 76px 1fr;
    padding: 16px;
    font-size: 14px;
  }

  .kboc-added-actions {
    grid-template-columns: 1fr;
  }

  .kboc-auth-email-box {
    grid-template-columns: 1fr;
  }

  .kboc-mini-product {
    grid-template-columns: 68px 1fr 76px;
  }

  .kboc-mini-product__image {
    width: 64px;
  }

  .kboc-related-card {
    flex-basis: 184px;
    width: 184px;
  }

  .kboc-related-card__image {
    height: 132px;
  }

  .kboc-pdf-modal {
    padding: 12px;
  }

  .kboc-pdf-modal__dialog {
    width: 100%;
    height: 86vh;
    border-radius: var(--kboc-radius-md);
  }
}


/* --------------------------------------------------------------------------
   v1.0.28 - Auth panels restored to custom maquette markup
   -------------------------------------------------------------------------- */

.kboc-auth-form {
  display: block;
  width: 100%;
}

.kboc-auth-form .kboc-field,
.kboc-forgot-form {
  margin: 0 0 20px;
}

.kboc-auth-form label:not(.kboc-register-consent):not(.kboc-gender-row label),
.kboc-forgot-form label {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}

.kboc-auth-form input[type="text"],
.kboc-auth-form input[type="email"],
.kboc-auth-form input[type="password"],
.kboc-forgot-form input[type="email"] {
  width: 100%;
  min-height: 58px;
  border: 0;
  border-radius: 18px;
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  padding: 0 54px 0 22px;
  color: var(--kboc-black);
  text-align: center;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 500;
  outline: none;
}

.kboc-auth-form input::placeholder,
.kboc-forgot-form input::placeholder {
  color: #9a9a9a;
  opacity: 1;
}

.kboc-auth-form input:focus,
.kboc-forgot-form input:focus {
  box-shadow: 0 0 0 2px rgba(35, 133, 229, 0.18), var(--kboc-shadow-soft);
}

.kboc-field--password {
  position: relative;
}

.kboc-field--password .kboc-password-toggle {
  position: absolute;
  top: 50%;
  right: 18px;
  bottom: auto;
  transform: translateY(-50%);
  width: 38px;
  height: 38px;
  border: 0;
  background: transparent;
  color: #cfcfcf;
  padding: 0;
  cursor: pointer;
}

.kboc-field--password .kboc-password-toggle .material-icons {
  font-size: 30px;
  line-height: 1;
}

.kboc-view--login .kboc-auth-forgot {
  display: inline-block;
  margin: 0 0 20px;
  border: 0;
  background: transparent;
  color: var(--kboc-black);
  text-decoration: none;
  cursor: pointer;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 500;
      width: 100%;
}

.kboc-view--login .kboc-auth-form .kboc-btn,
.kboc-auth-email-box .kboc-btn,
.kboc-register-form .kboc-btn,
.kboc-forgot-form .kboc-btn {
  min-height: 58px;
  border-radius: 18px;
  font-size: 18px;
  font-weight: 700;
}

/* Hide off-canvas header only on reset password panel */
#kboc-root[data-kboc-view="forgot"] .kboc-panel__header {
  display: none;
}

.kboc-view--login .kboc-auth-form .kboc-btn{
	width: 100%;
}

.kboc-auth-register-link {
  margin: 22px 0 34px;
  text-align: center;
  font-size: 17px;
  line-height: 1.2;
}

.kboc-auth-register-link strong {
  font-weight: 700;
}

.kboc-auth-register-link button,
.kboc-alt-actions button {
  border: 0;
  background: transparent;
  color: var(--kboc-black);
  padding: 0;
  text-decoration: underline;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
}

.kboc-new-customer-card {
  margin: 0 0 18px;
  padding: 22px 18px;
  border-radius: 20px;
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  text-align: center;
}

.kboc-new-customer-card strong {
  display: block;
  margin-bottom: 8px;
  color: var(--kboc-black);
  font-size: 18px;
  line-height: 1.15;
  font-weight: 800;
}

.kboc-new-customer-card p {
  margin: 0;
  color: var(--kboc-black);
  font-size: 16px;
  line-height: 1.2;
  font-weight: 400;
}

.kboc-auth-email-box {
  display: grid;
  gap: 14px;
  margin: 0 0 44px;
}

.kboc-auth-email-box input {
  width: 100%;
  min-height: 58px;
  border: 0;
  border-radius: 18px;
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  padding: 0 22px;
  color: var(--kboc-black);
  text-align: center;
  font-size: 17px;
  font-weight: 500;
}

.kboc-social-login {
  margin: 0;
  text-align: center;
}

.kboc-social-login > span {
  display: block;
  margin-bottom: 16px;
  color: var(--kboc-black);
  font-size: 16px;
  font-weight: 500;
}

.kboc-social-login > div {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px;
}

.kboc-social {
  width: 34px;
  height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  text-decoration: none;
  font-size: 20px;
  line-height: 1;
  font-weight: 700;
}

.kboc-gender-row {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 28px;
  margin: 20px 0 36px;
}

.kboc-gender-row label {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  cursor: pointer;
  color: var(--kboc-black);
  font-size: 18px;
  line-height: 1;
  font-weight: 500;
}

.kboc-gender-row input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.kboc-gender-row label::before {
  content: "";
  width: 30px;
  height: 30px;
  display: inline-block;
  border: 2px solid var(--kboc-black);
  border-radius: 50%;
  background: var(--kboc-white);
  box-shadow: inset 0 0 0 7px var(--kboc-white);
}

.kboc-gender-row input:checked + span::before {
  content: none;
}

.kboc-gender-row label:has(input:checked)::before {
  background: var(--kboc-blue);
}

.kboc-register-top-fields {
  display: grid;
  gap: 20px;
  margin-bottom: 46px;
}

.kboc-register-white-zone {
  margin-left: calc(-1 * var(--kboc-panel-padding));
  margin-right: calc(-1 * var(--kboc-panel-padding));
  padding: 30px var(--kboc-panel-padding) 0;
  background: var(--kboc-white);
}

.kboc-register-white-zone .kboc-field--password input {
  border: 2px solid var(--kboc-blue);
  box-shadow: none;
}

.kboc-password-rules {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px 20px;
  max-width: 430px;
  margin: 20px auto 30px;
  text-align: left;
  color: var(--kboc-black);
  font-size: 16px;
  line-height: 1.1;
  font-weight: 500;
}

.kboc-password-rules div {
  display: flex;
  align-items: center;
  gap: 10px;
}

.kboc-password-rules span {
  width: 24px;
  height: 24px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  border: 1.5px solid var(--kboc-black);
  border-radius: 50%;
  background: var(--kboc-white);
  color: var(--kboc-black);
  font-size: 18px;
  line-height: 1;
  font-weight: 500;
}

.kboc-password-rules .is-valid span,
.kboc-password-rules div.is-valid span {
  border-color: var(--kboc-blue);
  background: var(--kboc-blue);
  color: var(--kboc-white);
}

.kboc-birthday-label {
  margin: 0 0 16px;
  color: #9a9a9a;
  text-align: center;
  font-size: 17px;
  line-height: 1.2;
  font-weight: 500;
}

.kboc-birthday-fields {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  max-width: 380px;
  margin: 0 auto 26px;
}

.kboc-birthday-fields input {
  min-height: 58px;
  border: 2px solid var(--kboc-blue);
  border-radius: 16px;
  background: var(--kboc-white);
  box-shadow: none;
  padding: 0 10px;
  color: #9a9a9a;
  text-align: center;
  font-size: 17px;
  font-weight: 500;
}

.kboc-register-privacy-text {
  max-width: 480px;
  margin: 0 auto 24px;
  color: var(--kboc-black);
  text-align: center;
  font-size: 16px;
  line-height: 1.2;
}

.kboc-register-consent {
  display: grid;
  grid-template-columns: 30px 1fr;
  gap: 14px;
  align-items: start;
  margin: 0 0 30px;
  color: var(--kboc-black);
  text-align: left;
  font-size: 16px;
  line-height: 1.2;
  font-weight: 500;
}

.kboc-register-consent input {
  width: 30px;
  height: 30px;
  accent-color: var(--kboc-blue);
  margin: 0;
}

.kboc-register-consent a {
  color: var(--kboc-black);
  text-decoration: underline;
}

.kboc-register-form .kboc-alt-actions {
  margin-top: 18px;
  text-align: center;
}

.kboc-back--top {
  margin: 0 0 42px;
  font-size: 18px;
  font-weight: 500;
}

.kboc-back--top .material-icons {
  width: 44px;
  height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-right: 14px;
  border-radius: 50%;
  background: var(--kboc-white);
  box-shadow: var(--kboc-shadow-soft);
  font-size: 22px;
}

.kboc-forgot-info {
  margin: 0 0 44px;
  padding: 20px 30px;
  height: 135px;
  background: #FFFFFF;
  box-shadow: 0px 12px 25px rgba(0, 0, 0, 0.1);
  border-radius: 15px;
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 500;
  font-size: 16px;
  line-height: 19px;
  text-align: center;
  color: #000000;
}

.kboc-forgot-info p {
  margin: 0 0 18px;
}

.kboc-forgot-info p:last-child {
  margin-bottom: 0;
}

.kboc-forgot-form {
  display: grid;
  gap: 18px;
}

.kboc-brand-footer {
  margin-top: 90px;
}

@media (max-width: 560px) {
  .kboc-password-rules {
    grid-template-columns: 1fr 1fr;
    gap: 10px 14px;
    font-size: 14px;
  }

  .kboc-birthday-fields {
    gap: 12px;
  }

  .kboc-register-consent {
    font-size: 14px;
  }

  .kboc-forgot-info {
    font-size: 16px;
  }
}


/* v1.0.29 - Auth interaction fixes */
.kboc-password-rules [data-kboc-rule] span {
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.kboc-password-rules [data-kboc-rule].is-valid span {
  background: #2385e5;
  border-color: #2385e5;
  color: #ffffff;
}

.kboc-password-rules [data-kboc-rule].is-invalid span {
  background: #ffffff;
  border-color: #050505;
  color: #050505;
}

.kboc-social-login {
  display: block;
  margin-top: 42px;
  text-align: center;
}

.kboc-social-login > div {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
}

.kboc-social-login a.kboc-social,
.kboc-social-login button.kboc-social {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #050505;
  text-decoration: none;
  font-size: 28px;
  font-weight: 900;
  line-height: 1;
}
/* Rendre le bloc Total + Boutons fixe en bas du panneau */
.kboc-view--cart .kboc-cart-footer {
    position: sticky;
    /* On compense le padding existant de .kboc-panel__body pour coller aux bords */
    bottom: -28px; 
    margin-left: -22px; 
    margin-right: -22px;
    /* On recrée l'espacement interne tout en couvrant l'arrière-plan */
    padding: 15px 22px 28px; 
    background: #E8E8E8; /* Reprend la couleur de fond du panneau pour masquer le scroll */
    z-index: 10; /* Assure que le footer reste au-dessus des produits */
}

/* Ajustement nécessaire pour votre breakpoint mobile existant */
@media (max-width: 560px) {
    .kboc-view--cart .kboc-cart-footer {
        bottom: -24px;
        margin-left: -18px;
        margin-right: -18px;
        padding: 15px 18px 24px;
    }
}
/* Rendre les zones du bas fixes (Panier et Checkout Choice) */
.kboc-cart-footer,
.kboc-choice-footer {
    position: sticky;
    bottom: -28px; /* Compense le padding-bottom de .kboc-panel__body */
    margin-left: -22px; /* Compense le padding-left */
    margin-right: -22px; /* Compense le padding-right */
    padding: 15px 22px 28px; /* Recrée l'espacement visuel */
    background: #E8E8E8; /* Fond opaque pour cacher le scroll des produits */
    z-index: 10;
}

/* S'assurer que les éléments de choix s'empilent correctement dans le nouveau wrapper */
.kboc-choice-footer {
    display: flex;
    flex-direction: column;
}

.kboc-choice-footer > .kboc-btn {
    margin-bottom: 14px;
    width: 100%;
}

.kboc-choice-footer > .kboc-btn:last-child {
    margin-bottom: 0;
}

/* Ajustement pour le responsive (conserve vos paddings mobiles) */
@media (max-width: 560px) {
    .kboc-cart-footer,
    .kboc-choice-footer {
        bottom: -24px;
        margin-left: -18px;
        margin-right: -18px;
        padding: 15px 18px 24px;
    }
	.kboc-voucher input {
    
    width: 247px;
    height: 49px;
}

.kboc-voucher div {

    width: 100%;
   height: 49px;
}
.kboc-voucher button {
  width: 95px;
height: 49px;
padding: 7px 4px;
gap: 9px;
        font-size: 13px;
        line-height: 15px;
        max-width: unset;
        min-width: unset;
}
}
.kboc-btn-contact {
    width: 100%;
    /* height: 49px; */
}
.kboc-view--account .kboc-btn--icon-right{
	    margin-bottom: 16px !important;
}
/* Fix: when the user goes back from payment, hide payment fragments that themes/scripts may leave outside #checkout-payment-step. */
.kboc-native-checkout .kboc-payment-fragment-hidden,
.kboc-checkout-process .kboc-payment-fragment-hidden {
  display: none !important;
}

.kboc-native-checkout .step[hidden],
.kboc-checkout-process .step[hidden] {
  display: none !important;
}


/* KBOC mobile auth input tap fix
   Corrige les taps non pris sur les champs du panneau auth/register mobile
   apres ouverture depuis le panier/offcanvas. */
.kboc-root.is-open .kboc-overlay {
  z-index: 1;
}

.kboc-root.is-open .kboc-panel {
  z-index: 2;
}

.kboc-panel__body {
  -webkit-overflow-scrolling: touch;
}

.kboc-auth-form .kboc-field,
.kboc-register-top-fields,
.kboc-register-white-zone {
  position: relative;
}

.kboc-auth-form input[type="text"],
.kboc-auth-form input[type="email"],
.kboc-auth-form input[type="password"],
.kboc-forgot-form input[type="email"] {
  position: relative;
  z-index: 3;
  pointer-events: auto;
  -webkit-user-select: text;
  user-select: text;
  touch-action: manipulation;
}