/**
 * Logimismodaal — kaheveerune heleda brändipaneeliga.
 *
 * Kavand: kavandid/logimismodaal-variandid.html, valitud v6a (omanik
 * 19.08.2026; enne seda tume v5, mille kohta omanik päris lehte nähes:
 * „vasak pool peaks ikka olema hele"). Kest (taust, sulgemisnupp,
 * kehalukk) tuleb teema .lg-modal komponendist; akna polsterdus
 * nullitakse siin, sest vasak paneel jookseb servast servani.
 *
 * VASAK PANEEL on kreemjas (--lg-cream) parempoolse joonega. Mis hoiab
 * elemendid koos (varasem kreemjas katse kukkus „ei sulandu" pärast
 * läbi): paneelil on OMA pind ja piirjoon, suur märk seob taustakunstina
 * kihid ja kogu tekst on üks vasakjoondatud voog. Logo on täpselt saidi
 * päise oma — heledal pinnal ei vaja ta ümbervärvimist.
 */

#lg-logimodal .lg-modal__aken {
	width: min(640px, 100%);
	padding: 0;
	display: grid;
	grid-template-columns: 232px minmax(0, 1fr);
	overflow: hidden;
}

/* --- Vasak: hele brändipaneel ------------------------------------------ */

.lg-logimodal__brand {
	position: relative;
	overflow: hidden;
	background: var(--lg-cream, #fef8ec);
	border-right: 1px solid var(--lg-line, #f0e4cb);
	padding: 24px 22px 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

/* Täislogo nagu lehe päises — märk teema jagatud funktsioonist, värvid
   needsamad, mis päises (tume pool + kuldne pool). */
.lg-logimodal__pea2 { position: relative; display: flex; align-items: center; gap: 10px; }
.lg-logimodal__mark { flex: none; width: 38px; height: 35px; }
.lg-logimodal__mark .lg-mark__leht--vasak { fill: rgba(30, 41, 59, 0.85); }
.lg-logimodal__mark .lg-mark__leht--parem { fill: var(--lg-gold); }
.lg-logimodal__tekst { display: flex; flex-direction: column; line-height: 1.15; }
.lg-logimodal__nimi { font-weight: 800; font-size: 1.05rem; color: var(--lg-ink); }
.lg-logimodal__nimi .lg-brand__mar { color: var(--lg-gold); }
.lg-logimodal__alarida {
	font-size: 0.58rem; font-weight: 600; letter-spacing: 0.32em;
	text-transform: uppercase; color: #4a4644;
}

/* Õpikeskkonna plokk: kasutaja peab aru saama, KUHU ta sisse logib —
   eriti otse lingiga tulles, ilma saidi kontekstita.
   Silt tekstikullas (#8a6d1f), mitte nupukullas — #f4b943 kreemjal on
   ~1,6:1 kontrast, sama Lighthouse'i klass, mille juba kord parandasime. */
.lg-logimodal__keskkond { position: relative; margin: 18px 0; }
.lg-logimodal__silt {
	margin: 0 0 5px; font-size: 0.66rem; font-weight: 800;
	letter-spacing: 0.22em; text-transform: uppercase; color: var(--lg-gold-text, #8a6d1f);
}
.lg-logimodal__jutt { margin: 0; font-size: 0.86rem; line-height: 1.55; color: rgba(30, 41, 59, 0.78); }

/* Suur märk taustakunstina — kärbitud nurgast. Tume pool õrn hall,
   kuldne pool kannab: kuld kreemjal on sooja tooniga sama pere. */
.lg-logimodal__vesimark { position: absolute; right: -56px; bottom: -40px; pointer-events: none; }
.lg-logimodal__suurmark { width: 230px; height: 211px; display: block; }
.lg-logimodal__suurmark .lg-mark__leht--vasak { fill: rgba(30, 41, 59, 0.05); }
.lg-logimodal__suurmark .lg-mark__leht--parem { fill: rgba(244, 185, 67, 0.22); }

/* Turvarida: paroolivälja EI OLE ja ilma selgituseta paistaks see veana —
   rida vastab küsimusele enne, kui ta tekib. Lukk teksti suhtes keskel. */
.lg-logimodal__turva { position: relative; display: flex; align-items: center; gap: 8px; }
.lg-logimodal__turva svg { flex: none; color: rgba(30, 41, 59, 0.62); }
.lg-logimodal__turva p { margin: 0; font-size: 0.74rem; line-height: 1.5; color: rgba(30, 41, 59, 0.62); }

/* --- Parem: pealkiri ja nupud ------------------------------------------ */

.lg-logimodal__sisu { padding: 28px 28px 26px; }
.lg-logimodal__pea { margin: 0 0 18px; }
.lg-logimodal__pea .lg-modal__alapealkiri { margin-top: 2px; }

.lg-logimodal__sots { display: grid; gap: 10px; }
.lg-logimodal__nupp {
	display: flex; align-items: center; justify-content: center; gap: 10px;
	width: 100%; padding: 11px 16px;
	border: 1px solid var(--lg-line); border-radius: 10px;
	background: #fff; color: var(--lg-ink);
	font-size: 0.95rem; font-weight: 600; line-height: 1.2;
	text-decoration: none;
	transition: border-color 0.12s ease, box-shadow 0.12s ease;
}
/* Hover AINULT päris nuppudel: ootel nupp ei tohi hiire all ellu ärgata
   (omanik 19.08.2026) — kuldne raam lubaks klõpsatavust, mida ei ole. */
.lg-logimodal__nupp:not(.lg-logimodal__nupp--ootel):hover,
.lg-logimodal__nupp:not(.lg-logimodal__nupp--ootel):focus-visible {
	border-color: var(--lg-gold);
	box-shadow: 0 8px 18px -12px rgba(30, 41, 59, 0.35);
	color: var(--lg-ink);
	text-decoration: none;
}
.lg-logimodal__nupp svg { flex: none; }

/* Ootel nupp (kavand v6a): pakkuja on registris, voog veel kinni. Tuhm,
   ilma märgiseta ja linkimata — kreemjas pind on sama toon mis paneelil,
   nad kuuluvad kokku. Logo jääb värvi: hall logo näeks välja nagu viga. */
.lg-logimodal__nupp--ootel { cursor: default; background: var(--lg-cream, #fef8ec); }
.lg-logimodal__nupp--ootel > * { opacity: 0.5; }

/* Üks vaikne selgitusrida nuppude all — ütleb põhjuse ühe korra, mitte
   iga nupu küljes (omanik: märgised ei meeldi). */
.lg-logimodal__ootel-rida {
	margin: 12px 0 0; font-size: 0.78rem; line-height: 1.5;
	color: rgba(30, 41, 59, 0.62); text-align: center;
}

/* Sulgemisrist valgel poolel, kihina üle mõlema veeru. */
#lg-logimodal .lg-modal__sulge { z-index: 1; }

/* --- Kitsas ekraan: paneel kukub kompaktseks ülaribaks ------------------ */
@media (max-width: 700px) {
	#lg-logimodal .lg-modal__aken { grid-template-columns: 1fr; }
	.lg-logimodal__brand { padding: 16px 20px; border-right: 0; border-bottom: 1px solid var(--lg-line, #f0e4cb); }
	/* Taustakunst ja keskkonnaplokk ära — kitsal on ruum kallis ja logo
	   + turvarida ütlevad olulise; keskkonnajutt on desktopi luksus. */
	.lg-logimodal__vesimark { display: none; }
	.lg-logimodal__keskkond { display: none; }
	.lg-logimodal__turva { margin-top: 12px; }
	.lg-logimodal__sisu { padding: 20px 20px 22px; }
	/* Puutesihik: Beta 1.1 reegel — nupud vähemalt 44 px kõrged. */
	.lg-logimodal__nupp { padding-block: 12px; }
}