/* =========================================================
   IDD Moodboard — CORE
   ========================================================= */

.idd-mb {
	--mb-brand:        var(--wp-brand,        #B5637A);
	--mb-brand-dark:   var(--wp-brand-dark,   #9A4F65);
	--mb-brand-light:  var(--wp-brand-light,  #EDD6DC);
	--mb-brand-soft:   var(--wp-brand-soft,   rgba(181,99,122,.09));
	--mb-brand-border: var(--wp-brand-border, rgba(181,99,122,.22));

	--mb-gold:         var(--wp-gold,         #C9A87C);
	--mb-gold-light:   var(--wp-gold-light,   #F3E8D6);

	--mb-sage:         var(--wp-sage,         #7A9D80);
	--mb-sage-dark:    var(--wp-sage-dark,    #5C7E62);
	--mb-sage-light:   var(--wp-sage-light,   #E2EDE4);

	--mb-prune:        #9C1657;

	--mb-bg:           var(--wp-bg,           #FDFAF8);
	--mb-surface:      var(--wp-surface,      #FFFFFF);
	--mb-surface-2:    var(--wp-surface-2,    #F8F2EE);
	--mb-surface-3:    var(--wp-surface-3,    #F2E8E2);

	--mb-ink:          var(--wp-ink,          #1D1819);
	--mb-soft:         var(--wp-soft,         #4A4144);
	--mb-muted:        var(--wp-muted,        #8A7E81);
	--mb-line:         var(--wp-line,         #EFE5E0);
	--mb-line-strong:  var(--wp-line-strong,  #E2D3CB);

	--mb-font-serif:   var(--font-serif, 'Cormorant Garamond', Georgia, 'Times New Roman', serif);
	--mb-font-sans:    var(--font-sans, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif);

	--mb-radius:       var(--radius-md, 16px);
	--mb-radius-sm:    var(--radius-sm, 10px);
	--mb-shadow:       var(--shadow-md, 0 8px 28px rgba(29,24,25,.09));
	--mb-shadow-sm:    var(--shadow-sm, 0 3px 12px rgba(29,24,25,.07));

	color: var(--mb-ink);
	font-family: var(--mb-font-sans);
	max-width: 1200px;
	margin: 24px auto 80px;
	padding: 0 20px;
	box-sizing: border-box;
}
.idd-mb *,
.idd-mb *::before,
.idd-mb *::after { box-sizing: inherit; }

.idd-mb-login-required {
	max-width: 480px;
	margin: 60px auto;
	padding: 24px 28px;
	background: var(--wp-surface, #fff);
	border: 1px solid var(--wp-line, #EFE5E0);
	border-radius: var(--radius-md, 18px);
	text-align: center;
	font-family: 'Cormorant Garamond', Georgia, serif;
	font-size: 1.3rem;
	color: var(--wp-ink, #1D1819);
}

/* ---- Top bar (titre + actions) ---- */
.idd-mb__topbar {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 24px;
	flex-wrap: wrap;
	margin-bottom: 28px;
}
.idd-mb__topbar-left { flex: 1 1 280px; }
.idd-mb__eyebrow {
	margin: 0 0 6px;
	color: var(--mb-brand);
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-weight: 600;
}
.idd-mb__title-main {
	font-family: var(--mb-font-serif);
	font-size: clamp(2rem, 1.4rem + 1.8vw, 2.8rem);
	font-weight: 600;
	color: var(--mb-ink);
	line-height: 1.1;
	margin: 0;
}

.idd-mb__topbar-right {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.idd-mb__saved {
	min-width: 92px;
	color: var(--mb-muted);
	font-size: .88rem;
	text-align: right;
	min-height: 1.2em;
}
.idd-mb__icon-btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 9px 16px;
	border-radius: var(--radius-full, 999px);
	border: 1px solid var(--mb-line-strong);
	background: var(--mb-surface);
	color: var(--mb-ink);
	font-size: .9rem;
	font-weight: 500;
	cursor: pointer;
	text-decoration: none;
	transition: background var(--duration, 180ms) var(--ease, ease), border-color var(--duration, 180ms) var(--ease, ease);
}
.idd-mb__icon-btn:hover {
	background: var(--mb-surface-2);
	color: var(--mb-ink);
}
.idd-mb__icon-btn .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

/* ---- Sections ---- */
.idd-mb__section {
	background: var(--mb-surface);
	border: 1px solid var(--mb-line);
	border-radius: var(--mb-radius);
	box-shadow: var(--mb-shadow);
	padding: 26px 28px;
	margin-bottom: 22px;
}
.idd-mb__section--intro {
	background: linear-gradient(135deg, var(--mb-surface-2) 0%, var(--mb-surface) 60%);
}
.idd-mb__section--canvas { padding: 26px 22px; }

.idd-mb__section-head {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 16px;
	margin-bottom: 18px;
}
.idd-mb__section-title {
	font-family: var(--mb-font-serif);
	font-size: 1.7rem;
	font-weight: 600;
	color: var(--mb-ink);
	margin: 0 0 4px;
}
.idd-mb__section-sub {
	color: var(--mb-muted);
	font-size: .95rem;
	margin: 0;
	max-width: 640px;
}
.idd-mb__section-actions {
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

/* ---- Grids ---- */
.idd-mb__grid { display: grid; gap: 14px 18px; }
.idd-mb__grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.idd-mb__grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.idd-mb__field--full { grid-column: 1 / -1; }
@media (max-width: 900px) {
	.idd-mb__grid--3 { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
	.idd-mb__grid--2, .idd-mb__grid--3 { grid-template-columns: 1fr; }
	.idd-mb { padding: 0 14px; margin: 18px auto 60px; }
	.idd-mb__section { padding: 20px 18px; border-radius: 18px; }
}

/* ---- Fields ---- */
.idd-mb__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.idd-mb__field > span,
.idd-mb__field-label {
	font-size: .88rem;
	font-weight: 500;
	color: var(--mb-soft);
}
.idd-mb__field input[type="text"],
.idd-mb__field input[type="email"],
.idd-mb__field input[type="date"],
.idd-mb__field input[type="number"],
.idd-mb__field textarea {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid var(--mb-line-strong);
	border-radius: var(--mb-radius-sm);
	background: var(--mb-surface);
	color: var(--mb-ink);
	font-family: inherit;
	font-size: 1rem;
	transition: border-color var(--duration, 180ms) var(--ease, ease), box-shadow var(--duration, 180ms) var(--ease, ease), background var(--duration, 180ms) var(--ease, ease);
	resize: vertical;
}
.idd-mb__field input:focus,
.idd-mb__field textarea:focus {
	outline: none;
	border-color: var(--mb-brand);
	box-shadow: 0 0 0 3px var(--mb-brand-soft);
	background: #fff;
}

/* ---- Buttons ---- */
.idd-mb__btn {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 10px 18px;
	border-radius: var(--radius-full, 999px);
	border: 1px solid var(--mb-line-strong);
	background: var(--mb-surface);
	color: var(--mb-ink);
	font-family: inherit;
	font-size: .92rem;
	font-weight: 500;
	cursor: pointer;
	text-decoration: none;
	transition: background var(--duration, 180ms) var(--ease, ease), border-color var(--duration, 180ms) var(--ease, ease), transform .08s;
}
.idd-mb__btn:hover { background: var(--mb-surface-2); }
.idd-mb__btn:active { transform: translateY(1px); }
.idd-mb__btn .dashicons { font-size: 18px; width: 18px; height: 18px; }
.idd-mb__btn--primary {
	background: var(--mb-brand);
	color: #fff;
	border-color: var(--mb-brand);
	box-shadow: var(--shadow-brand, 0 12px 24px rgba(181,99,122,.28));
}
.idd-mb__btn--primary:hover {
	background: var(--mb-brand-dark);
	border-color: var(--mb-brand-dark);
	color: #fff;
}
.idd-mb__btn--ghost {
	background: transparent;
	border-color: var(--mb-line);
	color: var(--mb-soft);
}
.idd-mb__btn--ghost:hover { background: var(--mb-surface-2); color: var(--mb-ink); }
.idd-mb__icon-only {
	background: none;
	border: 0;
	cursor: pointer;
	font-size: 22px;
	width: 32px; height: 32px;
	border-radius: var(--radius-xs, 8px);
	color: var(--mb-muted);
	display: inline-flex; align-items: center; justify-content: center;
	transition: background var(--duration, 180ms) var(--ease, ease), color var(--duration, 180ms) var(--ease, ease);
}
.idd-mb__icon-only:hover { background: var(--mb-surface-2); color: var(--mb-ink); }
