:root{--kcd-brown:#9B887A;--kcd-brown-dark:#87766a;--kcd-brown-soft:rgba(155,136,122,.16)}
/* Bendido Delivery — bloque de checkout. Hereda los colores del tema (funciona en fondo oscuro). */
.kcd-wrapper{position:relative;border:1px solid rgba(128,128,128,.35);border-radius:6px;padding:22px 22px 8px;margin:0 0 34px;background:transparent;color:inherit}
.kcd-wrapper.is-loading{opacity:.45;pointer-events:none}
.kcd-title{margin:0 0 18px!important;line-height:1.3!important}

.kcd-modes{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:22px}
.kcd-mode{flex:1 1 180px;margin:0!important;border:2px solid rgba(128,128,128,.35);border-radius:6px;padding:14px 16px;cursor:pointer;display:flex;align-items:center;gap:10px;transition:border-color .15s,background .15s}
.kcd-mode:hover{border-color:rgba(160,160,160,.7)}
.kcd-mode.is-active{border-color:var(--kcd-brown);background:var(--kcd-brown-soft);box-shadow:0 0 0 1px var(--kcd-brown)}
.kcd-mode input{margin:0!important;flex:0 0 auto}
.kcd-mode-label{font-weight:700;line-height:1.2;text-transform:uppercase;letter-spacing:.03em}

.kcd-wrapper .form-row.kcd-field{padding:0!important;margin:0 0 18px!important}
.kcd-wrapper .kcd-field label{display:block;margin-bottom:7px;font-weight:600}
.kcd-select{width:100%!important;max-width:100%!important;height:auto!important;padding:12px 14px;border:1px solid rgba(128,128,128,.45);border-radius:4px;background:transparent;color:inherit;font:inherit;appearance:auto}
.kcd-select option,.kcd-select optgroup{color:#111;background:#fff}
.kcd-select:focus{outline:0;border-color:currentColor}

.kcd-notice{margin:0 0 18px!important;padding:12px 14px;border-radius:4px;background:rgba(128,128,128,.14);font-size:13px;line-height:1.5}
.kcd-notice--error{background:rgba(200,40,40,.16)}

/* Recogida: la dirección sigue en el formulario (Redsys la necesita) pero no se muestra. */
.kcd-mode-pickup .kcd-hidden-field{display:none!important}

@media (max-width:600px){.kcd-mode{flex:1 1 100%}}

/* ---- Selector de día ---- */
.kcd-days{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:14px}
.kcd-day{flex:1 1 120px;display:flex;flex-direction:column;align-items:center;gap:2px;
	padding:12px 10px;border:2px solid rgba(255,255,255,.22);border-radius:8px;
	background:transparent;color:inherit;font:inherit;cursor:pointer;transition:border-color .15s,background .15s}
.kcd-day:hover{border-color:rgba(255,255,255,.5)}
.kcd-day.is-active{border-color:var(--kcd-brown);background:var(--kcd-brown-soft);box-shadow:0 0 0 1px var(--kcd-brown)}
.kcd-day-title{font-weight:700;font-size:14px;letter-spacing:.03em}
.kcd-day-sub{font-size:11px;opacity:.65;text-transform:uppercase;letter-spacing:.05em}

/* ---- Popup del calendario ---- */
body.kcd-modal-open{overflow:hidden}
.kcd-modal{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;padding:20px}
.kcd-modal[hidden]{display:none!important}
.kcd-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.75);backdrop-filter:blur(2px)}
.kcd-modal-box{position:relative;width:100%;max-width:380px;background:#111;color:#fff;
	border:1px solid rgba(255,255,255,.2);border-radius:12px;padding:16px;
	box-shadow:0 18px 50px rgba(0,0,0,.6)}
.kcd-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.kcd-modal-head h4{margin:0!important;font-size:16px!important;color:#fff!important;letter-spacing:.02em}
.kcd-modal-close{background:none;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;padding:0 4px;opacity:.7}
.kcd-modal-close:hover{opacity:1;background:none}

/* ---- Calendario dentro del popup (paleta oscura forzada) ---- */
.kcd-modal .kcd-calendar{margin:0}
.kcd-modal .flatpickr-calendar,
.kcd-modal .flatpickr-calendar.inline{
	width:100%!important;max-width:100%!important;box-shadow:none!important;
	background:#111!important;border:0!important;border-radius:0!important;padding:0!important;margin:0!important}
.kcd-modal .flatpickr-months{background:transparent!important;margin-bottom:8px!important;height:auto!important;padding:4px 0!important}
.kcd-modal .flatpickr-month{background:transparent!important;color:#fff!important;fill:#fff!important;height:auto!important}
.kcd-modal .flatpickr-current-month{
	background:transparent!important;color:#fff!important;font-size:15px!important;font-weight:700!important;
	padding:0!important;height:auto!important;line-height:1.4!important;position:static!important;width:100%!important;text-align:center!important}
.kcd-modal .flatpickr-current-month .flatpickr-monthDropdown-months,
.kcd-modal .flatpickr-current-month input.cur-year{
	background:transparent!important;color:#fff!important;font-size:15px!important;font-weight:700!important;
	border:0!important;box-shadow:none!important;padding:0 4px!important;height:auto!important;min-height:0!important}
.kcd-modal .flatpickr-monthDropdown-months option{color:#111!important;background:#fff!important}
.kcd-modal .flatpickr-prev-month,.kcd-modal .flatpickr-next-month{
	fill:#fff!important;color:#fff!important;padding:4px!important;height:auto!important;top:2px!important}
.kcd-modal .flatpickr-prev-month svg,.kcd-modal .flatpickr-next-month svg{fill:#fff!important}
.kcd-modal .flatpickr-prev-month:hover svg,.kcd-modal .flatpickr-next-month:hover svg{fill:#b79b84!important}
.kcd-modal .flatpickr-weekdays{background:transparent!important;height:auto!important}
.kcd-modal .flatpickr-weekdaycontainer{background:transparent!important}
.kcd-modal span.flatpickr-weekday{
	background:transparent!important;color:rgba(255,255,255,.5)!important;
	font-weight:700!important;font-size:11px!important;text-transform:uppercase}
.kcd-modal .flatpickr-innerContainer,.kcd-modal .flatpickr-rContainer,
.kcd-modal .flatpickr-days,.kcd-modal .dayContainer{
	width:100%!important;max-width:100%!important;min-width:0!important;background:transparent!important;border:0!important}
.kcd-modal .flatpickr-day{
	color:#fff!important;background:transparent!important;border:1px solid transparent!important;border-radius:8px!important;
	max-width:none!important;height:42px!important;line-height:40px!important;font-weight:600!important}
.kcd-modal .flatpickr-day:hover{background:rgba(255,255,255,.15)!important}
.kcd-modal .flatpickr-day.today:not(.selected){border-color:#b79b84!important}
.kcd-modal .flatpickr-day.selected,.kcd-modal .flatpickr-day.selected:hover{
	background:#b79b84!important;border-color:#b79b84!important;color:#111!important}
.kcd-modal .flatpickr-day.flatpickr-disabled,
.kcd-modal .flatpickr-day.flatpickr-disabled:hover,
.kcd-modal .flatpickr-day.prevMonthDay,
.kcd-modal .flatpickr-day.nextMonthDay{
	color:rgba(255,255,255,.2)!important;background:transparent!important;
	text-decoration:line-through!important;cursor:default!important}

/* ---- Avisos ---- */
.kcd-notice--ok{background:rgba(60,160,90,.18)}
.kcd-notice--date{margin-top:0!important}
.kcd-zip{margin-top:4px}
form.checkout .kcd-zip-mirror{display:none!important}

/* ---- Tienda cerrada ---- */
.kcd-closed-banner{margin:0 0 24px;padding:16px 18px;border-radius:6px;background:rgba(200,40,40,.16);border:1px solid rgba(200,40,40,.5);font-weight:700;text-align:center}

/* ---- Campos de WooCommerce con el mismo aspecto que los del bloque ---- */
.woocommerce-checkout form.checkout .input-text,
.woocommerce-checkout form.checkout textarea,
.woocommerce-checkout form.checkout select,
.woocommerce-checkout form.checkout .select2-container .select2-selection--single{
	width:100%!important;
	max-width:100%!important;
	height:auto!important;
	min-height:0!important;
	padding:12px 14px!important;
	border:1px solid rgba(128,128,128,.45)!important;
	border-radius:4px!important;
	background:transparent!important;
	background-color:transparent!important;
	color:inherit!important;
	font:inherit!important;
	box-shadow:none!important;
}
.woocommerce-checkout form.checkout textarea{min-height:110px!important}

.woocommerce-checkout form.checkout .input-text:focus,
.woocommerce-checkout form.checkout textarea:focus,
.woocommerce-checkout form.checkout select:focus{
	outline:0!important;
	border-color:currentColor!important;
}

/* El texto de relleno, más tenue pero legible */
.woocommerce-checkout form.checkout .input-text::placeholder,
.woocommerce-checkout form.checkout textarea::placeholder{color:inherit;opacity:.45}

/* Autorrelleno de Chrome: evita el bloque azul/blanco encima del fondo oscuro */
.woocommerce-checkout form.checkout .input-text:-webkit-autofill,
.woocommerce-checkout form.checkout .input-text:-webkit-autofill:hover,
.woocommerce-checkout form.checkout .input-text:-webkit-autofill:focus{
	-webkit-text-fill-color:currentColor;
	transition:background-color 9999s ease-out;
}

/* Los desplegables nativos necesitan fondo propio al abrirse */
.woocommerce-checkout form.checkout select option{color:#111;background:#fff}

/* Etiquetas y campos obligatorios */
.woocommerce-checkout form.checkout .form-row label{margin-bottom:6px;display:block}
.woocommerce-checkout form.checkout .required{text-decoration:none;border:0}

/* Select2 (país, provincia) alineado con el resto */
.woocommerce-checkout form.checkout .select2-container .select2-selection__rendered{
	color:inherit!important;
	line-height:1.4!important;
	padding:0!important;
}
.woocommerce-checkout form.checkout .select2-container .select2-selection__arrow{height:100%!important}

/* ---- Estados hover/focus: el tema los pisaba y hacía desaparecer texto y borde ---- */
.woocommerce-checkout form.checkout .input-text,
.woocommerce-checkout form.checkout .input-text:hover,
.woocommerce-checkout form.checkout .input-text:focus,
.woocommerce-checkout form.checkout .input-text:active,
.woocommerce-checkout form.checkout textarea,
.woocommerce-checkout form.checkout textarea:hover,
.woocommerce-checkout form.checkout textarea:focus,
.woocommerce-checkout form.checkout select,
.woocommerce-checkout form.checkout select:hover,
.woocommerce-checkout form.checkout select:focus,
.kcd-wrapper .kcd-select,
.kcd-wrapper .kcd-select:hover,
.kcd-wrapper .kcd-select:focus{
	color:#fff!important;
	-webkit-text-fill-color:#fff!important;
	background:transparent!important;
	background-color:transparent!important;
	opacity:1!important;
	box-shadow:none!important;
	text-shadow:none!important;
}

.woocommerce-checkout form.checkout .input-text:hover,
.woocommerce-checkout form.checkout textarea:hover,
.woocommerce-checkout form.checkout select:hover,
.kcd-wrapper .kcd-select:hover{border-color:rgba(255,255,255,.7)!important}

.woocommerce-checkout form.checkout .input-text:focus,
.woocommerce-checkout form.checkout textarea:focus,
.woocommerce-checkout form.checkout select:focus,
.kcd-wrapper .kcd-select:focus{border-color:#b79b84!important;outline:0!important}

/* Salient a veces anima un borde inferior propio sobre el campo */
.woocommerce-checkout form.checkout .form-row input:focus + .nectar-form-row-line,
.woocommerce-checkout form.checkout .nectar-form-row-line{display:none!important}

/* Etiquetas siempre visibles */
.woocommerce-checkout form.checkout .form-row label,
.woocommerce-checkout form.checkout .form-row:hover label{color:inherit!important;opacity:1!important}

/* Select2 (País / Provincia) en hover y abierto */
.woocommerce-checkout form.checkout .select2-container--default .select2-selection--single,
.woocommerce-checkout form.checkout .select2-container--default .select2-selection--single:hover,
.woocommerce-checkout form.checkout .select2-container--open .select2-selection--single{
	background:transparent!important;color:#fff!important;border-color:rgba(255,255,255,.45)!important}
.woocommerce-checkout form.checkout .select2-container--default .select2-selection__rendered{color:#fff!important}
.select2-container--default .select2-results__option{color:#111;background:#fff}
.select2-container--default .select2-results__option--highlighted[aria-selected]{background:#b79b84;color:#111}

/* Con un solo método de envío, el radio sobra: WooCommerce lo oculta solo,
   pero algunos temas lo siguen pintando. */
.woocommerce-checkout .woocommerce-shipping-methods li:only-child input[type="radio"],
.woocommerce-checkout #shipping_method li:only-child input[type="radio"]{display:none!important}
.woocommerce-checkout .woocommerce-shipping-methods li:only-child label{margin-left:0!important}

/* ---- Cabecera del bloque ---- */
.kcd-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:16px}
.kcd-head .kcd-title{margin:0!important}
.kcd-now{font-size:13px;opacity:.7;white-space:nowrap}
.kcd-now strong{font-variant-numeric:tabular-nums}

/* ---- Checkout propio: dos columnas ---- */
.kcd-checkout .kcd-checkout-cols{display:grid;grid-template-columns:2fr 1fr;gap:40px;align-items:flex-start}
.kcd-checkout .kcd-checkout-main{min-width:0}
.kcd-checkout .kcd-checkout-side{min-width:0;position:sticky;top:30px}
.kcd-checkout .kcd-checkout-side .woocommerce-checkout-review-order-table{font-size:.92em}

/* El pago va abajo del todo, a lo ancho de las dos columnas */
.kcd-checkout .kcd-checkout-payment{margin-top:34px}
.kcd-checkout .kcd-checkout-payment #payment{background:transparent;border-radius:0}
.kcd-checkout .kcd-checkout-payment #place_order{
	width:100%;
	font-size:1.05em;
	padding:16px 24px;
	background-color:var(--kcd-brown)!important;
	border-color:var(--kcd-brown)!important;
	color:#fff!important;
}
.kcd-checkout .kcd-checkout-payment #place_order:hover,
.kcd-checkout .kcd-checkout-payment #place_order:focus{
	background-color:var(--kcd-brown-dark)!important;
	border-color:var(--kcd-brown-dark)!important;
	color:#fff!important;
}
.kcd-section-title{margin:0 0 18px!important}
.kcd-checkout .woocommerce-billing-fields h3{display:none}
.kcd-checkout #customer_details .col-1,
.kcd-checkout #customer_details .col-2{width:100%;float:none}
@media (max-width:900px){
	.kcd-checkout .kcd-checkout-cols{grid-template-columns:1fr;gap:24px}
	.kcd-checkout .kcd-checkout-side{position:static}
	.kcd-checkout .kcd-checkout-payment{margin-top:24px}
}

/* ---- Campos que solo valen para un modo ---- */
form.checkout:not(.kcd-mode-pickup) .kcd-in-pickup:not(.kcd-in-delivery){display:none!important}
form.checkout.kcd-mode-pickup .kcd-in-delivery:not(.kcd-in-pickup){display:none!important}

/* ---- Rejilla de los campos: dos columnas sin huecos ----
   Se ignora el float de form-row-first/last de WooCommerce, que deja agujeros
   cuando un campo se oculta por el modo elegido. */
.kcd-checkout .woocommerce-billing-fields__field-wrapper{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:0 20px;
}
.kcd-checkout .woocommerce-billing-fields__field-wrapper .form-row{
	float:none!important;
	width:auto!important;
	margin-left:0!important;
	margin-right:0!important;
	padding:0!important;
	margin-bottom:18px!important;
}
.kcd-checkout .woocommerce-billing-fields__field-wrapper .form-row-wide,
.kcd-checkout .woocommerce-billing-fields__field-wrapper .kcd-hidden-field,
.kcd-checkout .woocommerce-billing-fields__field-wrapper .kcd-zip-mirror{grid-column:1 / -1}
@media (max-width:600px){
	.kcd-checkout .woocommerce-billing-fields__field-wrapper{grid-template-columns:1fr}
}



/* ---- Una sola tarjeta: bloque de entrega + Tus datos ---- */
.kcd-checkout .kcd-card{
	border:1px solid rgba(128,128,128,.35);
	border-radius:8px;
	padding:22px 24px;
	background:transparent;
}
/* Dentro de la tarjeta el bloque pierde su propio marco */
.kcd-checkout .kcd-card .kcd-wrapper{
	border:0!important;
	border-radius:0!important;
	padding:0!important;
	margin:0!important;
}
/* La separación entre las dos partes es una línea, no un hueco */
.kcd-checkout .kcd-card .kcd-card-section{
	border-top:1px solid rgba(128,128,128,.28);
	margin-top:26px;
	padding-top:26px;
}
.kcd-checkout .kcd-card .kcd-section-title{margin-bottom:18px!important}
@media (max-width:600px){
	.kcd-checkout .kcd-card{padding:18px 16px}
}

/* ---- Aviso de hora de corte, arriba del checkout ---- */
.kcd-cutoff-notices{margin:0 0 20px}
.kcd-cutoff-notice{
	display:flex;
	align-items:center;
	gap:10px;
	padding:14px 18px;
	margin-bottom:10px;
	border-radius:10px;
	border:1px solid #f0c36d;
	background:#fff8e6;
	color:#6b4e00;
	font-size:16px;
	font-weight:600;
	line-height:1.35;
}
.kcd-cutoff-notice .kcd-cutoff-icon{font-size:20px;line-height:1}
.kcd-cutoff-notice.is-urgent{
	border-color:#e0a2a2;
	background:#fdecec;
	color:#8a1f1f;
}
@media (max-width:600px){
	.kcd-cutoff-notice{font-size:15px;padding:12px 14px}
}
.kcd-cutoff-notice.is-closed{
	border-color:#d6d6d6;
	background:#f4f4f4;
	color:#555;
	font-weight:500;
}

/* ---- Aviso de día especial ---- */
.kcd-special-notice{
	display:flex;
	align-items:center;
	gap:10px;
	padding:14px 18px;
	margin:0 0 20px;
	border-radius:10px;
	border:1px solid #b9a3e3;
	background:#f4efff;
	color:#3f2a70;
	font-size:16px;
	line-height:1.35;
}
.kcd-special-notice .kcd-special-icon{font-size:20px;line-height:1}

/* ---- Horas de recogida en casillas ---- */
.kcd-slot-label{display:block;margin-bottom:10px;font-weight:600}
.kcd-slots{display:block}
.kcd-slot-group{display:block;margin-bottom:14px}
.kcd-slot-group:last-child{margin-bottom:0}
.kcd-slot-shift{
	display:block;
	margin-bottom:8px;
	font-size:13px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.06em;
	opacity:.65;
}
.kcd-slot-list{display:flex;flex-wrap:wrap;gap:8px}
.kcd-slot{
	position:relative;
	display:inline-flex;
	margin:0;
	cursor:pointer;
}
.kcd-slot input{
	position:absolute;
	opacity:0;
	width:100%;
	height:100%;
	margin:0;
	cursor:pointer;
}
.kcd-slot span{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:74px;
	padding:11px 14px;
	border:1px solid rgba(128,128,128,.45);
	border-radius:8px;
	font-size:15px;
	font-weight:600;
	line-height:1;
	transition:all .12s ease;
}
.kcd-slot:hover span{border-color:var(--kcd-brown)}
.kcd-slot input:focus-visible + span{outline:2px solid var(--kcd-brown);outline-offset:2px}
.kcd-slot input:checked + span{
	background:var(--kcd-brown);
	border-color:var(--kcd-brown);
	color:#fff;
	box-shadow:0 0 0 1px var(--kcd-brown);
}
.kcd-slot.is-asap{display:block;width:100%;margin-bottom:14px}
.kcd-slot.is-asap span{width:100%}
.kcd-slots-empty{display:block;opacity:.6;font-style:italic}
@media (max-width:600px){
	.kcd-slot span{min-width:0;flex:1;padding:12px 10px}
	.kcd-slot{flex:1 0 auto}
}