/* «Воссоздание модели» — шорткод [aimp_rebuild]. */

.aimp-rb {
	--rb-accent: #6c5ce7;
	--rb-line: #e3e5ef;
	max-width: 900px;
}

.aimp-rb-free {
	margin: 0 0 1.4em;
	padding: .7em .9em;
	border-radius: 8px;
	background: #e9f7ee;
	color: #1a7f37;
	font-size: .9em;
}

.aimp-rb-step {
	margin-bottom: 2em;
}

.aimp-rb-title {
	display: flex;
	align-items: center;
	gap: .6em;
	margin: 0 0 .5em;
	font-size: 1.05em;
}

.aimp-rb-title span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 1.7em;
	height: 1.7em;
	border-radius: 50%;
	background: var(--rb-accent);
	color: #fff;
	font-size: .8em;
	flex: 0 0 auto;
}

.aimp-rb-hint {
	margin: 0 0 1em;
	color: #6b7080;
	font-size: .92em;
	line-height: 1.5;
}

/* --- загрузка --- */

.aimp-rb-drop {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1.5em;
	border: 2px dashed var(--rb-line);
	border-radius: 10px;
	cursor: pointer;
	color: #6b7080;
	font-size: .93em;
	transition: border-color .15s;
}

.aimp-rb-drop:hover {
	border-color: var(--rb-accent);
}

.aimp-rb-files {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 12px;
}

.aimp-rb-file {
	position: relative;
	width: 116px;
	padding: 6px;
	border: 1px solid var(--rb-line);
	border-radius: 10px;
	background: #fff;
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.aimp-rb-file img {
	width: 100%;
	height: 78px;
	object-fit: cover;
	border-radius: 6px;
	display: block;
}

.aimp-rb-file-name {
	font-size: .72em;
	color: #3a3f51;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.aimp-rb-file-del {
	position: absolute;
	top: -7px;
	right: -7px;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	border: 1px solid var(--rb-line);
	background: #fff;
	color: #98304a;
	font-size: 15px;
	line-height: 1;
	cursor: pointer;
	padding: 0;
}

.aimp-rb-file-del:hover {
	background: #98304a;
	color: #fff;
}

/* --- ракурсы --- */

.aimp-rb-views {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.aimp-rb-view {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: .55em .9em;
	border: 1px solid var(--rb-line);
	border-radius: 999px;
	background: #fff;
	cursor: pointer;
	font-size: .9em;
	transition: border-color .15s, background .15s;
}

.aimp-rb-view:has(input:checked) {
	border-color: var(--rb-accent);
	background: #f3f1ff;
	color: var(--rb-accent);
}

.aimp-rb-warn {
	margin-top: 1em;
	padding: .8em .9em;
	border-radius: 8px;
	background: #fff6e8;
	color: #8a5a00;
	font-size: .85em;
	line-height: 1.5;
}

/* --- уточнения --- */

.aimp-rb-notes {
	margin-bottom: 1.2em;
}

.aimp-rb-notes label {
	display: block;
	margin-bottom: .35em;
	font-size: .92em;
	color: #3a3f51;
}

.aimp-rb-notes label span {
	color: #8b8fa3;
}

/* Поле растёт под текст (высоту ведёт growNotes в aimp-rebuild.js), CSS
   задаёт только пределы: ниже 84px не сжимается, выше 420px — прокрутка
   внутри поля, чтобы кнопка запуска не уезжала за экран. */
.aimp-rb-notes textarea {
	width: 100%;
	min-height: 84px;
	max-height: 420px;
	overflow-y: auto;
	line-height: 1.5;
	padding: .6em .8em;
	border: 1px solid var(--rb-line);
	border-radius: 8px;
	font: inherit;
	font-size: .92em;
	resize: vertical;
}

.aimp-rb-notes-hint {
	margin: .4em 0 0;
	font-size: .82em;
	color: #8b8fa3;
	line-height: 1.5;
}

.aimp-rb-res {
	display: flex;
	align-items: center;
	gap: .7em;
	flex-wrap: wrap;
	font-size: .92em;
}

.aimp-rb-res select {
	padding: .45em .6em;
	border: 1px solid var(--rb-line);
	border-radius: 8px;
	background: #fff;
	font: inherit;
}

.aimp-rb-total {
	color: var(--rb-accent);
	font-weight: 600;
}

.aimp-rb-run {
	display: block;
	margin-top: 1.2em;
	padding: .75em 1.7em;
	border: 0;
	border-radius: 8px;
	background: var(--rb-accent);
	color: #fff;
	font-size: .95em;
	cursor: pointer;
}

.aimp-rb-run:disabled {
	opacity: .5;
	cursor: default;
}

/* --- статус --- */

.aimp-rb-status {
	margin-top: .9em;
	padding: .7em .9em;
	border-radius: 8px;
	font-size: .9em;
	background: #f4f5fa;
	color: #3a3f51;
}

.aimp-rb-status.is-ok {
	background: #e9f7ee;
	color: #1a7f37;
}

.aimp-rb-status.is-error {
	background: #fdf0f0;
	color: #a02020;
}

/* --- результаты --- */

.aimp-rb-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
	gap: 16px;
}

.aimp-rb-card {
	position: relative;
	border: 1px solid var(--rb-line);
	border-radius: 10px;
	padding: 8px;
	background: #fff;
}

.aimp-rb-badge {
	position: absolute;
	top: 14px;
	left: 14px;
	z-index: 2;
	padding: .18em .7em;
	border-radius: 999px;
	background: var(--rb-accent);
	color: #fff;
	font-size: 11px;
	font-weight: 600;
	text-transform: uppercase;
}

.aimp-rb-slot {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 150px;
	font-size: .85em;
	color: #6b7080;
	text-align: center;
}

.aimp-rb-slot img {
	width: 100%;
	height: auto;
	border-radius: 6px;
	display: block;
}

.aimp-rb-card.is-pending .aimp-rb-slot {
	background: #f4f5fa;
	border-radius: 6px;
}

.aimp-rb-card.is-failed .aimp-rb-slot {
	color: #a02020;
}

.aimp-rb-downloads {
	display: flex;
	gap: 1em;
	justify-content: center;
	flex-wrap: wrap;
}

.aimp-rb-downloads a {
	color: var(--rb-accent);
	font-size: .92em;
}
