/**
 * Premium UI Components — unified button system
 */

/* ── Base button ── */
.ms-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	font-family: var(--ms-font);
	font-weight: 800;
	font-size: var(--ms-text-sm);
	line-height: 1.2;
	padding: 0.8rem 1.35rem;
	border-radius: var(--ms-btn-radius, var(--ms-radius-md));
	border: 1px solid transparent;
	cursor: pointer;
	transition:
		border-color var(--ms-transition),
		box-shadow var(--ms-transition),
		background var(--ms-transition),
		color var(--ms-transition),
		transform 0.15s ease;
	text-decoration: none;
	white-space: nowrap;
	position: relative;
	background: var(--ms-color-surface);
	color: var(--ms-color-text);
}

.ms-btn:hover {
	text-decoration: none;
}

.ms-btn:active {
	transform: scale(0.98);
}

.ms-btn--sm {
	padding: 0.62rem 1rem;
	font-size: var(--ms-text-xs);
}

.ms-btn--lg {
	padding: 1rem 1.5rem;
	font-size: var(--ms-text-base);
}

.ms-btn--block {
	width: 100%;
}

.ms-btn:disabled,
.ms-btn[aria-disabled="true"] {
	opacity: 0.5;
	cursor: not-allowed;
	transform: none !important;
	box-shadow: none !important;
}

/* ── Compact variants (header, wizard, forms) ── */
.ms-btn--primary {
	background: var(--ms-color-primary);
	color: #fff;
	border-color: var(--ms-color-primary-hover);
	box-shadow: var(--ms-shadow-glow);
}

.ms-btn--primary:hover {
	color: #fff;
	background: var(--ms-color-primary-hover);
	border-color: #9A3412;
	box-shadow: 0 12px 40px rgba(234, 88, 12, 0.32);
	transform: translateY(-1px);
}

.ms-btn--secondary {
	background: var(--ms-color-navy-light);
	color: var(--ms-color-navy);
	border-color: rgba(27, 43, 75, 0.14);
	box-shadow: var(--ms-shadow-sm);
}

.ms-btn--secondary:hover {
	color: var(--ms-color-navy);
	background: rgba(27, 43, 75, 0.12);
	border-color: rgba(27, 43, 75, 0.28);
	box-shadow: var(--ms-shadow-md);
	transform: translateY(-1px);
}

.ms-btn--ghost {
	background: var(--ms-color-surface);
	color: var(--ms-color-text-muted);
	border-color: var(--ms-color-border);
}

.ms-btn--ghost:hover {
	color: var(--ms-color-navy);
	background: var(--ms-color-navy-light);
	border-color: rgba(27, 43, 75, 0.18);
	transform: translateY(-1px);
}

.ms-btn--white {
	background: #fff;
	color: var(--ms-color-navy);
	border-color: rgba(255, 255, 255, 0.9);
	box-shadow: var(--ms-shadow-md);
}

.ms-btn--white:hover {
	color: var(--ms-color-navy);
	background: #fff;
	border-color: #fff;
	box-shadow: var(--ms-shadow-lg);
	transform: translateY(-2px);
}

.ms-btn--glass {
	background: rgba(255, 255, 255, 0.1);
	color: #fff;
	border-color: rgba(255, 255, 255, 0.22);
	backdrop-filter: blur(10px);
}

.ms-btn--glass:hover {
	background: rgba(255, 255, 255, 0.16);
	border-color: rgba(255, 255, 255, 0.35);
	color: #fff;
	transform: translateY(-1px);
}

/* ── Action card buttons (hero-style) ── */
.ms-btn--action,
.ms-hp-action {
	display: flex;
	align-items: center;
	gap: 0.85rem;
	padding: 1.1rem 1.15rem;
	white-space: normal;
	text-align: right;
	font-weight: inherit;
	line-height: inherit;
}

.ms-btn--action.ms-btn--sm,
.ms-hp-action.ms-btn--sm {
	padding: 0.85rem 0.95rem;
	gap: 0.7rem;
}

.ms-btn--action.ms-btn--lg,
.ms-hp-action.ms-btn--lg {
	padding: 1.15rem 1.25rem;
}

.ms-btn--action:hover,
.ms-hp-action:hover {
	transform: translateY(-2px);
	box-shadow: var(--ms-shadow-md);
}

.ms-btn__icon,
.ms-hp-action__icon {
	flex-shrink: 0;
	width: 44px;
	height: 44px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 12px;
	background: var(--ms-color-surface);
	color: var(--ms-color-primary);
	box-shadow: var(--ms-shadow-sm);
}

.ms-btn--action.ms-btn--sm .ms-btn__icon,
.ms-hp-action.ms-btn--sm .ms-hp-action__icon {
	width: 38px;
	height: 38px;
	border-radius: 10px;
}

.ms-btn__icon svg,
.ms-hp-action__icon svg {
	display: block;
}

.ms-btn__body,
.ms-hp-action__body {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.ms-btn__body strong,
.ms-hp-action__body strong {
	font-size: var(--ms-text-sm);
	font-weight: 800;
	color: var(--ms-color-text);
}

.ms-btn--action.ms-btn--sm .ms-btn__body strong,
.ms-hp-action.ms-btn--sm .ms-hp-action__body strong {
	font-size: var(--ms-text-xs);
}

.ms-btn__body small,
.ms-hp-action__body small {
	font-size: var(--ms-text-xs);
	color: var(--ms-color-text-muted);
	font-weight: 500;
	line-height: 1.35;
}

.ms-btn__arrow,
.ms-hp-action__arrow {
	flex-shrink: 0;
	font-size: 1.1rem;
	color: var(--ms-color-primary);
	opacity: 0.55;
	line-height: 1;
}

/* Navy / shop action */
.ms-btn--action-navy,
.ms-btn--action.ms-btn--secondary,
.ms-hp-action--buy {
	background: var(--ms-color-navy-light);
	border-color: rgba(27, 43, 75, 0.14);
	color: inherit;
}

.ms-btn--action-navy:hover,
.ms-btn--action.ms-btn--secondary:hover,
.ms-hp-action--buy:hover {
	border-color: rgba(27, 43, 75, 0.28);
	color: inherit;
}

.ms-btn--action-navy .ms-btn__icon,
.ms-hp-action--buy .ms-hp-action__icon {
	background: var(--ms-color-navy);
	color: #fff;
	box-shadow: var(--ms-shadow-navy);
}

.ms-btn--action-navy .ms-btn__arrow,
.ms-hp-action--buy .ms-hp-action__arrow {
	color: var(--ms-color-navy);
}

/* Orange / sell action */
.ms-btn--action-orange,
.ms-btn--action.ms-btn--primary,
.ms-hp-action--sell {
	background: var(--ms-color-orange-tint);
	border-color: rgba(234, 88, 12, 0.18);
	color: inherit;
}

.ms-btn--action-orange:hover,
.ms-btn--action.ms-btn--primary:hover,
.ms-hp-action--sell:hover {
	border-color: rgba(234, 88, 12, 0.32);
	color: inherit;
}

.ms-btn--action-orange .ms-btn__icon,
.ms-btn--action.ms-btn--primary .ms-btn__icon,
.ms-hp-action--sell .ms-hp-action__icon {
	background: var(--ms-color-primary);
	color: #fff;
	box-shadow: var(--ms-shadow-glow);
}

.ms-btn--action-orange .ms-btn__arrow,
.ms-btn--action.ms-btn--primary .ms-btn__arrow,
.ms-hp-action--sell .ms-hp-action__arrow {
	color: var(--ms-color-primary);
}

/* Action on dark surfaces */
.ms-btn--action-white {
	background: #fff;
	border-color: rgba(255, 255, 255, 0.95);
	box-shadow: var(--ms-shadow-lg);
}

.ms-btn--action-white:hover {
	border-color: #fff;
	color: inherit;
}

.ms-btn--action-white .ms-btn__icon {
	background: var(--ms-color-navy);
	color: #fff;
	box-shadow: var(--ms-shadow-navy);
}

.ms-btn--action-white .ms-btn__arrow {
	color: var(--ms-color-navy);
}

.ms-btn--action-glass {
	background: rgba(255, 255, 255, 0.1);
	border-color: rgba(255, 255, 255, 0.22);
	backdrop-filter: blur(10px);
}

.ms-btn--action-glass:hover {
	background: rgba(255, 255, 255, 0.14);
	border-color: rgba(255, 255, 255, 0.32);
	color: inherit;
}

.ms-btn--action-glass .ms-btn__body strong,
.ms-btn--action-glass .ms-btn__body small {
	color: #fff;
}

.ms-btn--action-glass .ms-btn__body small {
	opacity: 0.82;
}

.ms-btn--action-glass .ms-btn__icon {
	background: var(--ms-color-primary);
	color: #fff;
	box-shadow: var(--ms-shadow-glow);
}

.ms-btn--action-glass .ms-btn__arrow {
	color: #fff;
	opacity: 0.75;
}

/* Title-only action (no subtitle) */
.ms-btn--action:not(:has(.ms-btn__body small)) .ms-btn__body strong,
.ms-btn--action:not(:has(.ms-hp-action__body small)) .ms-hp-action__body strong {
	font-size: var(--ms-text-sm);
}

/* Breadcrumb */
.ms-post-crumb {
	margin-bottom: 1rem;
}

.ms-post-crumb__list {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.35rem 0.5rem;
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.78rem;
	color: var(--ms-color-text-muted);
}

.ms-post-crumb__list li {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
}

.ms-post-crumb__list li + li::before {
	content: "/";
	opacity: 0.45;
}

.ms-post-crumb__list a {
	color: var(--ms-color-text-muted);
	text-decoration: none;
	font-weight: 600;
}

.ms-post-crumb__list a:hover {
	color: var(--ms-color-primary);
}

.ms-post-crumb__list [aria-current="page"] span {
	color: var(--ms-color-text);
	font-weight: 700;
}

/* Accordion */