/*
	Modul Webinar - verejny registracni formular (WebinarRegistrationPublic).
	Nahrat do: \AppAsset\Styles\WebinarRegistration.css
	Formular ho nacita pres <ExternalCssRelativePaths> - soubor se tedy nacte jen na strance verejneho formulare.

	Barva znacky z nastaveni modulu se nastavuje skriptem do promenne --wr-brand na elementu .wr-page
	(atribut data-brand); bez skriptu se pouzije vychozi barva nize.
*/

/* ---------- Skryti rozhrani SmartFP ---------- */
.navbar-lmtl4,
.page-header-lmtl4,
.nav-tabs,
.card-footer,
.breadcrumb-line {
	display: none !important;
}

/* Cele pozadi stranky bile (i pri tmavem tematu theme-dark-lmtl4) */
body,
.page-content-lmtl4,
.content-wrapper-lmtl4,
.content-inner-lmtl4,
.content-lmtl4 {
	background: #ffffff !important;
}

/* Bez ramecku SmartFP kolem cele stranky (.wr-page).
   Puvodni selektory .content-lmtl4 > .card cilily na pevne vnoreni a ramecek kolem
   stranky nechytaly. :has(.wr-page) zasahne kazdy obal, ktery stranku obsahuje, at je
   v DOM vnoreny jakkoli - a zadny jiny, protoze .wr-page je jen na verejnem formulari. */
.content-lmtl4 > .card,
.content-lmtl4 .card > form > .card-body,
.card:has(.wr-page),
.card-body:has(.wr-page),
.tab-content:has(.wr-page),
.tab-pane:has(.wr-page) {
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
}

.content-lmtl4 .card > form > .card-body,
.card-body:has(.wr-page) {
	padding: 0 !important;
}

/* ---------- Spolecne ---------- */
.wr-page {
	--wr-brand: #0b5cab;
	max-width: 1040px;
	margin: 0 auto;
	padding: 32px 16px 56px 16px;
	font-family: "Segoe UI", Helvetica, Arial, sans-serif;
	color: #0f172a;
}

.wr-page.wr-page-narrow {
	max-width: 720px;
	padding-top: 40px;
}

/* Logo ~/AppAsset/Content/Images/SmartFP-VAR-8 1.png - bile na pruhlednem pozadi, primo na barevnem panelu (bez podbarveni) */
.wr-logo-box {
	display: inline-block;
	margin-bottom: 26px;
}

/* PNG 2000 x 347 - pevna vyska, sirka podle pomeru stran */
.wr-logo {
	display: block;
	width: auto;
	height: 34px;
}

/* ---------- Registracni formular ---------- */
/* Ramecek kolem barevneho panelu webinare a formulare vedle nej. Vzhled (zaobleni,
   bile pozadi, stin) je shodny s kartou .wr-card na strance po registraci. */
.wr-shell {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 32px;
	padding: 24px;
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 18px 50px rgba(15, 23, 42, .12);
}

.wr-hero {
	position: relative;
	overflow: hidden;
	flex: 1 1 360px;
	padding: 40px 36px;
	border-radius: 16px;
	color: #ffffff;
	background: linear-gradient(150deg, var(--wr-brand) 0%, #0f172a 130%);
}

.wr-hero:after {
	content: "";
	position: absolute;
	right: -60px;
	bottom: -60px;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	background: rgba(255, 255, 255, .08);
}

.wr-eyebrow {
	display: inline-block;
	margin-bottom: 18px;
	padding: 5px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .16);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.wr-title {
	margin: 0 0 16px 0;
	font-size: 30px;
	font-weight: 700;
	line-height: 1.2;
	color: #ffffff;
}

.wr-hero-content {
	position: relative;
	z-index: 1;
}

.wr-description {
	font-size: 15px;
	line-height: 1.65;
	opacity: .92;
}

.wr-description a {
	color: #ffffff;
	text-decoration: underline;
}

.wr-facts {
	list-style: none;
	margin: 28px 0 0 0;
	padding: 0;
}

.wr-facts li {
	display: flex;
	align-items: flex-start;
	margin-bottom: 14px;
	font-size: 14px;
}

.wr-facts i {
	flex-shrink: 0;
	width: 34px;
	height: 34px;
	margin-right: 12px;
	border-radius: 10px;
	background: rgba(255, 255, 255, .14);
	line-height: 34px;
	text-align: center;
}

.wr-facts small {
	display: block;
	font-size: 12px;
	opacity: .75;
}

.wr-facts strong {
	font-weight: 600;
}

.wr-links {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin-top: 8px;
}

.wr-info-link {
	display: inline-block;
	margin-top: 10px;
	border-bottom: 1px solid rgba(255, 255, 255, .5);
	color: #ffffff !important;
	font-weight: 600;
	text-decoration: none;
}

.wr-info-link:hover {
	border-bottom-color: #ffffff;
}

.wr-lead {
	margin-bottom: 22px;
	font-size: 15px;
	line-height: 1.6;
	color: #334155;
}

.wr-lead p:last-child {
	margin-bottom: 0;
}

.wr-form {
	flex: 1 1 420px;
	padding: 8px 0 0 0;
}

.wr-form label,
.wr-form .col-form-label {
	display: block;
	margin-bottom: 6px;
	font-size: 13px;
	font-weight: 600;
	color: #334155;
}

.wr-form .form-group {
	margin-bottom: 18px;
}

.wr-form input.form-control {
	height: 46px;
	padding: 10px 14px;
	border: 1px solid #cbd5e1;
	border-radius: 10px;
	background: #f8fafc;
	font-size: 15px;
	transition: border-color .15s, box-shadow .15s, background .15s;
}

.wr-form input.form-control:focus {
	border-color: var(--wr-brand);
	background: #ffffff;
	box-shadow: 0 0 0 4px rgba(11, 92, 171, .12);
}

.wr-consent {
	margin: 6px 0 20px 0;
	font-size: 13px;
	line-height: 1.55;
	color: #475569;
}

.wr-consent a {
	color: var(--wr-brand);
	font-weight: 600;
}

/* Tlacitko je <a class="btn btn-sm"> - text a ikonu centrovat flexem, pevna vyska sama vertikalne necentruje */
.wr-submit .btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 52px;
	padding-top: 0;
	padding-bottom: 0;
	line-height: 1;
	border-color: var(--wr-brand) !important;
	border-radius: 10px;
	background: var(--wr-brand) !important;
	box-shadow: 0 10px 24px rgba(15, 23, 42, .18);
	font-size: 16px;
	font-weight: 700;
}

.wr-note {
	margin-top: 12px;
	font-size: 12px;
	color: #94a3b8;
	text-align: center;
}

/* ---------- Stranka po registraci ---------- */
.wr-card {
	overflow: hidden;
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 18px 50px rgba(15, 23, 42, .12);
}

.wr-top {
	padding: 36px 36px 28px 36px;
	background: linear-gradient(150deg, var(--wr-brand) 0%, #0f172a 130%);
	color: #ffffff;
	text-align: center;
}

.wr-top .wr-logo-box {
	margin-bottom: 20px;
}

.wr-top .wr-logo {
	height: 30px;
}

.wr-check {
	width: 64px;
	height: 64px;
	margin: 0 auto 16px auto;
	border-radius: 50%;
	background: rgba(255, 255, 255, .18);
	font-size: 30px;
	line-height: 64px;
}

.wr-top h1 {
	margin: 0 0 8px 0;
	font-size: 26px;
	font-weight: 700;
	color: #ffffff;
}

.wr-top p {
	margin: 0;
	font-size: 15px;
	opacity: .9;
}

.wr-body {
	padding: 30px 36px 36px 36px;
}

.wr-message {
	font-size: 15px;
	line-height: 1.65;
	color: #1e293b;
}

.wr-calendar {
	margin-top: 26px;
	padding: 22px;
	border-radius: 12px;
	background: #f1f5f9;
}

.wr-calendar h2 {
	margin: 0 0 4px 0;
	font-size: 17px;
	font-weight: 700;
}

.wr-calendar p {
	margin: 0 0 16px 0;
	font-size: 13px;
	color: #64748b;
}

.wr-cal-buttons {
	display: flex;
	flex-wrap: wrap;
	margin: -5px;
}

.wr-cal-buttons a {
	flex: 1 1 180px;
	margin: 5px;
	padding: 12px 14px;
	border: 1px solid #cbd5e1;
	border-radius: 10px;
	background: #ffffff;
	color: #0f172a !important;
	font-weight: 600;
	text-align: center;
	text-decoration: none;
}

.wr-cal-buttons a:hover {
	border-color: var(--wr-brand);
	color: var(--wr-brand) !important;
}

.wr-ics-title {
	margin-top: 16px;
	font-size: 13px;
	font-weight: 600;
}

/* Soubor .ics (CalendarFile) pod kartou kalendare */
.wr-body.wr-file {
	padding-top: 0;
}

.wr-body.wr-file:empty {
	display: none;
}

/* ---------- Neplatny odkaz / zalozni potvrzeni ---------- */
.wr-status {
	max-width: 560px;
	margin: 60px auto;
	padding: 36px;
	border-radius: 16px;
	background: #ffffff;
	box-shadow: 0 18px 50px rgba(15, 23, 42, .12);
	font-family: "Segoe UI", Helvetica, Arial, sans-serif;
	text-align: center;
}

.wr-status .wr-icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 16px auto;
	border-radius: 50%;
	background: #dcfce7;
	color: #16a34a;
	font-size: 30px;
	line-height: 64px;
}

.wr-status.wr-status-warning .wr-icon {
	background: #fef3c7;
	color: #d97706;
}

.wr-status h1 {
	margin: 0 0 10px 0;
	font-size: 24px;
	font-weight: 700;
	color: #0f172a;
}

.wr-status p {
	margin: 0;
	color: #475569;
}

/* ---------- Vlozeni na web (&embed=1 nebo iframe) ---------- */
body.wr-embed {
	background: transparent !important;
}

body.wr-embed .wr-page {
	max-width: none;
	padding: 0;
}

body.wr-embed .wr-card,
body.wr-embed .wr-shell {
	border: 1px solid #e2e8f0;
	box-shadow: none;
}

body.wr-embed .wr-hero {
	display: none;
}

body.wr-embed .wr-form {
	padding: 0;
}

/* ---------- Mobil ---------- */
@media (max-width: 767px) {
	.wr-page {
		padding: 0 0 32px 0;
	}

	.wr-hero,
	.wr-card,
	.wr-shell {
		border-radius: 0;
	}

	/* Panel i formular maji na mobilu vlastni odsazeni nize - bez tohoto by se
	   s odsazenim ramecku sectlo a na uzkem displeji ubiralo misto. */
	.wr-shell {
		padding: 0;
	}

	.wr-hero,
	.wr-form,
	.wr-body {
		padding: 28px 20px;
	}

	.wr-title {
		font-size: 24px;
	}
}