/**
 * Know-how B2B rules — Back In Stock Notifier box.
 *
 * Optional module: delete with includes/stock-notifier/ and
 * assets/js/kbr-stock-notifier.js. Styles the notifier's own Bootstrap-panel
 * markup to match the design. Two things are set in the notifier's settings, not
 * here: the heading text ("Obvestimo vas, ko bo spet na zalogi") and the email
 * placeholder.
 */

.kbr-notify-box {
	background: #fdecee;
	border: 1px solid #f6ccd1;
	border-radius: 16px;
	margin-top: 1rem;
	padding: 1.1rem 1.2rem;
}

.kbr-notify-box__choose,
.kbr-notify-box__for {
	align-items: center;
	color: #b3242d;
	display: flex;
	font-size: 0.9rem;
	font-weight: 600;
	gap: 0.5rem;
	margin: 0 0 0.7rem;
}

.kbr-notify-box__choose select {
	border: 1px solid #f6ccd1;
	border-radius: 8px;
	padding: 0.35rem 0.6rem;
}

/* Flatten the notifier's Bootstrap panel into the box. The theme styles .panel
   and .panel-primary with their own border, background and shadow — that is the
   blue frame — so these need !important to win. */
.kbr-notify-box .cwginstock-subscribe-form,
.kbr-notify-box .panel,
.kbr-notify-box .panel-primary,
.kbr-notify-box .cwginstock-panel-primary,
.kbr-notify-box .panel-body,
.kbr-notify-box .cwginstock-panel-body,
.kbr-notify-box .row,
.kbr-notify-box .col-md-12 {
	background: none !important;
	border: 0 !important;
	box-shadow: none !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	width: auto !important;
}

/* Heading: the mail glyph is drawn here so no asset is needed, and the plugin's
   centred inline style is overridden to sit left as in the design. */
.kbr-notify-box .panel-heading,
.kbr-notify-box .cwginstock-panel-heading {
	background: none !important;
	border: 0 !important;
	border-radius: 0 !important;
	color: inherit !important;
	margin: 0 0 0.7rem !important;
	padding: 0 !important;
}

.kbr-notify-box .cwginstock-panel-heading h4 {
	color: #b3242d;
	font-size: 1.05rem;
	font-weight: 700;
	margin: 0;
	padding-left: 26px;
	position: relative;
	text-align: left !important;
}

/* Envelope glyph, drawn from two pseudo-elements so no asset is needed. */
.kbr-notify-box .cwginstock-panel-heading h4::before {
	content: "";
	left: 3px;
	position: absolute;
	top: 2px;
	width: 7px;
	background-image: url('data:image/svg+xml,<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M12.6667 3.33325H3.33333C2.59695 3.33325 2 3.93021 2 4.66659V11.3333C2 12.0696 2.59695 12.6666 3.33333 12.6666H12.6667C13.403 12.6666 14 12.0696 14 11.3333V4.66659C14 3.93021 13.403 3.33325 12.6667 3.33325Z" stroke="%23991B1B" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/><path d="M2 4.66675L8 8.66675L14 4.66675" stroke="%23991B1B" stroke-width="1.2" stroke-linecap="round" stroke-linejoin="round"/></svg>');
	background-position: center;
	background-repeat: no-repeat;
	background-size: contain;
	width: 16px;
	height: 16px;
	display: inline-block;
}

/* Email + button on one line, pill-shaped, as in the design. */
.kbr-notify-box .cwginstock-subscribe-form__form {
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
}

.kbr-notify-box .form-group,
.kbr-notify-box .form-group.center-block {
	margin: 0;
}

.kbr-notify-box .form-group:first-child {
	flex: 1 1 240px;
}

.kbr-notify-box .cwgstock_email {
	background: #fff;
	border: 1px solid #f0c2c8;
	border-radius: 999px;
	box-sizing: border-box;
	padding: 0.8rem 1.2rem;
	text-align: left !important;
	width: 100% !important;
}

.kbr-notify-box .cwgstock_email:focus {
	border-color: var(--kbr-accent, #334eac);
	outline: none;
}

.kbr-notify-box .cwgstock_button {
	background: var(--kbr-accent, #334eac);
	border: 0;
	border-radius: 999px;
	color: #fff;
	cursor: pointer;
	font-weight: 700;
	padding: 0.8rem 1.6rem;
	white-space: nowrap;
}

.kbr-notify-box .cwgstock_button:hover {
	filter: brightness(1.08);
}

/* The plugin's status/validation line, kept inside the box. */
.kbr-notify-box .cwgstock_output {
	flex-basis: 100%;
	font-size: 0.85rem;
	margin-top: 0.5rem;
}

.kbr-notify-box .cwgstock_output:empty {
	display: none;
}

/* An optional name/phone field, if ever switched on, drops to its own line. */
.kbr-notify-box .cwgstock_name,
.kbr-notify-box .cwgstock_phone {
	border: 1px solid #f0c2c8;
	border-radius: 999px;
	box-sizing: border-box;
	flex: 1 1 100%;
	padding: 0.8rem 1.2rem;
}

@media (max-width: 520px) {
	.kbr-notify-box .cwgstock_button {
		flex: 1 1 100%;
	}
}


.kbr-notify-box .cwgstock_button {
	height: 38px;
	padding: 0 16px;
	font-size: 14px;
}

.kbr-notify-box .cwgstock_email {
	box-sizing: border-box;
	text-align: left !important;
	background: #fff;
	border: 1px solid #fecaca;
	border-radius: 100px;
	outline: 0;
	flex: 1 1 0;
	width: 0;
	min-width: 0;
	height: 38px;
	padding: 0 14px;
	font-size: 13.5px;
	margin-bottom: 0 !important;
}

.kbr-notify-box .cwginstock-subscribe-form,
.kbr-notify-box .panel,
.kbr-notify-box .panel-primary,
.kbr-notify-box .cwginstock-panel-primary,
.kbr-notify-box .panel-body,
.kbr-notify-box .cwginstock-panel-body,
.kbr-notify-box .row,
.kbr-notify-box .col-md-12 {
	width: 100% !important;
}