/* Price and renewal term fields of the file form (Nexus "stack" fields).
   Loaded on every page through a theme hook in <head>; every rule is scoped to those fields. */

/* renewal term: price, "per", number and unit in one tidy row */
.cNexusStack_usergroup > ol {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 14px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.cNexusStack_usergroup > ol > li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}
.cNexusStack_usergroup br { display: none; }

/* the word between the price and the period */
.cNexusStack_usergroup > ol > li[data-role="unlimitedCatch"]::before {
	content: "за";
	color: color-mix(in srgb, currentColor 60%, transparent);
}

.cNexusStack_usergroup input[type="number"] { width: 8em; min-width: 0; flex: 0 0 auto; }
.cNexusStack_usergroup input[type="number"].ipsField_tiny { width: 5em; }
.cNexusStack_usergroup select.ipsInput--select { width: auto; min-width: 8em; flex: 0 0 auto; }

/* single price field: wide enough for "3 500,00" */
.ipsFieldRow input[type="number"].ipsField_short { min-width: 8em; }

/* ---- Support topic: notice for visitors without an active license ---- */
.dlNotice {
	display: flex;
	align-items: center;
	gap: 16px;
	margin: 16px 0;
	padding: 16px 20px;
	border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
	border-radius: 12px;
	background: color-mix(in srgb, currentColor 5%, transparent);
}
.dlNotice__icon { flex: none; font-size: 22px; color: color-mix(in srgb, currentColor 55%, transparent); }
.dlNotice__text { flex: 1 1 auto; min-width: 0; display: grid; gap: 2px; }
.dlNotice__text strong { font-size: 15px; }
.dlNotice__text span { font-size: 14px; color: color-mix(in srgb, currentColor 65%, transparent); }
.dlNotice__btn {
	flex: none;
	padding: 8px 16px;
	border-radius: 8px;
	background: color-mix(in srgb, currentColor 10%, transparent);
	color: inherit;
	font-size: 14px;
	font-weight: 600;
	text-decoration: none;
	white-space: nowrap;
}
.dlNotice__btn:hover { background: color-mix(in srgb, currentColor 16%, transparent); text-decoration: none; }
@media (max-width: 640px) { .dlNotice { flex-wrap: wrap; } }

/* ---- Header: the "Download" menu item shown as a button on the right of the navigation bar ----
   The item is taken OUT of the flow (absolute), and only inside the real menu list. The theme measures the
   items of the hidden clone list to decide what goes into "More", so the clone and the flow of the real list
   stay exactly as the theme draws them. */
.ipsNavBar[data-role="menu"] { position: relative; }
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ):not( [hidden] ) {
	position: absolute;
	inset-inline-end: 0;
	top: 50%;
	transform: translateY(-50%);
	height: calc(var(--i-header-row--he, 50px) - 10px);
	margin: 0;
	display: flex;
	align-items: stretch;
}
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ) > a {
	border-radius: 8px;
	background: transparent;
	border: 1px solid #fff;
	color: #fff;
	font-weight: 700;
	transition: background .15s;
}
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ) > a:hover { background: rgba(255, 255, 255, .14); color: #fff; }
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ) > a .ipsNavBar__label { color: inherit; }
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ) > a .ipsNavBar__icon,
.ipsNavBar[data-role="menu"] > li:has( > a[href$="/download/"] ) > a .ipsNavBar__icon i { color: #fff !important; opacity: 1; }
/* ---- Footer menu: groups open a dropdown with the links (managed in the ACP: Download Center > Footer menu) ---- */
.ipsFooterLinks > li.dlFooterMenu > button .fa-angle-up { font-size: 10px; opacity: .6; }
.dlFooterDrop .iDropdown { min-width: 260px; max-width: min(340px, 92vw); }
.dlFooterDrop .iDropdown__items a { display: block; white-space: normal; line-height: 1.35; }

/* ---- Renewal term of a file: radio buttons for the fixed terms (renewal-terms.js) ---- */
.dlTermHidden { display: none !important; }
.cNexusStack_usergroup > ol > li[data-role="unlimitedCatch"].dlTermLi { flex: 1 1 100%; flex-direction: column; align-items: flex-start; gap: 8px; }
.cNexusStack_usergroup > ol > li[data-role="unlimitedCatch"].dlTermLi::before { content: none; }
.dlTermChoice__lead { color: color-mix(in srgb, currentColor 60%, transparent); font-size: 14px; }
.dlTermChoice { display: flex; flex-wrap: wrap; gap: 10px; }
.dlTermChoice label {
	position: relative;
	display: flex;
	flex-direction: column;
	min-width: 140px;
	padding: 10px 18px;
	border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
	border-radius: 10px;
	cursor: pointer;
	transition: border-color .15s, background .15s, color .15s;
}
.dlTermChoice label:hover { border-color: color-mix(in srgb, currentColor 45%, transparent); }
.dlTermChoice input { position: absolute; opacity: 0; pointer-events: none; }
.dlTermChoice strong { font-size: 15px; line-height: 1.3; }
.dlTermChoice span { font-size: 12px; opacity: .6; }
.dlTermChoice label:has( input:checked ) { border-color: #2b3a4d; background: #2b3a4d; color: #fff; }
.dlTermChoice label:has( input:checked ) span { opacity: .75; }
.dlTermChoice label:has( input:focus-visible ) { outline: 2px solid color-mix(in srgb, #2b3a4d 55%, transparent); outline-offset: 2px; }
.dlTermChoice__hint { color: color-mix(in srgb, currentColor 60%, transparent); font-size: 13px; line-height: 1.45; max-width: 640px; }
.dlTermChoice__hint.is-error { color: #b91c1c; font-weight: 600; }

/* ---- "The order is paid" window shown after a payment (paid-modal.js) ---- */
.dlPaid { position: fixed; inset: 0; z-index: 100000; display: flex; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 23, 42, .55); }
.dlPaid__box { width: min(460px, 100%); padding: 32px 28px 24px; border-radius: 14px; background: var(--i-box--ba-co, #fff); color: inherit; text-align: center; box-shadow: 0 20px 60px rgba(0, 0, 0, .35); }
.dlPaid__icon { display: inline-flex; align-items: center; justify-content: center; width: 64px; height: 64px; margin-bottom: 14px; border-radius: 50%; background: color-mix(in srgb, #16a34a 16%, transparent); color: #15803d; }
.dlPaid__icon.is-pending { background: color-mix(in srgb, #d97706 16%, transparent); color: #b45309; }
.dlPaid__title { margin: 0 0 10px; font-size: 22px; line-height: 1.3; }
.dlPaid__items { margin: 0 0 8px; padding: 0; list-style: none; font-weight: 600; }
.dlPaid__items li { margin: 2px 0; overflow-wrap: anywhere; }
.dlPaid__sum { margin: 0 0 10px; color: color-mix(in srgb, currentColor 65%, transparent); }
.dlPaid__text { margin: 0 0 20px; color: color-mix(in srgb, currentColor 75%, transparent); line-height: 1.5; }
.dlPaid__actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.dlPaid__btn { padding: 10px 22px; border: 1px solid color-mix(in srgb, currentColor 22%, transparent); border-radius: 9px; background: transparent; color: inherit; font: inherit; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; }
.dlPaid__btn:hover { border-color: color-mix(in srgb, currentColor 50%, transparent); text-decoration: none; }
.dlPaid__btn--primary { border-color: #2b3a4d; background: #2b3a4d; color: #fff; }
.dlPaid__btn--primary:hover { border-color: #1f2a37; background: #1f2a37; color: #fff; }
html.dlPaid-open { overflow: hidden; }
