/**
 * Food Item Editor - section-based layout
 * Replaces the tab-based panel with a single scrollable form.
 */

/* ── Outer wrapper ── */
.rp-fooditem-editor {
	display: flex;
	flex-direction: column;
	gap: 0;
}

/* ── Section card ── */
.rp-fi-section {
	border: 1px solid #dcdcde;
	border-radius: 5px;
	margin-bottom: 14px;
	background: #fff;
}

/* ── Section header ── */
.rp-fi-section-header {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 11px 16px;
	background: #f6f7f7;
	border-bottom: 1px solid #dcdcde;
	border-radius: 5px 5px 0 0;
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	line-height: 1.4;
}

.rp-fi-section-number {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 22px;
	height: 22px;
	flex-shrink: 0;
	background: #2271b1;
	color: #fff;
	border-radius: 50%;
	font-size: 11px;
	font-weight: 700;
}

.rp-fi-section-required {
	color: #d63638;
	font-weight: 700;
	margin-left: 2px;
}

.rp-fi-section-badge {
	margin-left: auto;
	font-size: 11px;
	font-weight: normal;
	color: #646970;
	background: #e0e0e0;
	border-radius: 10px;
	padding: 1px 8px;
}

/* ── Section body ── */
.rp-fi-section-body {
	padding: 20px 20px 16px;
}

/* ── Advanced section (collapsible) ── */
.rp-fi-section.is-advanced > .rp-fi-section-header {
	cursor: pointer;
	user-select: none;
}

.rp-fi-section.is-advanced > .rp-fi-section-body {
	display: none;
}

.rp-fi-section.is-advanced.is-open > .rp-fi-section-body {
	display: block;
}

.rp-fi-toggle-icon {
	margin-left: auto;
	color: #646970;
	transition: transform 0.2s ease;
	flex-shrink: 0;
}

.rp-fi-section.is-advanced.is-open .rp-fi-toggle-icon {
	transform: rotate(180deg);
}

/* ── Image + Type row ── */
.rp-fi-image-row {
	display: flex;
	align-items: flex-start;
	gap: 20px;
}

.rp-fi-image-block {
	flex-shrink: 0;
	width: 130px;
}

.rp-fi-image-frame {
	width: 130px;
	height: 130px;
	border: 2px dashed #c3c4c7;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	background: #f6f7f7;
	position: relative;
	cursor: pointer;
	transition: border-color 0.15s;
}

.rp-fi-image-frame:hover {
	border-color: #2271b1;
}

.rp-fi-image-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rp-fi-image-empty {
	text-align: center;
	padding: 12px 8px;
	pointer-events: none;
}

.rp-fi-image-empty .dashicons {
	font-size: 36px;
	width: 36px;
	height: 36px;
	color: #c3c4c7;
	display: block;
	margin: 0 auto 6px;
}

.rp-fi-image-empty span {
	display: block;
	font-size: 11px;
	color: #646970;
	line-height: 1.3;
}

.rp-fi-image-actions {
	margin-top: 8px;
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.rp-fi-image-actions .button {
	width: 100%;
	text-align: center;
	font-size: 11px;
	padding: 3px 6px;
	height: auto;
}

/* ── Food type radio ── */
.rp-fi-type-block {
	flex: 1;
	min-width: 0;
}

.rp-fi-type-label {
	display: block;
	font-size: 12px;
	font-weight: 600;
	color: #50575e;
	margin-bottom: 8px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.rp-fi-type-options {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.rp-fi-type-option {
	display: flex;
	align-items: center;
	gap: 7px;
	padding: 7px 14px;
	border: 1px solid #dcdcde;
	border-radius: 4px;
	cursor: pointer;
	font-size: 13px;
	color: #1d2327;
	transition: border-color 0.12s, background 0.12s;
	background: #fff;
}

.rp-fi-type-option:hover {
	border-color: #646970;
}

.rp-fi-type-option input[type="radio"] {
	margin: 0;
	cursor: pointer;
}

.rp-fi-type-option.is-veg {
	border-color: #1d8348;
	background: #eafaf1;
	color: #1d8348;
	font-weight: 600;
}

.rp-fi-type-option.is-non-veg {
	border-color: #c0392b;
	background: #fdf2f2;
	color: #c0392b;
	font-weight: 600;
}

/* ── Pricing section ── */
.rp-fi-price-mode {
	display: flex;
	gap: 10px;
	margin-bottom: 18px;
}

.rp-fi-price-mode-option {
	flex: 1;
	max-width: 200px;
	border: 2px solid #dcdcde;
	border-radius: 5px;
	padding: 10px 14px;
	display: flex;
	align-items: center;
	gap: 9px;
	cursor: pointer;
	font-size: 13px;
	color: #1d2327;
	transition: border-color 0.12s, background 0.12s;
}

.rp-fi-price-mode-option:hover {
	border-color: #2271b1;
}

.rp-fi-price-mode-option.is-active {
	border-color: #2271b1;
	background: #f0f6fc;
}

.rp-fi-price-mode-option input[type="radio"] {
	margin: 0;
	cursor: pointer;
}

.rp-fi-price-fixed-row {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 4px;
}

.rp-fi-price-fixed-row label {
	font-size: 13px;
	color: #1d2327;
	font-weight: 500;
	white-space: nowrap;
}

.rp-fi-price-fixed-row input[type="number"],
.rp-fi-price-fixed-row input[type="text"] {
	max-width: 140px;
}

/* ── Required field error state ── */
.rp-fi-section.has-error > .rp-fi-section-header {
	background: #fcf0f1;
	border-bottom-color: #d63638;
}

.rp-fi-section.has-error > .rp-fi-section-header .rp-fi-section-number {
	background: #d63638;
}

.rp-fi-field-error-msg {
	display: none;
	margin-top: 6px;
	font-size: 12px;
	color: #d63638;
}

.rp-fi-field-error-msg.is-visible {
	display: block;
}

/* ── Category section ── */
.rp-toggle-new-category {
	font-size: 12px;
	height: auto;
	padding: 4px 10px;
}

.rp-fi-category-row {
	display: flex;
	align-items: flex-start;
	gap: 12px;
}

.rp-fi-category-row .rp-category-select {
	flex: 1;
	min-width: 0;
}

/* ── Addon group header (count badge) ── */
.rp-addon-count-badge {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #2271b1;
	color: #fff;
	border-radius: 10px;
	padding: 1px 7px;
	font-size: 11px;
	font-weight: 600;
	margin-left: 8px;
	vertical-align: middle;
	line-height: 1.6;
}

.rp-addon-count-badge.is-zero {
	background: #c3c4c7;
	color: #1d2327;
}

/* ── Addon section action bar ── */
.rp-fi-addons-actions {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 14px;
	padding-top: 14px;
	border-top: 1px solid #f0f0f1;
}

/* ── Advanced section fields ── */
.rp-fi-advanced-grid {
	gap: 16px;
}

.rp-fi-field-group {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.rp-fi-field-group label {
	font-size: 12px;
	font-weight: 600;
	color: #50575e;
}

/* ═══════════════════════════════════════════════════════
   VARIABLE PRICE ROWS - compact inline cards
   ═══════════════════════════════════════════════════════ */

/* Container */
.rp-variable-prices .rp-metaboxes {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 6px;
	margin-bottom: 10px;
}

.rp-variable-prices .rp-metaboxes > .button {
	align-self: flex-start;
	width: auto;
}

/* Each variable price row */
.rp-varprice-row {
	display: flex !important;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid #dcdcde;
	border-radius: 5px;
	padding: 8px 10px;
	margin: 0 !important;
}

/* Drag handle */
.rp-varprice-drag {
	color: #c3c4c7;
	cursor: grab;
	flex-shrink: 0;
	font-size: 18px;
	width: 18px;
	height: 18px;
}

/* Option name input - takes up most of the row */
.rp-varprice-name {
	flex: 1;
	min-width: 0;
	height: 32px !important;
	font-size: 13px !important;
}

/* Currency symbol */
.rp-varprice-currency {
	flex-shrink: 0;
	font-size: 13px;
	color: #50575e;
	font-weight: 600;
}

/* Amount input - fixed width */
.rp-varprice-amount {
	width: 90px !important;
	height: 32px !important;
	font-size: 13px !important;
	text-align: right;
}

/* Remove button */
.rp-varprice-remove {
	flex-shrink: 0;
	color: #c3c4c7;
	display: flex;
	align-items: center;
	text-decoration: none;
	border-radius: 3px;
	padding: 2px 3px;
	transition: color 0.12s, background 0.12s;
}

.rp-varprice-remove:hover {
	color: #d63638;
	background: #fce8e8;
}

.rp-varprice-remove .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* Add option button - auto-width, left-aligned */
.rp-variable-prices .button.add-new-price {
	margin-top: 4px;
	font-size: 12px;
	height: auto;
	padding: 5px 14px;
	align-self: flex-start;
	width: auto;
}

/* Drag handle tooltip - visible on hover so users know rows are sortable */
.rp-varprice-drag:hover {
	color: #646970;
}

.rp-varprice-row:hover .rp-varprice-drag {
	color: #646970;
}

/* Empty state when variable pricing has no rows yet */
.rp-varprice-empty {
	padding: 18px 16px;
	color: #646970;
	font-size: 13px;
	text-align: center;
	background: #f6f7f7;
	border: 1px dashed #c3c4c7;
	border-radius: 4px;
	margin-bottom: 8px;
}

/* ── Duplicate row action link ── */
.rp-row-action-duplicate a {
	color: #2271b1;
}

/* ── Sidebar featured image box - hidden when editor image block is active ── */
.fooditem-editor-active #postimagediv {
	display: none !important;
}

/* ═══════════════════════════════════════════════════════
   ADDON CARD - redesigned inside .rp-fi-section#addons_fooditem_data
   ═══════════════════════════════════════════════════════ */

/* Container for all addon group cards */
#addons_fooditem_data .rp-addons.rp-metaboxes {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Each addon group card */
#addons_fooditem_data .rp-addon.rp-metabox {
	border: 1px solid #dcdcde;
	border-radius: 6px;
	background: #fff;
	margin: 0;
	overflow: hidden;
}

/* Card header - replaces the raw h3 */
#addons_fooditem_data .rp-addon.rp-metabox h3 {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	margin: 0;
	background: #f6f7f7;
	border-bottom: 1px solid #dcdcde;
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	cursor: default;
	min-height: unset;
}

#addons_fooditem_data .rp-addon.rp-metabox h3 .rp-addon-drag-handle {
	color: #c3c4c7;
	cursor: grab;
	flex-shrink: 0;
	font-size: 18px;
	width: 18px;
	height: 18px;
}

#addons_fooditem_data .rp-addon.rp-metabox h3 strong {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 600;
	font-size: 13px;
}

/* Type badge - Single / Multiple */
.rp-addon-type-badge {
	display: inline-flex;
	align-items: center;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 2px 7px;
	border-radius: 3px;
	background: #e2e4e7;
	color: #50575e;
	flex-shrink: 0;
}

.rp-addon-type-badge.is-single {
	background: #fef3cd;
	color: #856404;
}

.rp-addon-type-badge.is-multiple {
	background: #d1ecf1;
	color: #0c5460;
}

/* Required badge */
.rp-addon-required-badge {
	display: inline-flex;
	align-items: center;
	font-size: 10px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	padding: 2px 7px;
	border-radius: 3px;
	background: #fce8e8;
	color: #d63638;
	flex-shrink: 0;
}

/* Collapse toggle button */
.rp-addon-collapse-btn {
	background: none;
	border: none;
	padding: 2px 4px;
	cursor: pointer;
	color: #646970;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	border-radius: 3px;
	transition: background 0.12s;
}

.rp-addon-collapse-btn:hover {
	background: #dcdcde;
	color: #1d2327;
}

.rp-addon-collapse-btn .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
	display: inline-block;
	transition: transform 0.2s ease;
	transform: rotate(0deg);
}

.rp-addon.rp-metabox.is-collapsed .rp-addon-collapse-btn .dashicons {
	transform: rotate(-90deg);
}

/* Remove button in header */
#addons_fooditem_data .rp-addon.rp-metabox h3 a.delete {
	background: none;
	border: none;
	padding: 2px 4px;
	cursor: pointer;
	color: #c3c4c7;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	border-radius: 3px;
	text-decoration: none;
	transition: color 0.12s, background 0.12s;
	float: none;
	position: static;
}

#addons_fooditem_data .rp-addon.rp-metabox h3 a.delete:hover {
	color: #d63638;
	background: #fce8e8;
}

#addons_fooditem_data .rp-addon.rp-metabox h3 a.delete .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

/* Collapsed state hides body */
.rp-addon.rp-metabox.is-collapsed .rp-metabox-content {
	display: none;
}

/* ── Addon card body ── */
#addons_fooditem_data .rp-addon.rp-metabox .rp-metabox-content {
	padding: 14px 16px 16px;
}

/* ── Addon settings grid ── */
.rp-addon-settings {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 14px;
	padding-bottom: 14px;
	border-bottom: 1px solid #f0f0f1;
}

.rp-addon-setting-group {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.rp-addon-setting-group > label,
.rp-addon-settings .rp-addon-group-label {
	font-size: 11px;
	font-weight: 600;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.rp-addon-setting-group.is-grow {
	flex: 1;
	min-width: 180px;
}

.rp-addon-select-wrap {
	display: flex;
	gap: 6px;
	align-items: center;
}

.rp-addon-select-wrap select.rp-addon-lists {
	flex: 1;
	min-width: 0;
	height: 30px;
	font-size: 13px;
}

.rp-addon-select-wrap .load-addon {
	height: 30px;
	font-size: 12px;
	padding: 0 10px;
	flex-shrink: 0;
}

.rp-addon-setting-group input[type="number"] {
	width: 70px;
	height: 30px;
	font-size: 13px;
}

/* Required checkbox row */
.rp-addon-required-row {
	display: flex;
	align-items: center;
	gap: 6px;
	padding-bottom: 2px;
}

.rp-addon-required-row input[type="checkbox"] {
	margin: 0;
	cursor: pointer;
}

.rp-addon-required-row span {
	font-size: 12px;
	color: #1d2327;
	cursor: pointer;
}

/* ── Addon items table (improved) ── */
.addon-items {
	overflow-x: auto;
}

table.rp-addon-items {
	width: 100%;
	border-collapse: collapse;
	font-size: 13px;
}

table.rp-addon-items thead th {
	padding: 7px 10px;
	background: #f6f7f7;
	border: 1px solid #dcdcde;
	font-size: 11px;
	font-weight: 600;
	color: #50575e;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	white-space: nowrap;
}

table.rp-addon-items tbody tr:nth-child(even) {
	background: #f9f9f9;
}

table.rp-addon-items tbody tr:hover {
	background: #f0f6fc;
}

table.rp-addon-items tbody td {
	padding: 8px 10px;
	border: 1px solid #ececec;
	vertical-align: middle;
}

table.rp-addon-items th.select_addon,
table.rp-addon-items td.td_checkbox,
table.rp-addon-items td.tds_checkbox {
	width: 40px;
	text-align: center;
}

table.rp-addon-items th.addon_name,
table.rp-addon-items td.add_label {
	width: auto;
}

table.rp-addon-items th.addon_price,
table.rp-addon-items td.addon_price {
	width: 110px;
}

table.rp-addon-items th.default_addon,
table.rp-addon-items td.tds_checkbox {
	width: 60px;
	text-align: center;
}

table.rp-addon-items input.addon-custom-price {
	width: 90px;
	text-align: right;
	height: 28px;
	font-size: 12px;
}

table.rp-addon-items .rp-checkbox,
table.rp-addon-items .rps-checkbox {
	width: 15px;
	height: 15px;
	cursor: pointer;
}

/* Select-all checkbox header */
table.rp-addon-items th.select_addon {
	text-align: center;
}

/* Empty placeholder */
.rp-addon-msg {
	padding: 20px 16px;
	color: #646970;
	font-size: 13px;
	text-align: center;
	background: #f6f7f7;
	border: 1px dashed #c3c4c7;
	border-radius: 4px;
}

/* ═══════════════════════════════════════════════════════
   CREATE NEW ADDON CATEGORY - redesigned card
   ═══════════════════════════════════════════════════════ */

.rp-metabox.create-new-addon {
	border: 1px solid #dcdcde;
	border-radius: 6px;
	background: #fff;
	overflow: hidden;
}

.rp-metabox.create-new-addon h3 {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 14px;
	margin: 0;
	background: #f0f6fc;
	border-bottom: 1px solid #c3d9f1;
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	min-height: unset;
}

.rp-metabox.create-new-addon h3 .rp-addon-drag-handle {
	color: #c3c4c7;
	cursor: grab;
	flex-shrink: 0;
	font-size: 18px;
	width: 18px;
	height: 18px;
}

.rp-metabox.create-new-addon h3 .addon_category_name {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-weight: 600;
}

.rp-metabox.create-new-addon h3 a.delete {
	background: none;
	border: none;
	padding: 2px 4px;
	cursor: pointer;
	color: #c3c4c7;
	display: flex;
	align-items: center;
	border-radius: 3px;
	text-decoration: none;
	transition: color 0.12s, background 0.12s;
	float: none;
	position: static;
}

.rp-metabox.create-new-addon h3 a.delete:hover {
	color: #d63638;
	background: #fce8e8;
}

.rp-metabox.create-new-addon h3 a.delete .dashicons {
	font-size: 16px;
	width: 16px;
	height: 16px;
}

.rp-metabox.create-new-addon .rp-metabox-content {
	padding: 16px;
}

/* New layout - top config row */
.rp-new-addon-config {
	display: flex;
	gap: 12px;
	align-items: flex-end;
	margin-bottom: 16px;
	padding-bottom: 16px;
	border-bottom: 1px solid #f0f0f1;
}

.rp-new-addon-config .rp-new-addon-field {
	display: flex;
	flex-direction: column;
	gap: 5px;
}

.rp-new-addon-config .rp-new-addon-field label {
	font-size: 11px;
	font-weight: 600;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.rp-new-addon-config .rp-new-addon-field.is-grow {
	flex: 1;
}

.rp-new-addon-config input[type="text"].rp-input {
	height: 32px;
	font-size: 13px;
	width: 100%;
}

.rp-new-addon-config select.rp-input {
	height: 32px;
	font-size: 13px;
	min-width: 130px;
}

/* Items list inside create-new-addon */
.rp-new-addon-items-header {
	display: flex;
	align-items: center;
	margin-bottom: 8px;
}

.rp-new-addon-items-header span {
	font-size: 11px;
	font-weight: 600;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	flex: 1;
}

.rp-new-addon-items-header .addon-price-symbol {
	font-size: 11px;
	font-weight: 600;
	color: #646970;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	width: 100px;
	text-align: right;
	padding-right: 32px;
}

/* Items body */
.rp-new-addon-items-body {
	margin-bottom: 0;
}

.rp-new-addon-items-body table {
	width: 100%;
	border-collapse: collapse;
}

.rp-new-addon-items-body tr.addon-items-row td {
	vertical-align: middle;
	padding: 4px 4px;
}

.rp-new-addon-items-body tr.addon-items-row:first-child td {
	padding-top: 0;
}

.remove.rp-addon-cat {
	color: #c3c4c7;
	cursor: pointer;
	display: flex;
	align-items: center;
	transition: color 0.12s;
}

tr.addon-items-row .remove.rp-addon-cat:hover {
	color: #d63638;
}

tr.addon-items-row .remove.rp-addon-cat .dashicons {
	font-size: 18px;
	width: 18px;
	height: 18px;
}

/* Add Item button */
.rp-new-addon-add-item {
	margin-top: 10px;
	display: flex;
	align-items: center;
	gap: 6px;
}

.rp-new-addon-add-item .button {
	font-size: 12px;
	height: auto;
	padding: 4px 12px;
}

/* Override the old table-based layout inside create-new-addon */
.rp-metabox.create-new-addon .rp-metabox-content-wrapper {
	display: none; /* replaced by new layout */
}

.rp-metabox.create-new-addon .toolbar-bottom.toolbar {
	display: none; /* add-item button is now inline */
}

/* ── Section actions bar (Add Existing Addon Group) ── */
.rp-fi-addons-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-top: 14px;
	padding: 12px 16px;
	background: #f6f7f7;
	border: 1px dashed #c3c4c7;
	border-radius: 5px;
}

/* ─────────────────────────────────────────────────────────────────────
   Inventory section - opt-in, rendered by the inventory extension.
   ───────────────────────────────────────────────────────────────────── */

.rp-fi-inv-field {
	display: flex;
	flex-direction: column;
	max-width: 320px;
}

.rp-fi-inv-label {
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	margin-bottom: 4px;
}

.rp-fi-inv-help {
	font-size: 12px;
	color: #646970;
	margin: 0 0 8px 0;
}

.rp-fi-inv-input {
	width: 100%;
	font-size: 13px;
	padding: 8px 10px;
}

/* ─────────────────────────────────────────────────────────────────────
   Availability row in the Publish metabox.
   ───────────────────────────────────────────────────────────────────── */

.misc-pub-rp-availability {
	display: flex;
	align-items: center;
	gap: 6px;
}

.misc-pub-rp-availability .dashicons {
	color: #8c8f94;
	width: 18px;
	height: 18px;
	font-size: 18px;
	margin-right: 2px;
	flex-shrink: 0;
}

.misc-pub-rp-availability .rp-availability-pub-label {
	color: #1d2327;
}

.misc-pub-rp-availability .rp-availability-pub-state {
	color: #2e7d32;
	font-weight: 600;
}

.misc-pub-rp-availability.is-unavailable .rp-availability-pub-state {
	color: #c62828;
}

.misc-pub-rp-availability .rp-availability-toggle-pub {
	margin-left: auto;
}

/* Show/hide the correct state label. */
.misc-pub-rp-availability .rp-when-unavailable,
.misc-pub-rp-availability.is-unavailable .rp-when-available {
	display: none;
}
.misc-pub-rp-availability.is-unavailable .rp-when-unavailable,
.misc-pub-rp-availability .rp-when-available {
	display: inline;
}

/* Toggle switch - used in the strip and in the list-table column. */

.rp-availability-toggle,
.rp-availability-col-toggle {
	position: relative;
	display: inline-block;
	cursor: pointer;
	user-select: none;
	flex-shrink: 0;
}

.rp-availability-toggle .rp-availability-checkbox,
.rp-availability-col-toggle .rp-availability-quick {
	position: absolute;
	opacity: 0;
	width: 0;
	height: 0;
	pointer-events: none;
}

.rp-availability-switch {
	display: inline-block;
	width: 44px;
	height: 24px;
	background: #c3c4c7;
	border-radius: 999px;
	position: relative;
	transition: background-color .2s ease;
	vertical-align: middle;
}

.rp-availability-switch > span {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 20px;
	height: 20px;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
	transition: transform .2s ease;
}

.rp-availability-toggle .rp-availability-checkbox:checked + .rp-availability-switch,
.rp-availability-col-toggle .rp-availability-quick:checked + .rp-availability-switch {
	background: #2e7d32;
}

.rp-availability-toggle .rp-availability-checkbox:checked + .rp-availability-switch > span,
.rp-availability-col-toggle .rp-availability-quick:checked + .rp-availability-switch > span {
	transform: translateX(20px);
}

.rp-availability-toggle .rp-availability-checkbox:focus + .rp-availability-switch,
.rp-availability-col-toggle .rp-availability-quick:focus + .rp-availability-switch {
	outline: 2px solid #2271b1;
	outline-offset: 2px;
}

.rp-availability-toggle .rp-availability-checkbox:disabled + .rp-availability-switch,
.rp-availability-col-toggle .rp-availability-quick:disabled + .rp-availability-switch {
	opacity: 0.6;
	cursor: not-allowed;
}

/* List-table column spacing. */
.column-rp_availability {
	width: 110px;
}
.rp-availability-col-spinner {
	vertical-align: middle;
	margin-left: 4px;
	float: none;
}
.rp-availability-col-spinner.is-active {
	visibility: visible;
}

/* ─────────────────────────────────────────────────────────────────────
   Description section - short (excerpt) + full (content).
   ───────────────────────────────────────────────────────────────────── */

.rp-fi-desc-row {
	display: flex;
	flex-direction: column;
	gap: 22px;
}

.rp-fi-desc-field {
	display: flex;
	flex-direction: column;
}

.rp-fi-desc-label {
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	margin-bottom: 4px;
}

.rp-fi-desc-help {
	font-size: 12px;
	color: #646970;
	margin: 0 0 8px 0;
}

.rp-fi-desc-textarea {
	width: 100%;
	min-height: 56px;
	resize: vertical;
	font-size: 13px;
	line-height: 1.5;
	padding: 8px 10px;
}

/* Tighten up the wp_editor chrome so it sits cleanly inside our section. */
#general_description_data .wp-editor-wrap {
	border: 1px solid #dcdcde;
	border-radius: 4px;
	overflow: hidden;
}
#general_description_data .wp-editor-tabs {
	background: #f6f7f7;
}
#general_description_data .mce-toolbar-grp,
#general_description_data .quicktags-toolbar {
	border-bottom: 1px solid #dcdcde;
}

/* ─────────────────────────────────────────────────────────────────────
   Category & Tags section - two labelled subfields side-by-side (50/50),
   collapsing to stacked on narrow screens.
   ───────────────────────────────────────────────────────────────────── */

.rp-fi-tax-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 22px;
}

.rp-fi-tax-field {
	display: flex;
	flex-direction: column;
	flex: 1 1 280px;
	min-width: 0;
}

.rp-fi-tax-label {
	font-size: 13px;
	font-weight: 600;
	color: #1d2327;
	margin-bottom: 4px;
}

.rp-fi-required-mark {
	color: #d63638;
	margin-left: 2px;
}

.rp-fi-section-help {
	font-size: 12px;
	color: #646970;
	margin: 0 0 14px 0;
}

.rp-fi-tax-help {
	font-size: 12px;
	color: #646970;
	margin: 0 0 8px 0;
}

/* Reset the inner category block - section already wraps the field. */
#category_fooditem_data .options_group.rp-category,
#category_fooditem_data .rp-metabox {
	margin: 0;
	padding: 0;
	border: none;
	background: none;
}

/* Tags Select2 - match the categories Select2 chrome so the two subfields
   read as a single, consistent pair. */
.rp-fi-tax-field .select2-container {
	width: 100% !important;
}
.rp-fi-tax-field .select2-container--default .select2-selection--multiple {
	min-height: 40px;
	border-color: #8c8f94;
	border-radius: 4px;
	padding: 3px 4px;
}
.rp-fi-tax-field .select2-container--default.select2-container--focus .select2-selection--multiple {
	border-color: #2271b1;
	box-shadow: 0 0 0 1px #2271b1;
}

/* Pill chip - Select2 v4 absolutely-positions the × inside the chip,
   so we have to RESERVE left padding for it rather than rely on flex gap. */
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-selection__choice {
	background: #f0f6fc;
	border: 1px solid #c5d9ed;
	color: #1d2327;
	border-radius: 14px;
	padding: 3px 12px 3px 26px; /* 26px left reserves space for the absolute × */
	margin: 3px 4px 0 0;
	font-size: 12px;
	line-height: 1.5;
	height: auto;
	position: relative;
}

/* Repositioned × - vertically centred, with a small gap to the label. */
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
	color: #555;
	background: transparent;
	border: none;
	font-size: 14px;
	font-weight: bold;
	line-height: 1;
	padding: 0 4px;
	position: absolute;
	left: 4px;
	top: 50%;
	transform: translateY(-50%);
}
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:hover,
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-selection__choice__remove:focus {
	color: #d63638;
	background: transparent;
	outline: none;
}

/* Newer Select2 wraps the label in a __display span - strip its default
   padding so spacing is controlled solely by the chip's padding. */
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-selection__choice__display {
	padding-left: 0;
	padding-right: 0;
}

/* Placeholder & search field tweaks for a tidier empty state. */
.rp-fi-tax-field .select2-container--default .select2-selection--multiple .select2-search--inline .select2-search__field {
	margin-top: 6px;
	margin-left: 4px;
}