/* T-012 / RM-05 product page; scoped to .sh-pp* so the legacy theme is unchanged. */
/* Başlık alanının son geometrisi burada sabitlenir: sayfa erken görünümde (EarlyRender) açılır, tema CSS'i
   asenkron gelir; değerler temaya bırakılırsa tema geç geldiğinde başlık/içerik kayar (CLS). Seçiciler ve
   !important, temanın #page-title kurallarını (bazıları !important) bilinçli olarak geçer. */
#page-title.sh-pp-title { padding: 36px 0 32px; background: #f5f5f5; border-bottom: 1px solid #eee; text-align: left; }
#page-title.sh-pp-title > .container { position: relative; }
@media (min-width: 1200px) { #page-title.sh-pp-title > .container { max-width: 1170px; } }
#page-title.sh-pp-title .breadcrumb {
    position: static !important; top: auto !important; right: auto !important; left: auto !important;
    width: auto !important; margin: 0 0 14px !important; padding: 0 !important; background: transparent !important;
    display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 4px 0; list-style: none; border-radius: 0;
    font-size: 12px; line-height: 1.5; transform: none;
}
#page-title.sh-pp-title .breadcrumb-item { color: #6b7178; overflow-wrap: anywhere; }
#page-title.sh-pp-title .breadcrumb-item + .breadcrumb-item { padding-left: 8px; }
#page-title.sh-pp-title .breadcrumb-item + .breadcrumb-item::before { display: inline-block; padding-right: 8px; color: #6c757d; content: "/"; }
#page-title.sh-pp-title .breadcrumb-item a { color: #4c5258; }
#page-title.sh-pp-title .breadcrumb-item a:hover { color: #b52129; }
#page-title.sh-pp-title .breadcrumb-item.active { color: #25282d; }
#page-title.sh-pp-title h1 {
    margin: 0; padding: 0; color: #333; font-size: 28px; line-height: 1.25; letter-spacing: 1px;
    font-weight: 600; overflow-wrap: break-word; text-transform: uppercase;
}
#page-title.sh-pp-title .sh-pp-sub {
    display: flex; flex-wrap: wrap; gap: 4px 18px; margin: 10px 0 0; color: #6b7178;
    font-size: 15px; line-height: 1.5; overflow-wrap: anywhere;
}
/* Temanın #page-title span (blok, 18px, ince) kuralı bu satıra uygulanmasın. */
#page-title.sh-pp-title .sh-pp-sub span { display: inline; margin: 0; font-size: inherit; font-weight: 400; color: inherit; }
#page-title.sh-pp-title .sh-pp-sub strong { color: #b52129; font-weight: 700; font-variant-numeric: tabular-nums; }
#page-title.sh-pp-title .sh-pp-sub .sh-pp-more { color: #6b7178; font-style: normal; font-weight: 600; }
/* Başlık content-wrap dışına alındı; temanın 80px üst boşluğu yalnız ürün sayfasında daraltılır (:has yoksa tema değeri kalır). */
#content .content-wrap:has(> .sh-pp) { padding-top: 40px; }
/* T-026: Ürünler (arama) sayfası aynı bandı kullanır. Arama alanı ürün sayfası gibi beyaz zeminde; bant ile arama arasında tema
   boşluğu yok (arama bileşeninin kendi 36/24 px üst dolgusu kalır). Yeni Ürünler kendi gri zeminiyle değişmez. */
#content .content-wrap:has(> .sh-search-page) { padding-top: 0; }
#content .sh-search-page { padding-top: 0; background: #fff; }
.sh-pp { padding-top: 0; padding-bottom: 50px; max-width: 1170px; }
.sh-pp *, .sh-pp *::before, .sh-pp *::after { box-sizing: border-box; }
.sh-pp-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: start; }
.sh-pp-media {
    position: relative; display: flex; align-items: center; justify-content: center;
    aspect-ratio: 4 / 3; background: #fff; border: 1px solid #e0e3e6; border-radius: 8px; overflow: hidden;
}
.sh-pp-media img { display: block; width: 100%; height: 100%; object-fit: contain; padding: 18px; }
.sh-pp-media.is-missing { background: #f5f6f7; }
.sh-pp-placeholder { display: flex; flex-direction: column; align-items: center; gap: 10px; color: #8c9298; font-size: 12px; }
.sh-pp-codes { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 0; margin: 0 0 24px; border: 1px solid #e0e3e6; border-radius: 8px; overflow: hidden; }
.sh-pp-codes > div { min-width: 0; padding: 16px 18px; border-right: 1px solid #eef0f2; background: #fff; }
.sh-pp-codes > div:last-child { border-right: 0; }
.sh-pp-codes dt { margin: 0 0 4px; color: #6b7178; font-size: 11px; font-weight: 400; }
.sh-pp-codes dd { margin: 0; color: #25282d; font-size: 16px; line-height: 1.5; font-weight: 700; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.sh-pp-code { display: flex; align-items: center; gap: 6px; min-width: 0; }
.sh-pp-code + .sh-pp-code { margin-top: 2px; }
.sh-pp-code > span { min-width: 0; overflow-wrap: anywhere; }
.sh-pp-copy {
    flex: none; display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
    margin: 0; padding: 0; border: 1px solid transparent; border-radius: 6px; background: transparent;
    color: #8c9298; cursor: pointer; line-height: 0; transition: color .15s, background-color .15s, border-color .15s;
}
.sh-pp-copy:hover { color: #b52129; background: #fbf1f1; }
.sh-pp-copy:focus-visible { outline: 2px solid #b52129; outline-offset: 1px; }
.sh-pp-copy .i-done, .sh-pp-copy.is-copied .i-copy { display: none; }
.sh-pp-copy.is-copied .i-done { display: block; }
.sh-pp-copy.is-copied { color: #1f7a3d; background: #eef7f1; border-color: #cfe8d7; }
/* Ortak footer: ürün sayfası kısa olduğundan masaüstünde footer'ın üstü ilk ekrana girer. Tema paketi (footer stilleri
   site-performance.css içinde) geç gelirse sütunlar sonradan yerleşir (T-012'de ölçülen CLS 0,12). Bu dosya yalnız ürün ve
   teklif sayfasında senkron yüklenir; T-023 footer'ının ilk satır geometrisi baştan verilir, görünüm değişmez. Mobilde footer
   ilk ekranın dışındadır. site-performance.css'teki sh-footer ölçüleri değişirse burayı da güncelle. */
@media (min-width: 768px) {
    #footer.sh-footer { position: relative; border-top: 0; background: #1a1d21; color: #aab1b8; font: 14px/1.65 'Lato', Arial, sans-serif; }
    #footer.sh-footer p, #footer.sh-footer ul, #footer.sh-footer address { margin: 0; padding: 0; }
    #footer.sh-footer ul { list-style: none; }
    #footer.sh-footer svg { width: 16px; height: 16px; flex: 0 0 16px; }
    #footer.sh-footer .sh-footer-title { margin: 0 0 22px; padding: 0 0 12px; font: 700 13px/1.3 'Raleway', Arial, sans-serif; letter-spacing: .16em; }
    .sh-footer-main { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 40px 32px; padding: 56px 0 40px; }
    .sh-footer-logo-link { display: inline-block; margin: 0 0 20px; }
    .sh-footer-logo { display: block; width: 180px; height: auto; aspect-ratio: 600 / 203; }
    .sh-footer-nav li + li { margin-top: 9px; }
    .sh-footer-info li { display: flex; gap: 12px; }
    .sh-footer-info li + li { margin-top: 10px; }
}
@media (min-width: 992px) {
    .sh-footer-main { grid-template-columns: minmax(0, 1.1fr) minmax(0, .8fr) minmax(0, .8fr) minmax(0, 1.6fr); gap: 48px; padding: 72px 0 52px; }
    .sh-footer-map { margin-top: 22px; height: 168px; }
}
@media (min-width: 1200px) { #footer > .container { max-width: 1170px; } }
/* #content p (1.8) ile aynı; tema geç gelince satır yüksekliği değişmesin. */
#content .sh-pp-text { margin: 0; color: #4c5258; font-size: 15px; line-height: 1.8; }
/* T-017 / RM-08: aynı dildeki firma bilgi sayfalarına bağlantılar (açıklamanın altında). Dosya senkron yüklendiği için tema geç gelince değişmez. */
.sh-pp-related { margin: 28px 0 0; padding: 20px 0 0; border-top: 1px solid #eef0f2; }
#content .sh-pp-related h2 { margin: 0 0 12px; color: #25282d; font-size: 15px; line-height: 1.5; font-weight: 700; letter-spacing: 0; text-transform: none; }
.sh-pp-related ul { display: flex; flex-wrap: wrap; gap: 8px 10px; margin: 0; padding: 0; list-style: none; }
.sh-pp-related li { margin: 0; }
.sh-pp-related a {
    display: inline-flex; align-items: center; min-height: 36px; padding: 6px 14px; border: 1px solid #e0e3e6; border-radius: 6px;
    background: #fff; color: #4c5258; font-size: 14px; line-height: 1.4; transition: color .15s, border-color .15s;
}
.sh-pp-related a:hover { color: #b52129; border-color: #b52129; }
/* Tema :focus { outline: none !important } uyguladığı için klavye odağı box-shadow ile görünür. */
.sh-pp-related a:focus-visible, #page-title.sh-pp-title .breadcrumb-item a:focus-visible { border-radius: 3px; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #b52129; }
@media (max-width: 767.98px) {
    #page-title.sh-pp-title { padding: 20px 0 24px; text-align: center; }
    #page-title.sh-pp-title .breadcrumb { justify-content: center; margin: 0 0 10px !important; }
    #page-title.sh-pp-title h1 { font-size: 24px; line-height: 1.5; }
    #page-title.sh-pp-title .sh-pp-sub { justify-content: center; font-size: 13px; gap: 2px 14px; }
    #content .content-wrap:has(> .sh-pp) { padding-top: 22px; }
    .sh-pp { padding-bottom: 36px; }
    .sh-pp-layout { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .sh-pp-codes { grid-template-columns: minmax(0, 1fr); }
    .sh-pp-codes > div { display: flex; justify-content: space-between; gap: 16px; align-items: baseline; padding: 12px 16px; border-right: 0; border-bottom: 1px solid #eef0f2; }
    .sh-pp-codes > div:last-child { border-bottom: 0; }
    .sh-pp-codes dd { font-size: 15px; text-align: right; }
    .sh-pp-code { justify-content: flex-end; }
}
/* T-020 / RM-05A: ürün sayfasındaki "Teklif al" bağlantısı ve cachelenmeyen teklif formu (Teklif/Index). Dosya senkron yüklenir. */
.sh-pp-actions { margin: 0 0 24px; }
.sh-pp-quote, .sh-quote-submit {
    display: inline-flex; align-items: center; justify-content: center; min-height: 44px; margin: 0; padding: 10px 22px;
    border: 1px solid #b52129; border-radius: 6px; background: #b52129; color: #fff; font-size: 15px; font-weight: 700;
    line-height: 1.3; letter-spacing: 0; text-transform: none; cursor: pointer; transition: background-color .15s, border-color .15s;
}
.sh-pp-quote:hover, .sh-pp-quote:focus, .sh-quote-submit:hover { background: #8f1a20; border-color: #8f1a20; color: #fff; }
.sh-quote-submit[disabled] { opacity: .7; cursor: default; }
/* Tema :focus { outline: none !important } uyguladığı için klavye odağı box-shadow ile görünür. */
.sh-pp-quote:focus-visible, .sh-quote-submit:focus-visible, .sh-quote-back a:focus-visible,
.sh-quote-field input:focus, .sh-quote-field select:focus { box-shadow: 0 0 0 2px #fff, 0 0 0 4px #b52129; }
/* Tema #content p ile aynı satır yüksekliği; tema yüklenince form aşağı kaymasın. */
#content .sh-quote-back { margin: 0 0 18px; font-size: 14px; line-height: 1.8; }
.sh-quote-back a { color: #4c5258; border-radius: 3px; }
.sh-quote-back a:hover { color: #b52129; }
.sh-quote-layout { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: 40px; align-items: start; }
.sh-quote .sh-quote-product { grid-template-columns: minmax(0, 1fr); margin: 0; }
.sh-quote .sh-quote-product > div { border-right: 0; border-bottom: 1px solid #eef0f2; }
.sh-quote .sh-quote-product > div:last-child { border-bottom: 0; }
.sh-quote-alert { margin: 0 0 20px; padding: 14px 16px; border: 1px solid; border-radius: 6px; font-size: 15px; line-height: 1.5; }
.sh-quote-alert.is-success { color: #1f5f33; background: #eef7f1; border-color: #cfe8d7; }
.sh-quote-alert.is-error { color: #8a1c22; background: #fbf1f1; border-color: #f0cfd1; }
.sh-quote-alert:focus { outline: none; box-shadow: 0 0 0 2px #fff, 0 0 0 4px #4c5258; }
#content .sh-quote-note { margin: 0 0 16px; color: #6b7178; font-size: 13px; line-height: 1.5; }
.sh-quote-field { margin: 0 0 18px; }
.sh-quote-field label { display: block; margin: 0 0 6px; color: #25282d; font-size: 14px; font-weight: 700; letter-spacing: 0; text-transform: none; }
.sh-quote-field input, .sh-quote-field select {
    display: block; width: 100%; min-height: 44px; margin: 0; padding: 8px 12px; border: 1px solid #c9ced3; border-radius: 6px;
    background: #fff; color: #25282d; font-size: 16px; line-height: 1.4; box-sizing: border-box;
}
.sh-quote-field.has-error input, .sh-quote-field.has-error select { border-color: #b52129; }
#content .sh-quote-help, #content .sh-quote-error { margin: 6px 0 0; font-size: 13px; line-height: 1.5; }
#content .sh-quote-help { color: #6b7178; }
#content .sh-quote-error { color: #a01d24; font-weight: 600; }
.sh-quote-hp { position: absolute !important; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }
@media (max-width: 767.98px) {
    .sh-quote-layout { grid-template-columns: minmax(0, 1fr); gap: 22px; }
    .sh-pp-quote, .sh-quote-submit { width: 100%; }
}