/* ==========================================================================
   Prekės puslapis: /p/, /n/, /g/ ir /a/

   Sukurta 2026-08-03 dėl nuotraukos, išplėsta 2026-08-04 iki viso puslapio
   pagal maketą „Perkisau prekes puslapis.dc.html".

   TAI PINIGŲ KELIAS. Puslapyje stovi vienintelis parduotuvės dėjimo į krepšelį
   mygtukas, o add_cart() remiasi dešimčia DOM kabliukų: #size, #count,
   #is_count, .product-image-field, #product-image, #product-image img, p#error,
   .iframe, .notifi ir #basket-text. Nė vieno iš tų vardų šiame faile keisti
   nevalia, o slėpti (`display:none`) jų negalima net laikinai: funkcija daro
   `.offset().left` PRIEŠ užklausą į serverį.

   Prefiksas `#page`, ne `#content` ir ne `.apm`: prekės puslapyje `.apm` klasės
   nėra, o `style.min.css` `#product-image` taisyklę duoda ID specifiškumu.

   SVARBIAUSIA TAISYKLĖ. Kiekviena perrašoma savybė paskelbiama AIŠKIAI.
   Didesnio specifiškumo neužtenka: `style.min.css` duoda
   `.product{height:330px;width:190px;overflow:hidden;float:left}`, o iki
   2026-08-04 tas taisykles atmušdavo inline stiliai PHP kode. Juos pakeitus
   klasėmis, kiekvieną iš tų savybių privalo perrašyti šis failas.
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Apvalkalas

   Dešinė 196px juosta su atsitiktinėmis prekėmis slepiama, o turinio stulpelis
   platėja iki 958px, kaip visuose kituose perpieštuose puslapiuose. Sąlyga
   remiasi `.product-main` buvimu, tad į prekės puslapio HTTP 404 šaką (ta pati
   body žymė, kitoks turinys) šios taisyklės nepataiko.
   -------------------------------------------------------------------------- */

body.reskin:has(.product-main) #right { display: none; }
body.reskin:has(.product-main) #middle-right { width: 958px; }

/* Puslapio antraštė kode yra <h1> ir tokia lieka. Kituose perpieštuose
   puslapiuose ji piešiama kaip maža rausva piliulė, bet prekės puslapyje ji yra
   prekės pavadinimas, tad gauna maketo pavidalą. */
body.reskin:has(.product-main) #top { height: auto; margin-bottom: 10px; }
body.reskin:has(.product-main) #name { width: auto; height: auto; }
body.reskin:has(.product-main) #name h1 {
	margin: 0 0 4px; padding: 0;
	font-family: 'Bodoni Moda', Georgia, serif;
	font-weight: 500; font-size: 30px; line-height: 1.18;
	letter-spacing: 0.01em; color: #221B1E; text-transform: none;
}

/* --------------------------------------------------------------------------
   2. Dviejų stulpelių išdėstymas

   Iki 2026-08-04 pločiai buvo inline: 695px blokui, 400px teksto stulpeliui.
   Dabar blokas užima visą 958px stulpelį, o viduje yra tinklelis: nuotraukai
   360px, tekstui likusi vieta (958 - 360 - 44 = 554px).
   -------------------------------------------------------------------------- */

#page .product-field.product-main {
	width: 100%; margin: 0; padding: 0;
	float: left; clear: both; position: relative;
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-weight: 300; font-size: 15px; line-height: 1.7; color: #4A3F44;
}
#page .product-main .product {
	display: grid; grid-template-columns: 360px 1fr; gap: 44px;
	width: 100%; height: auto; min-height: 0; overflow: visible; float: none;
}
#page .product-main .product a { color: #221B1E !important; text-decoration: none; }
#page .product-main .product a:hover { color: #8A3355 !important; }

#page .product-main .product-image-field {
	width: auto; height: auto; overflow: visible; float: none;
}
#page .product-main .product-text {
	width: auto; height: auto; min-height: 0; overflow: visible; float: none;
	color: #4A3F44;
}

/* --------------------------------------------------------------------------
   3. Nuotraukos stulpelis

   Svarbiausia taisyklė failo istorijoje: `height: auto` ant paties <img>. Be
   jos naršyklė paimtų HTML atributą `height='1013'`, nes nuo 2026-08-03 HTML'e
   rašomi TIKRI failo matmenys, kad puslapis nešokinėtų kraunantis.
   -------------------------------------------------------------------------- */

#page .product-main #product-image {
	width: 100%; height: auto; margin: 0 0 14px !important; padding: 0;
	overflow: hidden;
	border: 1px solid rgba(34, 27, 30, 0.08); border-radius: 8px;
	background: #FCFBFA; text-align: center; float: none; position: relative;
}
#page .product-main #product-image img {
	display: block; width: 100%; max-width: 100%; height: auto;
	margin: 0; border: 0;
}

/* Papildomos nuotraukos. Jos lieka miniatiūros: 84x85 langui to pakanka, o
   originalų ten prireiktų po 70 KB kiekvienai. */
#page .product-main .product-image-small {
	width: 84px; height: 85px; margin: 0 10px 10px 0 !important; padding: 4px;
	box-sizing: border-box; overflow: hidden;
	border: 1px solid rgba(34, 27, 30, 0.12); border-radius: 5px;
	background: #FCFBFA;
}
#page .product-main .product-image-small:hover { border-color: #D26A8E; }

/* --------------------------------------------------------------------------
   4. Teksto stulpelis
   -------------------------------------------------------------------------- */

#page .product-main .preke-gamintojas {
	font-style: normal !important; font-size: 13px; color: #6E5F64;
}
#page .product-main .preke-gamintojas b { font-weight: 500; color: #221B1E; }
#page .product-main #schema-brand img { margin: 8px 0 0; border: 0; }

#page .product-main .preke-meta {
	display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 6px 0 14px;
	font-size: 13px; color: #6E5F64;
}
#page .product-main .preke-meta #sku { font-style: normal; color: #221B1E; }

#page .product-main #schema-product-rating {
	display: flex; align-items: center; flex-wrap: wrap; gap: 8px;
	margin: 0 0 16px; font-size: 13px; color: #6E5F64;
}
#page .product-main #schema-product-rating span { float: none !important; }

#page .product-main #desc-product {
	display: block; margin: 0 0 22px;
	font-style: normal; font-size: 14.5px; line-height: 1.7; color: #4A3F44;
}
#page .product-main #desc-product p { margin: 0 0 10px; }

/* --------------------------------------------------------------------------
   5. Kaina, prieinamumas ir pirkimas
   -------------------------------------------------------------------------- */

#page .product-main .preke-pirkimas {
	width: 100%; float: none; box-sizing: border-box;
	margin: 0 0 4px; padding: 20px 0 0;
	border-top: 1px solid rgba(34, 27, 30, 0.1);
}
#page .product-main .preke-kainos {
	display: flex; align-items: baseline; flex-wrap: wrap; gap: 14px;
	margin: 0 0 18px;
}
/* Šriftas pakeistas 2026-08-01 dėl to paties, kas ir kortelėje: Bodoni ketvertas
   skaitosi kaip vienetas. Žr. css/reskin-kortele.css. */
#page .product-main .preke-kaina {
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-variant-numeric: lining-nums tabular-nums;
	font-weight: 600; font-size: 32px; line-height: 1.1; color: #221B1E;
	white-space: nowrap;
}
#page .product-main .preke-kaina-akcija { color: #8A3355; }
#page .product-main .preke-kaina-sena {
	font-size: 16px; color: #A99DA1; text-decoration: line-through;
	white-space: nowrap;
}
#page .product-main .preke-vienetas { font-size: 14px; color: #6E5F64; }

#page .product-main .preke-busena {
	margin-left: auto; padding: 6px 14px; border-radius: 40px;
	background: #F8EEF0;
	font-size: 12px; font-weight: 500; letter-spacing: 0.04em; color: #8A3355;
	white-space: nowrap;
}
#page .product-main .preke-busena-laukiam { background: #F3EFE7; color: #8A6A2F; }
#page .product-main .preke-busena-nera { background: #EFEAEB; color: #7A6E72; }
#page .product-main .preke-busena .sold-text { color: inherit; }

/* Dydis ir kiekis. Iki 2026-08-04 abu laukai buvo 19px aukščio, o pirštui
   reikia apie 44px. Tai vienintelė vieta parduotuvėje, kur į tokį taikinį
   privaloma pataikyti, kad galėtum nusipirkti. */
#page .product-main .preke-forma {
	display: flex; flex-wrap: wrap; gap: 14px;
	width: 100%; margin: 0 0 6px; float: none; line-height: 1.4;
}
#page .product-main .preke-laukas { display: block; }
#page .product-main .preke-laukas label {
	display: block; margin-bottom: 5px;
	font-size: 11px; font-weight: 500; letter-spacing: 0.08em;
	color: #6E5F64; text-transform: uppercase;
}
#page .product-main .preke-forma select {
	box-sizing: border-box; min-width: 148px; height: 46px;
	padding: 0 38px 0 16px;
	appearance: none; -webkit-appearance: none; -moz-appearance: none;
	border: 1px solid rgba(34, 27, 30, 0.22); border-radius: 40px;
	background-color: #FCFBFA;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%238A3355'/%3E%3C/svg%3E");
	background-repeat: no-repeat; background-position: right 16px center;
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-weight: 500; font-size: 14px; line-height: 1.2; color: #221B1E;
	cursor: pointer;
}
#page .product-main .preke-forma select:hover { border-color: #D26A8E; }
#page .product-main .preke-forma select:focus { border-color: #8A3355; outline: none; }

/* Pirkimo mygtukas. `style.min.css` jį dalijasi su paieškos kortelės mygtuku
   (`a.cart-btn-desktop, a.add-cart-btn`), tad kiekviena savybė čia skelbiama
   aiškiai: nedeklaravus `background`, žalias gradientas liktų galioti. Teksto
   spalva sename faile yra `#fff !important`, tad jos nekeičiam: balta ant
   rausvo ir taip yra tai, ko reikia. */
#page .product-main a.add-cart-btn {
	display: flex; align-items: center; justify-content: center;
	box-sizing: border-box; float: none; clear: both;
	width: 100%; max-width: 320px; height: 54px;
	margin: 20px 0 0; padding: 0 30px;
	border: 0; border-radius: 40px;
	background: #D26A8E;
	box-shadow: 0 16px 32px -14px rgba(210, 106, 142, 0.9);
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-weight: 600; font-size: 13px; line-height: 1;
	letter-spacing: 0.12em; text-transform: uppercase;
	text-decoration: none; cursor: pointer;
}
#page .product-main a.add-cart-btn:hover { background: #8A3355; text-decoration: none; }

#page .product-main p#error { margin: 10px 0 0; font-size: 13px; color: #C0392B; }

/* --------------------------------------------------------------------------
   6. Pasitikėjimo eilutės

   Iki 2026-08-04 tai buvo 200px stulpelis, plaukiantis dešinėje nuo kainos.
   Naujame išdėstyme jis nusileidžia po mygtuku ir išsitiesia į eilę.
   -------------------------------------------------------------------------- */

#page .product-main .preke-pasitikejimas {
	display: flex; flex-wrap: wrap; gap: 10px 26px;
	width: 100%; float: none; margin: 26px 0 0;
	padding-top: 20px; border-top: 1px solid rgba(34, 27, 30, 0.1);
}
#page .product-main .preke-pasitikejimas p {
	display: flex; align-items: center; gap: 9px;
	margin: 0; float: none; font-size: 13px; color: #6E5F64;
}
#page .product-main .preke-pasitikejimas img {
	width: 24px; height: 24px; margin: 0; float: none; border: 0;
}
#page .product-main .preke-pasitikejimas .fa {
	float: none; margin: 0; font-size: 17px; color: #D26A8E;
}
#page .product-main .preke-pasitikejimas span { float: none; margin: 0; }
#page .product-main .preke-fb { margin: 18px 0 0; }

/* --------------------------------------------------------------------------
   7. Ankstesnė ir sekanti prekė
   -------------------------------------------------------------------------- */

#page .product-main .preke-navigacija {
	display: flex; align-items: center; justify-content: space-between;
	width: 100%; margin: 34px 0 0; padding: 14px 4px;
	border-top: 1px solid rgba(34, 27, 30, 0.1);
	border-bottom: 1px solid rgba(34, 27, 30, 0.1);
	font-size: 13px; color: #9A8B90; text-align: left;
}
#page .product-main .preke-navigacija img { vertical-align: middle; border: 0; }

/* --------------------------------------------------------------------------
   8. Atsiliepimai

   Nuo 2026-08-04 jie yra viso pločio, o ne 375px stulpelyje. Formos laukų
   vardai, #comment jungiklis ir reCAPTCHA nepaliesti: čia tik išvaizda.
   -------------------------------------------------------------------------- */

#page .product-main .preke-atsiliepimai { width: 100%; margin: 44px 0 0; }
#page .product-main .preke-antraste {
	display: flex; align-items: center; gap: 13px;
	margin: 0 0 22px; padding: 13px 18px;
	border-radius: 4px; background: #F8EEF0;
	font-family: 'Bodoni Moda', Georgia, serif;
	font-weight: 500; font-size: 24px; letter-spacing: 0.01em;
	color: #221B1E; text-transform: none;
}
#page .product-main .preke-antrastes-skaicius {
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-weight: 400; font-size: 15px; color: #8E7F84;
}
#page .product-main .preke-atsiliepimu-tinklelis {
	display: grid; grid-template-columns: 1.1fr 1fr; gap: 36px;
	align-items: start;
}
#page .product-main .preke-atsiliepimu-sarasas > div { width: 100%; float: none; }
/* `style.min.css` duoda `#comment{height:23px}` ir `#comment span{background:
   linear-gradient(žalias); color:#fff; padding:3px 7px}`, tad be aiškiai
   paskelbto fono jungiklis liktų žaliu mygtuku. Būtent tokį likutį šis blokas
   ir šalina iš parduotuvės. */
#page .product-main #comment { height: auto; margin-bottom: 4px; }
#page .product-main .preke-atsiliepimu-jungiklis {
	display: inline-block; margin-bottom: 10px; padding: 0;
	border-radius: 0; background: none;
	font-weight: 500; font-size: 14px; color: #8A3355; cursor: pointer;
}
#page .product-main .preke-atsiliepimu-jungiklis:hover {
	background: none; color: #D26A8E; text-decoration: underline;
}
#page .product-main .comment {
	box-sizing: border-box; width: 100%; float: none;
	margin: 0 0 12px; padding: 16px 18px;
	border: 1px solid rgba(34, 27, 30, 0.08); border-radius: 6px;
	background: #fff; font-size: 14px; line-height: 1.6; color: #4A3F44;
}
#page .product-main .comment .name { width: auto; float: left; font-weight: 500; color: #221B1E; }
#page .product-main .comment .date { width: auto; float: right; font-size: 12px; color: #9A8B90; }
#page .product-main .comment .comment-text { width: 100%; float: left; margin-top: 6px; }

#page .product-main .preke-atsiliepimo-forma {
	box-sizing: border-box; width: 100%; float: none;
	padding: 20px 22px;
	border: 1px solid rgba(34, 27, 30, 0.08); border-radius: 6px;
	background: #FCFBFA; font-size: 13.5px; color: #6E5F64;
}
#page .product-main .preke-atsiliepimo-antraste {
	margin-bottom: 14px; font-weight: 500; font-size: 14px; color: #221B1E;
}
#page .product-main .preke-atsiliepimo-forma input[type="text"] {
	box-sizing: border-box; width: 100%; height: 42px; margin: 4px 0 10px;
	padding: 0 14px;
	border: 1px solid rgba(34, 27, 30, 0.2); border-radius: 3px;
	background: #fff; font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-size: 13.5px; color: #221B1E;
}
#page .product-main .preke-atsiliepimo-forma textarea {
	box-sizing: border-box; width: 100%; height: 90px; float: none;
	margin: 4px 0 12px; padding: 12px 14px;
	border: 1px solid rgba(34, 27, 30, 0.2); border-radius: 3px;
	background: #fff; font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-size: 13.5px; color: #221B1E; resize: vertical;
}
#page .product-main .preke-atsiliepimo-forma input[type="submit"] {
	float: none; height: 44px; padding: 0 26px;
	border: 0; border-radius: 40px; background: #221B1E;
	font-family: 'Outfit', 'Source Sans Pro', Arial, sans-serif;
	font-weight: 600; font-size: 12px; letter-spacing: 0.12em;
	color: #FCFBFA; text-transform: uppercase; cursor: pointer;
}
#page .product-main .preke-atsiliepimo-forma input[type="submit"]:hover { background: #8A3355; }
#page .product-main .recaptcha-field { margin: 10px 0; }

/* „Panašios prekės" antraštė. Ją išveda info.php su inline paraštėmis, tad čia
   keičiam tik pavidalą: `style.min.css` duoda `#content h2{font-size:20px;
   text-transform:uppercase}`, ir `text-transform` privalo būti paskelbtas. */
body.reskin:has(.product-main) #content h2 {
	padding: 13px 18px; border-radius: 4px; background: #F8EEF0;
	box-sizing: border-box;
	font-family: 'Bodoni Moda', Georgia, serif;
	font-weight: 500; font-size: 24px; letter-spacing: 0.01em;
	color: #221B1E; text-transform: none;
}

/* --------------------------------------------------------------------------
   9. Telefonas. Riba 500px, ta pati kaip `info.php` ir `home.php` inline
   @media blokuose bei `reskin-kortele.css` faile.
   -------------------------------------------------------------------------- */

@media all and (max-width: 500px) {
	body.reskin:has(.product-main) #name h1 { font-size: 23px; }

	#page .product-main .product { grid-template-columns: 1fr; gap: 22px; }
	#page .product-main .product-image-field { width: 100%; float: none; }
	#page .product-main #product-image {
		width: 100%; max-width: 340px; margin: 0 auto 14px !important; float: none;
	}
	#page .product-main .preke-kaina { font-size: 28px; }
	#page .product-main .preke-busena { margin-left: 0; }
	#page .product-main .preke-forma select { min-width: 0; width: 100%; }
	#page .product-main .preke-laukas { flex: 1 1 46%; }
	#page .product-main a.add-cart-btn { max-width: none; height: 52px; width: 100%; }
	#page .product-main .preke-atsiliepimu-tinklelis { grid-template-columns: 1fr; gap: 22px; }
	#page .product-main .preke-antraste { font-size: 20px; padding: 11px 14px; }
	#page .product-main .preke-navigacija { font-size: 12px; }
}
