@charset "utf-8";
/* ==========================================================================
   perkisau.lt: Kontaktų ir /parasyk puslapių taisyklės (antrasis nuo 2026-07-31)
   Maketas: Claude Design projektas a1718d9b, „Perkisau kontaktai v2".

   Kraunamas PO css/reskin-bendra.css. Bendra dalis (pagrindas, kelio nuoroda,
   viršutinis blokas, antraštės, mygtukas, rekvizitai, apvalkalas) yra ten.

   KO MAKETE BUVO, O ČIA NĖRA: žemėlapio (savininko sprendimas 2026-07-29),
   darbo laiko „I–V 9:00–17:00" (savininkas 2026-07-30 pasakė nerodyti) ir
   maketo rekvizitų („UAB Elektroninio verslo grupė", kodas 303379601), nes tai
   ne šios parduotuvės duomenys.

   FORMOS GRĖBLYS. Formą piešia forma() function_site.php faile, ir tą pačią
   funkciją naudoja /parasyk. Todėl jos HTML nekeičiam, o perdažom vien CSS.
   Formos viduje inline stiliai (style='width:200px'), kurių paprastas CSS
   nenugali, tad tose vietose reikia !important. Jis saugus: visos taisyklės
   uždarytos į .apm-forma, o šią klasę turi tik Kontaktų ir /parasyk turinys.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Greitieji kontaktai: telefonas, el. paštas, socialiniai tinklai
   -------------------------------------------------------------------------- */

#content .apm-kontaktai {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	margin: 0 0 38px;
	padding: 0;
	list-style: none;
}
#content .apm-kontaktai li {
	flex: 1 1 220px;
	box-sizing: border-box;
	padding: 24px;
	border: 1px solid rgba(34, 27, 30, 0.08);
	border-radius: 10px;
	background: #fff;
	list-style: none;
}
#content .apm-kontaktai .apm-etikete {
	display: block;
	margin: 0 0 7px;
	font-size: 10px;
	line-height: 1.4;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: #8A3355;
}
#content .apm-kontaktai .apm-reiksme {
	display: block;
	margin: 0 0 5px;
	font-weight: 500;
	font-size: 18px;
	line-height: 1.3;
	color: #221B1E;
	text-decoration: none;
}
#content .apm-kontaktai a.apm-reiksme:hover {
	color: #8A3355;
	text-decoration: none;
}
#content .apm-kontaktai .apm-priedas {
	display: block;
	font-size: 13px;
	line-height: 1.5;
	color: #6E5F64;
}

/* --------------------------------------------------------------------------
   2. Forma ir šalia jos stovintis stulpelis
   -------------------------------------------------------------------------- */

#content .apm-vidus {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 30px;
	margin: 0 0 38px;
}
#content .apm-forma {
	flex: 1 1 420px;
	min-width: 0;
	box-sizing: border-box;
	padding: 30px 32px;
	border: 1px solid rgba(34, 27, 30, 0.08);
	border-radius: 10px;
	background: #fff;
}
#content .apm-salia {
	flex: 1 1 280px;
	min-width: 0;
}

/* --------------------------------------------------------------------------
   3. Forma. HTML ateina iš forma(), keisti jo negalima.
   Lentelė paverčiama eilučių sąrašu: pirmas langelis tampa maža etikete virš
   lauko, antras pačiu lauku. Taip gaunam maketo išdėstymą nepalietus PHP.
   -------------------------------------------------------------------------- */

#content .apm-forma .send_form {
	display: block;
	margin: 0;
}
#content .apm-forma .send_form table {
	display: block;
	width: 100%;
	margin: 0;
	border: 0;
}
#content .apm-forma .send_form tbody {
	display: block;
	width: 100%;
}
#content .apm-forma .send_form tr {
	display: block;
	width: 100%;
	margin: 0 0 14px;
}
#content .apm-forma .send_form td {
	display: block;
	width: 100%;
	padding: 0;
	border: 0;
	text-align: left;
	vertical-align: top;
}
/* Pirmas langelis eilutėje yra lauko pavadinimas. */
#content .apm-forma .send_form td:first-child {
	margin: 0 0 7px;
	font-size: 11px;
	line-height: 1.4;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: #8E7F84;
}
/* Laukai. Inline style='width:200px' nugalimas tik !important, o box-shadow ir
   Century Gothic ateina iš style.min.css taisyklės form.send_form input. */
#content .apm-forma .send_form input[type="text"],
#content .apm-forma .send_form textarea {
	display: block;
	width: 100% !important;
	box-sizing: border-box;
	padding: 14px 16px;
	border: 1px solid rgba(34, 27, 30, 0.18);
	border-radius: 6px;
	background: #FCFBFA;
	box-shadow: none;
	font-family: 'Outfit', 'Source Sans Pro', sans-serif;
	font-weight: 300;
	font-size: 14px;
	line-height: 1.4;
	color: #221B1E;
}
#content .apm-forma .send_form textarea {
	height: 120px !important;
	resize: vertical;
}
#content .apm-forma .send_form input[type="text"]:focus,
#content .apm-forma .send_form textarea:focus {
	border-color: #D26A8E;
	outline: none;
}

/* Apsaugos kodas. Jį duoda rand_string(4), o pirkėjas perrašo į kitą laukelį.
   Makete šio lauko nėra, bet išmesti negalima: tai vienintelė apsauga nuo
   šiukšlių. Perpiešiam kaip kodo langelį, kad matytųsi, jog tai perrašoma. */
#content .apm-forma .send_form b {
	display: inline-block;
	margin: 0 0 4px;
	padding: 9px 16px;
	border: 1px dashed rgba(34, 27, 30, 0.25);
	border-radius: 6px;
	background: #F8EEF0;
	font-family: ui-monospace, "Courier New", monospace;
	font-weight: 500;
	font-size: 16px;
	letter-spacing: 0.22em;
	color: #8A3355;
}

/* Mygtuko eilutė. Inline style='width:370px; text-align:right' ant div'o ir
   style='width:80px' ant paties mygtuko, tad abu su !important. */
#content .apm-forma .send_form > div {
	width: 100% !important;
	text-align: left !important;
}
#content .apm-forma .send_form input[type="submit"] {
	width: auto !important;
	padding: 15px 34px;
	border: 0;
	border-radius: 40px;
	background: #D26A8E;
	box-shadow: 0 14px 30px -14px rgba(210, 106, 142, 0.95);
	font-family: 'Outfit', 'Source Sans Pro', sans-serif;
	font-weight: 600;
	font-size: 13px;
	letter-spacing: 0.11em;
	text-transform: uppercase;
	color: #FCFBFA;
	cursor: pointer;
}
#content .apm-forma .send_form input[type="submit"]:hover {
	background: #8A3355;
}

/* Pranešimas po siuntimo. siusti_klausima() jį išveda <font> žyme su inline
   spalva, tad skiriam pagal ją: žalias yra sėkmė, raudonas klaida. */
#content .apm-forma font {
	display: inline-block;
	margin: 14px 0 0;
	padding: 11px 18px;
	border-radius: 8px;
	font-family: 'Outfit', 'Source Sans Pro', sans-serif;
	font-size: 14px !important;
	line-height: 1.4;
}
#content .apm-forma font[style*="1E7A4D"] {
	background: #E8F4EE;
	color: #1E7A4D !important;
}
#content .apm-forma font[style*="red"] {
	background: #FBEAE8;
	color: #B3261E !important;
}

/* --------------------------------------------------------------------------
   4. Stulpelis šalia formos: rekvizitai ir nuorodos (makete čia buvo žemėlapis)
   -------------------------------------------------------------------------- */

#content .apm-salia .apm-blokas {
	box-sizing: border-box;
	margin: 0 0 20px;
	padding: 26px 28px;
	border-radius: 10px;
	background: #F8EEF0;
}
#content .apm-salia .apm-blokas:last-child {
	margin-bottom: 0;
}
#content .apm-salia .apm-blokas h3 {
	margin: 0 0 18px;
	font-family: 'Bodoni Moda', Georgia, serif;
	font-weight: 500;
	font-size: 20px;
	line-height: 1.2;
	color: #221B1E;
}
/* Siaurame stulpelyje rekvizitai eina vienas po kito, ne dviem stulpeliais. */
#content .apm-salia .apm-rekvizitai {
	display: block;
	font-size: 14px;
}
#content .apm-salia .apm-rekvizitai dd {
	margin-bottom: 14px;
}
/* Kiekvienas dt/dd yra savame <div>, tad dd:last-child pataikytų į KIEKVIENĄ
   dd ir sunaikintų tarpus tarp grupių. Reikia paskutinio div'o. */
#content .apm-salia .apm-rekvizitai div:last-child dd {
	margin-bottom: 0;
}
#content .apm-salia .apm-pastaba {
	margin-top: 14px;
}

/* Teminės nuorodos vietoj paslėptos atsitiktinių prekių juostos. */
#content .apm-salia .apm-blokas-baltas {
	border: 1px solid rgba(34, 27, 30, 0.08);
	background: #fff;
}
#content .apm-nuorodos {
	margin: 0;
	padding: 0;
	list-style: none;
}
#content .apm-nuorodos li {
	margin: 0;
	padding: 10px 0;
	border-top: 1px solid rgba(34, 27, 30, 0.08);
	list-style: none;
	font-size: 14px;
	line-height: 1.4;
}
#content .apm-nuorodos li:first-child {
	padding-top: 0;
	border-top: 0;
}
#content .apm-nuorodos li:last-child {
	padding-bottom: 0;
}

/* --------------------------------------------------------------------------
   5. Dažniausi klausimai
   -------------------------------------------------------------------------- */

#content .apm-duk {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	margin: 0 0 10px;
	padding: 0;
	list-style: none;
}
#content .apm-duk li {
	flex: 1 1 300px;
	box-sizing: border-box;
	padding: 22px 24px;
	border: 1px solid rgba(34, 27, 30, 0.08);
	border-radius: 10px;
	background: #fff;
	list-style: none;
}
#content .apm-duk h3 {
	margin: 0 0 8px;
	font-size: 15px;
}
#content .apm-duk p {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.65;
}

/* --------------------------------------------------------------------------
   6. Telefonas. Maketas „Kontaktai · Mobili · 390px".
      Riba 500px sutampa su info.php inline @media bloku ir su JS riba.
   -------------------------------------------------------------------------- */

@media all and (max-width: 500px) {

	/* Makete telefone kontaktų kortelė yra viena eilutė: apskritimas kairėje,
	   etiketė ir reikšmė dešinėje. */
	#content .apm-kontaktai {
		gap: 12px;
		margin-bottom: 22px;
	}
	#content .apm-kontaktai li {
		display: flex;
		align-items: center;
		flex: 1 1 100%;
		gap: 14px;
		padding: 16px 18px;
	}
	#content .apm-kontaktai .apm-taskas {
		flex: none;
		margin: 0;
	}
	#content .apm-kontaktai .apm-etikete {
		margin-bottom: 2px;
	}
	#content .apm-kontaktai .apm-reiksme {
		margin-bottom: 0;
		font-size: 16px;
	}
	/* Trečia eilutė kortelėje telefone netelpa be reikalo. */
	#content .apm-kontaktai .apm-priedas {
		display: none;
	}

	#content .apm-vidus {
		display: block;
		margin-bottom: 22px;
	}
	#content .apm-forma {
		margin: 0 0 20px;
		padding: 20px 18px;
	}
	#content .apm-forma .send_form b {
		font-size: 15px;
	}
	#content .apm-forma .send_form input[type="submit"] {
		width: 100% !important;
		padding: 16px 20px;
	}

	#content .apm-salia .apm-blokas {
		padding: 20px 18px;
	}
	#content .apm-salia .apm-blokas h3 {
		margin-bottom: 14px;
		font-size: 19px;
	}
	#content .apm-salia .apm-rekvizitai {
		font-size: 13px;
	}

	#content .apm-duk {
		gap: 12px;
	}
	#content .apm-duk li {
		flex: 1 1 100%;
		padding: 18px 20px;
	}
	#content .apm-duk h3 {
		font-size: 14.5px;
	}
	#content .apm-duk p {
		font-size: 13px;
	}
}