/**
 * Droit de Rétractation pour WooCommerce — styles STRUCTURELS uniquement.
 *
 * Principe : ce fichier ne définit JAMAIS de police, de couleur de marque
 * ou de rayon de bordure "maison". Il réutilise au maximum les classes
 * natives WooCommerce (button, shop_table, woocommerce-message,
 * order-status, woocommerce-order-overview…) pour que le thème actif
 * habille le parcours exactement comme il habille le reste de la boutique.
 * Les seules couleurs présentes ici sont sémantiques (urgence du délai) et
 * volontairement discrètes.
 */

.msdr-app { max-width: 100%; }
.msdr-app * { box-sizing: border-box; }

@media (prefers-reduced-motion: reduce) {
	.msdr-app * { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}

.msdr-app__loading {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 24px 0;
	opacity: .75;
}

.msdr-spinner {
	width: 14px;
	height: 14px;
	border-radius: 50%;
	border: 2px solid currentColor;
	border-top-color: transparent;
	opacity: .5;
	animation: msdr-spin .7s linear infinite;
	flex: none;
}
@keyframes msdr-spin { to { transform: rotate(360deg); } }

/* Onglets « Nouvelle demande / Mes demandes » : boutons natifs .button */
.msdr-tabs { display: flex; gap: 8px; margin: 0 0 1.5em; flex-wrap: wrap; }
.msdr-tabs .button { opacity: .55; }
.msdr-tabs .button.is-active { opacity: 1; }

/* Repère d'étapes ---------------------------------------------------- */
.msdr-stepper {
	display: flex;
	margin: 0 0 1.75em;
}
.msdr-stepper__step {
	flex: 1 1 0;
	display: flex;
	align-items: center;
	gap: .6em;
	position: relative;
	font-size: .85em;
	opacity: .5;
}
.msdr-stepper__step:not(:last-child)::after {
	content: '';
	flex: 1 1 auto;
	height: 1px;
	background: currentColor;
	opacity: .25;
	margin: 0 .6em;
}
.msdr-stepper__dot {
	flex: none;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1.5px solid currentColor;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: .8em;
	font-weight: 600;
}
.msdr-stepper__dot svg { width: 11px; height: 11px; }
.msdr-stepper__label { white-space: nowrap; }

.msdr-stepper__step.is-done { opacity: .85; }
.msdr-stepper__step.is-done .msdr-stepper__dot { background: currentColor; }
.msdr-stepper__step.is-current { opacity: 1; font-weight: 600; }
.msdr-stepper__step.is-current .msdr-stepper__dot { border-width: 2px; }

@media (max-width: 600px) {
	.msdr-stepper__label { display: none; }
	.msdr-stepper__step.is-current .msdr-stepper__label { display: inline; }
}

.msdr-panel h2 { margin-top: 0; }
.msdr-panel__hint { opacity: .75; font-size: .95em; margin: 0 0 1.25em; }

/* Sélection de commande */
.msdr-order-card {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1em;
	width: 100%;
	text-align: left;
	background: none;
	border: 1px solid rgba(0, 0, 0, .12);
	border-radius: 4px;
	padding: 1em 1.1em;
	margin-bottom: .75em;
	cursor: pointer;
	font: inherit;
	color: inherit;
}
.msdr-order-card:hover,
.msdr-order-card:focus-visible { border-color: currentColor; }
.msdr-order-card__main { display: flex; flex-direction: column; gap: .35em; }
.msdr-order-card__number { opacity: .65; font-size: .85em; }
.msdr-order-card__meta { font-weight: 600; }
.msdr-order-card__count { opacity: .65; font-size: .85em; }

/* Urgence du délai : mêmes codes de couleur que WooCommerce utilise pour
   le stock (.stock.in-stock / .out-of-stock), donc familier et sobre. */
.msdr-days { font-size: .85em; font-weight: 600; white-space: nowrap; }
.msdr-days--ok { color: #2f7a52; }
.msdr-days--warning { color: #b9862f; }
.msdr-days--urgent { color: #b23a2e; }

/* Sélection d'articles : structure de type ligne panier WooCommerce */
.msdr-item-row {
	display: flex;
	align-items: flex-start;
	gap: 1em;
	padding: 1em 0;
	border-bottom: 1px solid rgba(0, 0, 0, .08);
}
.msdr-item-row.is-disabled { opacity: .55; }
.msdr-item-row__thumb { width: 48px; height: 48px; flex: none; object-fit: cover; border-radius: 2px; }
.msdr-item-row__thumb--placeholder { width: 48px; height: 48px; flex: none; background: rgba(0, 0, 0, .06); border-radius: 2px; }
.msdr-item-row__body { flex: 1 1 auto; min-width: 0; }
.msdr-item-row__name { font-weight: 600; }
.msdr-item-row__excluded { font-size: .9em; opacity: .7; margin-top: .2em; }
.msdr-item-row__controls { display: flex; align-items: center; gap: 1em; margin-top: .6em; flex-wrap: wrap; }

/* Quantité : classe .qty native WooCommerce (panier) → le thème la stylise déjà */
.msdr-item-row input.qty { width: 4.5em; }

/* Case à cocher : classe native utilisée pour les CGV au paiement */
.msdr-item-row .woocommerce-form__input-checkbox { margin-top: .3em; flex: none; }

.msdr-summary-list { border: 1px solid rgba(0, 0, 0, .1); border-radius: 4px; overflow: hidden; margin-bottom: 1.25em; }
.msdr-summary-list__row { display: flex; justify-content: space-between; padding: .75em 1em; border-bottom: 1px solid rgba(0, 0, 0, .08); }
.msdr-summary-list__row:last-child { border-bottom: none; }
.msdr-summary-list__total { font-weight: 700; background: rgba(0, 0, 0, .025); }

.msdr-textarea { width: 100%; min-height: 6em; padding: .6em; font: inherit; }

.msdr-actions { display: flex; justify-content: space-between; align-items: center; gap: .75em; margin-top: 1.5em; }

@media (max-width: 600px) {
	.msdr-actions { flex-direction: column-reverse; align-items: stretch; }
	.msdr-actions .button { width: 100%; text-align: center; }
}

.msdr-history-note { opacity: .75; font-size: .9em; }

.msdr-notice-inline { display: flex; align-items: center; justify-content: space-between; gap: 1em; flex-wrap: wrap; }
.msdr-notice-inline .button { flex: none; }

.msdr-empty { text-align: center; padding: 3em 1em; opacity: .75; }
.msdr-empty__title { font-weight: 600; opacity: 1; margin: 0 0 .4em; }

.msdr-confirm-icon { width: 40px; height: 40px; margin: 0 auto .75em; color: #2f7a52; }
.msdr-confirm { text-align: center; padding: 1em 0; }
