/* ═══════════════════════════════════════════════════════════════════════════
   LEPINGUST TAGANEMINE — vorm ja nupud (14.09.2026)

   Sama disainikeel, mis ülejäänud sait: IBM Plex Sans, navy #123F6E,
   hele riba #F6F8FB.
   ═══════════════════════════════════════════════════════════════════════════ */

.tkw,
.tkw-box,
.tkw-done {
	font-family: 'IBM Plex Sans', system-ui, sans-serif;
	box-sizing: border-box;
}
.tkw *,
.tkw *::before,
.tkw *::after { box-sizing: inherit; }

/* 18.09.2026: leht sai Divi "täislaius, ilma külgribata" paigutuse
   (vt tooriistakeskus-taganemine.php _et_pb_page_layout), mis eemaldab
   Divi vaikimisi sektsiooni padding'u - ilma selleta jäi sisu (nupp
   "Kinnitan taganemise" jne) otse vastu sinist jaluseriba. */
.tkw {
	padding-bottom: 60px;
}

/* ── Nupp tellimuse vaates ───────────────────────────────────────────────
   ⚠ NÕUE: „muust infost ERALDATUD ja kergesti leitav". Seepärast on see
   raamitud plokk omaette taustaga, mitte link tabeli nuppude reas. */
.tkw-box {
	/* 18.09.2026: 26px->18px (kliendi soov "kompaktsem kuvamine" - vt
	   tooriistakeskus-modern-shop tms-thankyou.css sama-voorulist
	   tihendamist ülejäänud tellimuse kinnituse lehel - see plokk on
	   samal lehel, peab kandma sama tihedat rütmi). */
	margin: 18px 0;
	padding: 18px 20px;
	background: #F6F8FB;
	border: 1px solid #DCE4EE;
	border-radius: 10px;
}
.tkw-box__lead {
	margin: 0 0 4px;
	font-size: 16px;
	font-weight: 700;
	color: #123F6E;
}
.tkw-box__note {
	margin: 0 0 14px;
	font-size: 14px;
	line-height: 1.5;
	color: rgba(28, 31, 34, 0.7);
}

.tkw-done {
	margin: 26px 0;
	padding: 14px 16px;
	background: #E6EFE4;
	border-left: 4px solid #4B7F52;
	border-radius: 6px;
	font-size: 14.5px;
	line-height: 1.5;
	color: #24421F;
}

/* ── Nupud ─────────────────────────────────────────────────────────────── */
.tkw-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 24px;
	border: 2px solid #123F6E;
	border-radius: 8px;
	background: #123F6E;
	color: #fff !important;
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	transition: background .15s ease;
}
.tkw-btn:hover,
.tkw-btn:focus { background: #0A2A5A; border-color: #0A2A5A; color: #fff !important; }

/*
 * ⚠ KINNITUSNUPP ON TAHTLIKULT TEIST VÄRVI. Selle vajutamine on ametlik
 * taganemisavaldus, mida veebis tagasi võtta ei saa. Punane värv on siin
 * hoiatus, mitte kaunistus — kasutaja peab aru saama, et see samm on lõplik.
 */
.tkw-btn--confirm {
	background: #B23A34;
	border-color: #B23A34;
}
.tkw-btn--confirm:hover,
.tkw-btn--confirm:focus { background: #8A2C27; border-color: #8A2C27; }

.tkw-back {
	margin-left: 14px;
	font-size: 14.5px;
	font-weight: 600;
	color: #123F6E;
	text-decoration: underline;
}

/* ── Teated ────────────────────────────────────────────────────────────── */
.tkw-msg {
	margin: 0 0 22px;
	padding: 16px 18px;
	border-radius: 8px;
	font-size: 15px;
	line-height: 1.55;
}
.tkw-msg h2 { margin: 0 0 8px; font-size: 19px; font-weight: 700; }
.tkw-msg p { margin: 0 0 8px; }
.tkw-msg p:last-child { margin-bottom: 0; }
.tkw-msg__meta { font-size: 13.5px; opacity: .75; }

.tkw-msg--ok   { background: #E6EFE4; border-left: 4px solid #4B7F52; color: #24421F; }
.tkw-msg--warn { background: #FBEBD8; border-left: 4px solid #C97A1A; color: #543307; }
.tkw-msg--err  { background: #F7E3E1; border-left: 4px solid #B23A34; color: #5A1E1A; }
.tkw-msg--info { background: #F6F8FB; border-left: 4px solid #123F6E; color: #1C1F22; }

/* ── Vorm ──────────────────────────────────────────────────────────────── */
.tkw-title {
	margin: 0 0 10px;
	font-size: 25px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: -0.01em;
	color: #123F6E;
}
.tkw-intro {
	margin: 0 0 22px;
	font-size: 15px;
	line-height: 1.6;
	color: rgba(28, 31, 34, 0.8);
}

.tkw-fs {
	margin: 0 0 22px;
	padding: 18px 20px;
	border: 1px solid #DCE4EE;
	border-radius: 10px;
}
.tkw-fs legend {
	padding: 0 8px;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #123F6E;
}

.tkw-order { margin: 0 0 16px; font-size: 15px; }
.tkw-label { margin: 0 0 8px; font-size: 14px; font-weight: 600; color: #123F6E; }

.tkw-items { margin: 0; padding: 0; list-style: none; }
.tkw-items li { margin: 0 0 6px; }
.tkw-items label {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 10px 12px;
	background: #F6F8FB;
	border-radius: 6px;
	font-size: 14.5px;
	line-height: 1.4;
	cursor: pointer;
}
.tkw-items input { margin-top: 3px; flex: 0 0 auto; }
.tkw-item-name { flex: 1 1 auto; min-width: 0; }
.tkw-item-qty  { flex: 0 0 auto; font-weight: 600; color: #123F6E; }

.tkw-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 18px;
}
.tkw-row {
	margin: 0;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}
.tkw-row--wide { margin-top: 14px; }
.tkw-row label { font-size: 14px; font-weight: 600; color: #123F6E; }
.tkw-req { color: #B23A34; }
.tkw-help { font-size: 13px; line-height: 1.45; color: rgba(28, 31, 34, 0.62); }

.tkw input[type="text"],
.tkw input[type="email"],
.tkw input[type="tel"],
.tkw textarea {
	width: 100%;
	padding: 11px 13px;
	border: 1px solid #CFD8E3;
	border-radius: 6px;
	background: #fff;
	font-family: inherit;
	/* ⚠ 16px: alla selle suumib iOS Safari fookuse võtmisel kogu lehe. */
	font-size: 16px;
	line-height: 1.4;
	color: #1C1F22;
}
.tkw textarea { resize: vertical; }
.tkw input:focus,
.tkw textarea:focus {
	outline: 2px solid #123F6E;
	outline-offset: 1px;
	border-color: #123F6E;
}

.tkw-actions { margin: 22px 0 0; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; }

/* ── Kinnitusvaate kokkuvõte ────────────────────────────────────────────── */
.tkw-review {
	margin: 0 0 22px;
	padding: 18px 20px;
	background: #F6F8FB;
	border-radius: 10px;
	display: grid;
	grid-template-columns: minmax(140px, 200px) 1fr;
	gap: 10px 18px;
	font-size: 15px;
	line-height: 1.5;
}
.tkw-review dt { font-weight: 700; color: #123F6E; }
.tkw-review dd { margin: 0; }
.tkw-review ul { margin: 0; padding-left: 18px; }

@media (max-width: 640px) {
	.tkw-grid { grid-template-columns: 1fr; }
	.tkw-review { grid-template-columns: 1fr; gap: 2px 0; }
	.tkw-review dd { margin: 0 0 10px; }
	.tkw-title { font-size: 21px; }
	.tkw-fs { padding: 14px 14px; }
	.tkw-btn { width: 100%; }
	.tkw-back { margin: 10px 0 0; text-align: center; width: 100%; }
	.tkw-box { padding: 14px 16px; }
}

/* ═══ "Selge ja rahulik": taganemise kast omaette kaardina (19.09.2026) ═══
   Sama kaardikeel mis tellimuse andmete / arve-tarne kaardid. Klassiahel
   .tkw-box.tkw-box--card (0,2,0) võidab baasreegli .tkw-box. */
.tkw-box.tkw-box--card {
	box-sizing: border-box;
	margin: 0 0 24px;
	padding: clamp(20px, 4vw, 32px);
	background: #fff;
	border: 1px solid #E3E3DF;
	border-radius: 20px;
	box-shadow: 0 1px 2px rgba(30, 34, 40, .04), 0 24px 48px -24px rgba(30, 34, 40, .16);
	font-family: 'IBM Plex Sans', sans-serif;
}
.tkw-box.tkw-box--card .tkw-box__lead {
	margin: 0 0 6px;
	font-family: 'Barlow Condensed', 'Arial Narrow', sans-serif;
	font-size: 1.35rem;
	font-weight: 600;
	line-height: 1.2;
	letter-spacing: .005em;
	color: #23262B;
}
.tkw-box.tkw-box--card .tkw-box__note {
	margin: 0 0 16px;
	font-size: .92rem;
	font-weight: 500;
	line-height: 1.5;
	color: #5B6168;
}
.tkw-box.tkw-box--card .tkw-btn {
	background: #4C6B8A;
	border-color: #4C6B8A;
	border-radius: 10px;
	font-family: 'IBM Plex Sans', sans-serif;
	font-weight: 600;
}
.tkw-box.tkw-box--card .tkw-btn:hover,
.tkw-box.tkw-box--card .tkw-btn:focus {
	background: #3D5670;
	border-color: #3D5670;
}