/* ==========================================================================
   6. BİLDİRİM VE DURUM ROZETLERİ
   ==========================================================================
*/
/* Tooltip */
.knsdd-tooltip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 18px;
  height: 18px;
  margin: 0 4px;
  font-size: 14px;
  cursor: help;
  opacity: 0.7;
  transition: opacity 0.2s;
}
.knsdd-tooltip:hover {
  opacity: 1;
}

/* Küçük rozet */
.knsdd-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 6px;
  font-size: 11px;
  border-radius: 10px;
  background: #e7f1ff;
  color: #1d2327;
}
.knsdd-status-badge { display: inline-block; padding: 4px 10px; font-size: 11px; font-weight: 700; text-align: center; border-radius: 4px; color: #fff; text-transform: none; }
.knsdd-status-badge.status-active { background-color: #28a745; }
.knsdd-status-badge.status-pending { background-color: #17a2b8; }
.knsdd-status-badge.status-expired { background-color: #6c757d; }
.knsdd-status-badge.status-incomplete, .knsdd-status-badge.status-invalid { background-color: #ffc107; color: #212529; }
.knsdd-status-badge.status-paused { background-color: #dc3545; }

/* Genel Bildirim Kutusu */
.knsdd-notice {
  padding: 10px 12px;
  border: 1px solid #c3c4c7;
  border-left-width: 4px;
  margin-bottom: 15px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.knsdd-notice p {
  margin: 0;
  padding: 0;
  font-size: 13px;
}

.knsdd-notice.knsdd-notice-success {
  border-left-color: #46b450;
}

.knsdd-notice.knsdd-notice-warning {
  border-left-color: #0073aa; /* Mavi - dikkat çekici bilgilendirme */
}

/* Rose (pembe/kırmızı) temalı özel uyarı kutusu – modal üst uyarısı için */
.knsdd-notice.knsdd-notice-rose {
  border-left-color: #f5b5b5;
  background: #fde8e8;
  color: #7a1f1f;
}
.knsdd-notice.knsdd-notice-rose::before {
  content: "⚠";
  color: #d23f57;
}

/* Inline Uyarı (tablo satırı altı) - gruplar sayfası ile aynı */
.knsdd-inline-error-row td.knsdd-inline-warning,
.knsdd-inline-warning {
  padding: 6px 12px;
  border: 1px solid #d1d6dc;
  border-radius: 3px;
  font-size: 13px;
  line-height: 1.3;
  vertical-align: top;
}

/* Kurallar sayfası için özel ayarlama */
#knsdd-rules-table .knsdd-inline-error-row td.knsdd-inline-warning {
  padding: 6px 12px;
  font-size: 13px;
  line-height: 1.3;
}

/* Tema varyantları */
.knsdd-inline-warning.knsdd-theme-rose { background: #fde8e8; border-color: #f5b5b5; color: #7a1f1f; }
.knsdd-inline-warning.knsdd-theme-blue { background: #e8f1fd; border-color: #b5cff5; color: #123e7a; }
.knsdd-inline-warning.knsdd-theme-gray { background: #f4f6f8; border-color: #d1d6dc; color: #2f3947; }
.knsdd-inline-warning.knsdd-theme-sage { background: #e9f5f0; border-color: #b9e0cf; color: #1e5b48; }
.knsdd-inline-warning.knsdd-theme-lavender { background: #efe9f9; border-color: #d2c4ef; color: #3f2a77; }
.knsdd-inline-warning.knsdd-theme-amber { background: #fff7d6; border-color: #f2d48a; color: #7a4a0b; }


/* ==========================================================================
 7. MODAL PENCERE STİLLERİ
 ==========================================================================
*/
.knsdd-modal { display: none; position: fixed; z-index: 100000; left: 0; top: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.6); overflow-y: auto; }
.knsdd-modal-content { background-color: #fefefe; margin: 8% auto; padding: 20px 20px 44px; border: 1px solid #888; width: 72%; max-width: 760px; border-radius: 4px; max-height: 78vh; min-height: 46vh; overflow-y: auto; }
.knsdd-modal-actions { text-align: right; margin-top: 20px; }
.knsdd-modal-close { float: right; font-size: 24px; font-weight: bold; cursor: pointer; }
.knsdd-form-field { margin-bottom: 20px; }
.knsdd-modal .knsdd-form-field { margin-bottom: 14px; }
.knsdd-form-field label { font-weight: 600; display: block; margin-bottom: 5px; }
.knsdd-form-field input[type="text"], .knsdd-form-field textarea { width: 100%; }

/* Grup Adı Düzenle modalindeki inputu genişlet (modal içeriğini tamamen kaplayacak şekilde) */
#knsdd-messages-modal .knsdd-modal-content { /* Özgülüğü artır: mesajlar modali özelinde zorla */
margin: 8% auto;
max-height: 78vh;
min-height: 46vh;
padding-bottom: 44px;
width: 72%;
max-width: 760px;
}

#knsdd-edit-group-modal #knsdd-edit-group-name {
width: 100%;
max-width: 100%;
box-sizing: border-box;
}

/* Grup Adı Düzenle modali: kare ve kompakt boyut (yükseklik = genişlik) */
#knsdd-edit-group-modal .knsdd-modal-content {
/* Genel modal ölçülerini ez */
width: min(92vw, 560px) !important; /* daha geniş */
height: auto !important; /* içerik kadar */
max-width: none !important;
max-height: 360px !important; /* daha kısa tavan */
min-height: 0 !important;
margin: 10% auto !important;
padding: 16px 18px 20px !important;
box-sizing: border-box; /* padding dahil oran korunsun */
overflow: auto; /* içerik taşarsa scroll olsun */
}
.knsdd-form-field .description { font-size: 12px; color: #646970; }
.knsdd-message-group { border-top: 1px solid #ddd; padding-top: 12px; margin-top: 20px; }
.knsdd-message-group:first-child { border-top: none; margin-top: 0; padding-top: 0; }
.knsdd-message-group > h4 { margin: 0 0 10px; }
.knsdd-icon-settings { border-top: 1px solid #ddd; padding-top: 20px; margin-top: 20px; }
.knsdd-loop-message-settings {
  margin: 16px 0 20px;
  padding: 14px 16px;
  border: 1px solid #dcdcde;
  border-radius: 4px;
  background: #f9f9f9;
}
.knsdd-loop-message-settings h5 {
  display: flex;
  align-items: center;
  margin: 0 0 10px;
  font-size: 14px;
}
.knsdd-loop-message-controls {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 8px 0;
}
.knsdd-loop-message-controls .knsdd-inline-check {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  font-weight: 500;
}
.knsdd-loop-custom-text-field {
  margin-top: 12px;
}
.knsdd-loop-custom-text-field[hidden] {
  display: none !important;
}
.knsdd-loop-custom-text-field textarea {
  width: 100%;
  box-sizing: border-box;
}
.knsdd-character-counter {
  margin-top: 3px;
  color: #646970;
  font-size: 12px;
  text-align: right;
}
.knsdd-show-options-modal { display: flex; flex-wrap: wrap; gap: 15px; }
.knsdd-show-options-modal label { font-weight: normal; }
.knsdd-color-picker-wrapper { display: flex; align-items: center; gap: 2px; }
/* WP color picker bileşenlerinin varsayılan boşluklarını sıfırla */
.knsdd-color-col .wp-picker-container,
.knsdd-color-col .wp-picker-input-wrap { margin: 0 !important; }
.knsdd-color-picker-wrapper input[type="color"] { width: 32px; height: 32px; padding: 0; border: 1px solid #ddd; border-radius: 3px; cursor: pointer; }
.knsdd-color-hex-input { font-family: monospace; font-size: 12px; width: 75px !important; text-align: center; }

/* Renk alanı ile "Göster" kutularını aynı satıra al, yakın hizala */
.knsdd-field-color .knsdd-color-row { display: flex; align-items: center; justify-content: flex-start; gap: 10px; flex-wrap: wrap; }
.knsdd-field-color .knsdd-inline-show { font-weight: normal; white-space: nowrap; margin: 0; }
.knsdd-field-color .knsdd-inline-show-group { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.knsdd-inline-label { display: inline-flex; align-items: center; white-space: nowrap; color: #50575e; font-weight: 600; margin-left: 8px; margin-right: 4px; }
/* Başlık üstte, tikler altta gösterim için */
.knsdd-inline-title { display: block; margin: 2px 0 2px; color: #50575e; font-weight: 600; }

/* Üç sütun: 1) Mesaj Rengi, 2) Gösterim Alanları, 3) Mesaj Vurgusu */
.knsdd-color-grid { display: grid; grid-template-columns: max-content max-content max-content; column-gap: 40px; align-items: center; width: fit-content; justify-content: start; justify-items: start; }
/* Sütunlar arasında boşlukları artır */
.knsdd-color-grid > .knsdd-color-col { padding-right: 8px; }
.knsdd-color-grid > .knsdd-show-col,
.knsdd-color-grid > .knsdd-highlight-col { padding-left: 8px; }

/* Dikey görsel ayraç (tema ezmelerine karşı ::before ile) */
.knsdd-color-grid > .knsdd-show-col,
.knsdd-color-grid > .knsdd-highlight-col { position: relative; }
.knsdd-color-grid > .knsdd-show-col::before,
.knsdd-color-grid > .knsdd-highlight-col::before { content: ""; position: absolute; left: -20px; top: 2px; bottom: 2px; width: 1px; background: #dcdcdc; }
/* Sütunları iki satırlı yap: 1) etiket, 2) içerik */
.knsdd-color-col, .knsdd-show-col, .knsdd-highlight-col { display: grid; grid-auto-rows: auto auto; grid-template-rows: auto minmax(32px, auto); row-gap: 2px; margin: 0; padding: 0; align-self: stretch; }
/* Etiketleri en üstte hizala */
.knsdd-color-col > label,
.knsdd-show-col > .knsdd-inline-title,
.knsdd-highlight-col > .knsdd-inline-title { align-self: start; margin: 0 0 2px; }
/* İçeriği (renk picker + tik grubu) dikeyde ortala */
.knsdd-color-col .knsdd-color-picker-wrapper,
.knsdd-show-col .knsdd-inline-show-group,
.knsdd-highlight-col .knsdd-highlight-group { align-self: center; }
.knsdd-color-col > label,
.knsdd-show-col > .knsdd-inline-title,
.knsdd-highlight-col > .knsdd-inline-title { display: block; margin: 0 0 2px; color: #50575e; font-weight: 600; }
.knsdd-color-col .knsdd-color-picker-wrapper { margin: 0; height: 32px; align-items: center; }
.knsdd-show-col .knsdd-inline-show-group { margin: 0; display: flex; flex-direction: row; align-items: center; gap: 14px; flex-wrap: wrap; min-height: 32px; }
.knsdd-show-col .knsdd-inline-show-group label { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
.knsdd-highlight-col .knsdd-highlight-group { margin: 0; display: flex; flex-direction: row; gap: 14px; min-height: 32px; align-items: center; }
.knsdd-highlight-col .knsdd-highlight-group > .knsdd-form-field-inline { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.knsdd-highlight-col .knsdd-highlight-group > .knsdd-form-field-inline label { display: inline-flex; align-items: center; white-space: nowrap; margin: 0; }
/* Vurgulu checkbox etiketini de hizala (ürün ve sepet/ödeme için geçerli) */
.knsdd-highlight-col .knsdd-highlight-group > label { display: inline-flex; align-items: center; gap: 8px; margin: 0; }
/* Tüm checkbox etiketlerini flex ile ortala (dil/tema farklarından etkilenmesin) */
.knsdd-inline-show { display: inline-flex; align-items: center; gap: 8px; margin: 0 4px 0 0; }
/* Checkbox hizası: flex ile merkezle, manuel kaydırmayı kaldır */
.knsdd-show-col .knsdd-inline-show-group input[type="checkbox"],
.knsdd-highlight-col .knsdd-highlight-group input[type="checkbox"] { transform: none; margin: 0; vertical-align: middle; }
/* Form öğeleri için tutarlı satır yüksekliği */
.knsdd-show-col .knsdd-inline-show-group input[type="checkbox"],
.knsdd-highlight-col .knsdd-highlight-group input[type="checkbox"] { line-height: 1; }
/* Etiketler için tutarlı yükseklik */
.knsdd-inline-show,
.knsdd-highlight-col .knsdd-highlight-group > label { min-height: 32px; }
.knsdd-inline-show { margin: 0 4px 0 0; }

/* Özgülüğü artır: tema stillerini ezme (grid kalmalı) */
.knsdd-message-group .knsdd-field-color .knsdd-color-grid { display: grid !important; grid-template-columns: max-content max-content max-content; column-gap: 40px; align-items: center; justify-content: start; justify-items: start; }
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-color-col { padding-right: 8px; }
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-show-col,
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-highlight-col { padding-left: 8px; }

/* Özgül kapsam için de ayraç uygula */
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-show-col,
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-highlight-col { position: relative; }
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-show-col::before,
.knsdd-message-group .knsdd-field-color .knsdd-color-grid > .knsdd-highlight-col::before { content: ""; position: absolute; left: -20px; top: 2px; bottom: 2px; width: 1px; background: #d0d5dd; }
.knsdd-message-group .knsdd-field-color .knsdd-color-col, 
.knsdd-message-group .knsdd-field-color .knsdd-show-col { min-width: 0; }
/* Orta sütuna üst sınır koy ki üçüncü sütun yakına gelsin */
.knsdd-message-group .knsdd-field-color .knsdd-show-col { max-width: 420px; }

@media (max-width: 480px) {
.knsdd-field-color .knsdd-color-row { flex-direction: column; align-items: flex-start; }
}

/* Dar ekranda alt alta diz */
@media (max-width: 640px) {
.knsdd-color-grid { grid-template-columns: 1fr; row-gap: 8px; }
/* Mobilde ayraçları kaldır */
.knsdd-color-grid > .knsdd-show-col::before,
.knsdd-color-grid > .knsdd-highlight-col::before { display: none; }
.knsdd-color-grid > .knsdd-show-col,
.knsdd-color-grid > .knsdd-highlight-col { border-left: none; padding-left: 0; }
}

/* Geniş ekranda modal içindeki mesaj gruplarını iki sütuna böl */
@media (min-width: 640px) {
.knsdd-message-group { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.knsdd-message-group > h4 { grid-column: 1 / -1; }
/* Tüm genişliği kaplaması gereken alanlar */
.knsdd-message-group > .knsdd-show-options-modal,
.knsdd-message-group > .knsdd-form-field:has(.knsdd-highlight-group) { grid-column: 1 / -1; }
/* Alt satırlar: stil ve ikon ayarları da soldan başlasın ve tam genişlik kaplasın */
.knsdd-message-group > .knsdd-form-field:has(.knsdd-text-styles),
.knsdd-message-group > .knsdd-form-field:has(.knsdd-icon-settings) { grid-column: 1 / -1; }
}

/* Checkbox gruplarını yatay sırala */
.knsdd-highlight-group .knsdd-text-styles label { display: inline-flex; align-items: center; margin-right: 12px; font-weight: normal; }
.knsdd-highlight-group > label { display: inline-flex; align-items: center; font-weight: normal; }
/* Alt satır: stil seçeneklerini sola ve tek satırda hizala */
.knsdd-text-styles { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.knsdd-text-styles label { font-weight: normal; margin: 0; }

/* İkon ayarları: yeşillerdeki gibi içerik-temelli grid (px yerine intrinsic sizing) */
.knsdd-icon-settings {
display: grid;
grid-template-columns: max-content max-content max-content max-content max-content;
column-gap: 16px;
row-gap: 10px;
align-items: stretch; /* her sütun aynı yüksekliği alsın */
grid-auto-rows: 1fr; /* satır yüksekliğini eşitle, kontrolü ortalamayı kolaylaştır */
}
.knsdd-icon-settings .knsdd-form-field { margin: 0; width: auto; display: flex; flex-direction: column; }
.knsdd-icon-settings .knsdd-form-field > label { display: block; margin-bottom: 6px; }
.knsdd-icon-settings .knsdd-form-field-inline { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 0; }
/* Seç butonu + önizleme hizası */
.knsdd-icon-settings .knsdd-icon-package-field .knsdd-inline-group { display: inline-flex; align-items: center; gap: 8px; margin-block: auto; }
/* İkon kullan checkbox + metni, buton grubu ile aynı hizada (inline-flex, dikey ortalı) */
.knsdd-icon-settings .knsdd-inline-check { display: inline-flex; align-items: center; gap: 8px; vertical-align: middle; margin-block: auto; }

@media (max-width: 720px) {
/* Küçük ekranlarda otomatik sarma: 3 sütun */
.knsdd-icon-settings { grid-template-columns: max-content max-content max-content; }
}

/* Sekmeler */
.knsdd-tabs { display: flex; gap: 8px; margin-bottom: 12px; }
.knsdd-tab { background: #f6f7f7; border: 1px solid #dcdcde; color: #1d2327; }
.knsdd-tab.is-active { background: #2271b1; border-color: #2271b1; color: #fff; }
.knsdd-tab-content { display: none; }
.knsdd-tab-content.is-active { display: block; }

/* ==========================================================================
 8. RETURN FOCUS HIGHLIGHT (Amber, no outer glow)
 ========================================================================== */
.knsdd-return-focus {
  outline: 1px solid var(--knsdd-highlight-bd, #a16207); /* themed outline with amber fallback */
  outline-offset: -2px;
  background-color: var(--knsdd-highlight-bg, #fff7d6); /* focus bg via variable; fallback amber */
  box-shadow: 0 0 0 2px var(--knsdd-highlight-glow, rgba(161, 98, 7, 0.08)); /* themed glow with fallback */
  transition: background-color 0.35s ease, box-shadow 0.35s ease; /* smooth fade back handled by JS removal */
}

/* Satırın içindeki tüm hücrelerde de aynı arka planı uygula ve striped'ı baskıla */
.knsdd-return-focus > td {
  background-color: var(--knsdd-highlight-bg, #fff7d6) !important;
  transition: background-color 0.35s ease;
}

/* ==========================================================================
 9. İNDİRİM MESAJLARI (Vurgu & İkon)
 ==========================================================================
*/
.knsdd-frontend-messages { margin: 8px 0; }
/* JS konumlandırma tamamlanana kadar gizle (flicker önleme) */
.knsdd-product-promo:not([data-ready="1"]) { display: none !important; }
/* Görünürlük garantisi: ürün promosyon konteynerini blok ve tam genişlik yap */
.single-product .product .knsdd-product-promo,
.single-product .product .summary .knsdd-product-promo,
.single-product .product .entry-summary .knsdd-product-promo,
.product .summary .knsdd-product-promo,
.entry-summary .knsdd-product-promo {
  display: block;
  width: 100%;
}
/* Mesaj fiyatın üstündeyken, fiyatla aradaki boşluk (tabloyla uyumlu ~8px) */
.single-product .product .summary .knsdd-product-promo + .price,
.single-product .product .entry-summary .knsdd-product-promo + .price,
.product .summary .knsdd-product-promo + .price,
.entry-summary .knsdd-product-promo + .price { margin-top: 8px; }
/* Tablo -> Mesaj arası varsayılan boşluk */
.knsdd-tier-table-container + .knsdd-product-promo { margin-top: 8px; }
.knsdd-message-item { 
  /* İkon ve metni aynı satırda, düzgün boşlukla hizala */
  display: flex; 
  align-items: center; 
  column-gap: 4px; 
  row-gap: 4px; 
  flex-wrap: nowrap; 
  margin: 0.55em 0; /* daha ölçülü nefes alanı */
  line-height: inherit; /* tema tipografisini koru */
}

/* Per-line (ürün adı altı) kademeli indirim mesajı */
.knsdd-line-message {
  display: block;
  margin-top: 0.6em; /* ölçülü boşluk */
  margin-bottom: 0.6em; /* ölçülü boşluk */
  line-height: inherit; /* tema tipografisini koru */
  font-size: inherit;   /* tema fontunu kullan */
}
/* Aynı ürün altında birden fazla satır mesajı varsa arayı dar ama tutarlı tut */
.knsdd-line-message + .knsdd-line-message { margin-top: 2px; }

/* Inline metin konteyneri ve parçaları: tipografiyi temaya bırak */
.knsdd-inline-text,
.knsdd-inline-text .knsdd-message-chunk {
  font-size: inherit;
  line-height: inherit;
}

/* WooCommerce bağlamında (mini sepet / sepet / ödeme) ürün blokları arasında ek nefes alanı */
.woocommerce-mini-cart .knsdd-line-message,
.widget_shopping_cart .knsdd-line-message,
.woocommerce-cart .knsdd-line-message,
.woocommerce-checkout .knsdd-line-message {
  margin-bottom: 0.75em; /* ürün blokları arası (ölçülü) */
}

/* İkonun metin üzerine binmesini engelle ve sabit genişlik ver */
.knsdd-message-item .knsdd-icon {
  flex: 0 0 auto; 
  display: inline-flex; 
  align-items: center; 
  justify-content: center; 
  line-height: 1; 
}

/* SVG her zaman blok olsun (çevre satır yüksekliğinden etkilenmesin) */
.knsdd-message-item .knsdd-icon svg { display: block; }

/* İkon önce ise sağa boşluk, sonra ise sola boşluk ver */
/* gap kullanıldığı için ekstra marj gerekmiyor */
.knsdd-message-item .knsdd-icon:first-child { margin-right: 0; }
.knsdd-message-item .knsdd-icon:last-child { margin-left: 0; }

/* Sol hizalama garantisi: tema kaynaklı iç boşlukları sıfırla */
.knsdd-product-promo,
.knsdd-frontend-messages,
.knsdd-message-item { padding-left: 0; margin-left: 0; text-indent: 0; }

/* Vurgu stilleri (bağımsız) */
.is-bold { font-weight: 600; }
.is-italic { font-style: italic; }
.is-underline { text-decoration: underline; }

/* WooCommerce Notice İkon Stilleri - Native Notification Sistemi için */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
text-align: left;
}

.woocommerce-message .knsdd-icon,
.woocommerce-info .knsdd-icon,
.woocommerce-error .knsdd-icon {
display: inline-block;
/* Mikro ofset: bazı temalarda font ascent ve SVG viewBox'ı nedeniyle ikon üstte algılanabilir */
vertical-align: -0.05em;
margin: 0 0.1em 0 0; /* Memory kurallı: general icons 0.1em */
line-height: 1;
}

.woocommerce-message .knsdd-icon svg,
.woocommerce-info .knsdd-icon svg,
.woocommerce-error .knsdd-icon svg {
display: block;
}

/* Tüm ikonları dolgusuz, ince çizgili (outline) göster */
.knsdd-icon svg * {
fill: none !important;
stroke: currentColor;
stroke-linecap: round;
stroke-linejoin: round;
/* Ölçeklendirmede çizgi kalınlığını kontrollü tut */
vector-effect: non-scaling-stroke;
}

/* Boyuta göre çizgi kalınlığı (göz algısına göre) */
.knsdd-icon.knsdd-icon--sm svg * { stroke-width: 1 !important; }
.knsdd-icon.knsdd-icon--md svg * { stroke-width: 0.8 !important; }
.knsdd-icon.knsdd-icon--lg svg * { stroke-width: 0.6 !important; }

/* Boyuta göre mikro hizalama düzeltmeleri (WC notice) */
.woocommerce-message .knsdd-icon.knsdd-icon--sm,
.woocommerce-info .knsdd-icon.knsdd-icon--sm,
.woocommerce-error .knsdd-icon.knsdd-icon--sm {
vertical-align: -0.05em;
}
.woocommerce-message .knsdd-icon.knsdd-icon--md,
.woocommerce-info .knsdd-icon.knsdd-icon--md,
.woocommerce-error .knsdd-icon.knsdd-icon--md {
vertical-align: -0.12em;
}
.woocommerce-message .knsdd-icon.knsdd-icon--lg,
.woocommerce-info .knsdd-icon.knsdd-icon--lg,
.woocommerce-error .knsdd-icon.knsdd-icon--lg {
vertical-align: -0.28em;
}

/* Flex bağlamında görsel kaydırma: yalnızca WC uyarılarındaki svg'yi em ile aşağı çek */
.woocommerce-message .knsdd-icon.knsdd-icon--md svg,
.woocommerce-info .knsdd-icon.knsdd-icon--md svg,
.woocommerce-error .knsdd-icon.knsdd-icon--md svg { transform: translateY(0.12em) !important; }
.woocommerce-message .knsdd-icon.knsdd-icon--lg svg,
.woocommerce-info .knsdd-icon.knsdd-icon--lg svg,
.woocommerce-error .knsdd-icon.knsdd-icon--lg svg { transform: translateY(0.28em) !important; }

/* Mikro hizalama (clean totals row): konteyneri em ile AŞAĞI kaydır (pozitif değer) */
.knsdd-clean-notice-row .knsdd-icon.knsdd-icon--md { transform: translateY(0.06em) !important; }
.knsdd-clean-notice-row .knsdd-icon.knsdd-icon--lg { transform: translateY(0.10em) !important; }

/* Fallback Ödeme Sayfası Uyarıları - Tema Renklerini Kullanır */
.knsdd-checkout-notices {
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
text-align: left;
/* Tema renklerini kullan - sadece yapısal stil */
}

.knsdd-checkout-notices .knsdd-icon {
display: inline-block;
vertical-align: baseline;
margin: 0 0.1em 0 0; /* Memory kurallı: general icons 0.1em */
line-height: 1;
}

.knsdd-inline-checkout-notices {
word-wrap: break-word;
overflow-wrap: break-word;
white-space: normal;
text-align: left;
/* Tema bağımsız - sadece metin akışı */
}

.knsdd-inline-checkout-notices .knsdd-icon {
display: inline-block;
vertical-align: baseline;
margin: 0 0.05em 0 0; /* Memory kurallı: inline text icons 0.05em */
line-height: 1;
}

/* Boyuta göre mikro hizalama düzeltmeleri (inline text) */
.knsdd-inline-checkout-notices .knsdd-icon.knsdd-icon--sm,
.knsdd-inline-text .knsdd-icon.knsdd-icon--sm { vertical-align: -0.02em; }
.knsdd-inline-checkout-notices .knsdd-icon.knsdd-icon--md,
.knsdd-inline-text .knsdd-icon.knsdd-icon--md { vertical-align: -0.04em; }
.knsdd-inline-checkout-notices .knsdd-icon.knsdd-icon--lg,
.knsdd-inline-text .knsdd-icon.knsdd-icon--lg { vertical-align: -0.18em; }

/* Mini sepet (inline text) için ikon boşluğu – diğer bağlamlarla uyumlu olsun */
.knsdd-inline-text .knsdd-icon {
display: inline-block;
vertical-align: baseline;
margin: 0 0.05em 0 0; /* inline text ile aynı aralık */
line-height: 1;
}

.knsdd-clean-notice-row {
text-align: left;
}

.knsdd-clean-notice-row .knsdd-icon {
display: inline-block;
vertical-align: -0.08em; 
margin: 0 0.15em 0 0; /* Memory kurallı: table icons 0.15em */
line-height: 1;
}

/* Mobil ödeme sayfası uyarıları için responsive kurallar */
@media (max-width: 768px) {
.knsdd-checkout-notices,
.knsdd-inline-checkout-notices {
  padding: 8px 10px; /* tipografiyi temaya bırak */
  margin: 10px 0;
}

.knsdd-clean-notice-row td {
  padding: 8px !important; /* tipografiyi temaya bırak */
}
}

@media (max-width: 480px) {
.knsdd-checkout-notices,
.knsdd-inline-checkout-notices {
  padding: 6px 8px; /* tipografiyi temaya bırak */
  margin: 8px 0;
}

.knsdd-clean-notice-row td {
  padding: 6px !important; /* tipografiyi temaya bırak */
}
}

/* İkon boyutları */
.knsdd-icon--sm { width: 12px; height: 12px; }
.knsdd-icon--md { width: 16px; height: 16px; }
.knsdd-icon--lg { width: 20px; height: 20px; }

/* Iconify ikonları: inline SVG 1em kullanır; boyutu font-size ile kontrol ederiz */
.knsdd-icon.iconify { line-height: 1; display: inline-block; }
/* span.iconify ve svg.iconify için sm/md/lg font-size'ları uygula */
.knsdd-icon.iconify.knsdd-icon--sm,
svg.iconify.knsdd-icon--sm { font-size: 12px !important; }
.knsdd-icon.iconify.knsdd-icon--md,
svg.iconify.knsdd-icon--md { font-size: 16px !important; }
.knsdd-icon.iconify.knsdd-icon--lg,
svg.iconify.knsdd-icon--lg { font-size: 20px !important; }

/* Admin: İkon önizleme rozeti */
.knsdd-icon-preview { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border: 1px solid #e2e8f0; border-radius: 6px; background: #fff; color: #000; }
.knsdd-icon-preview svg { width: 18px; height: 18px; }
/* Admin preview: tüm şekilleri stroke tabanlı ve ince çizimli yap */
.knsdd-icon-preview svg * {
fill: none;
stroke: currentColor;
stroke-width: 1.2;
stroke-linecap: round;
stroke-linejoin: round;
stroke-opacity: 1;
vector-effect: non-scaling-stroke;
}

/* SVG boyutu PHP'de inline olarak verilir (render_icon), burada ekstra kurala ihtiyaç yok. */

#knsdd-icon-picker {
position: fixed; 
z-index: 100001; 
inset: 0; 
display: none; 
background: rgba(0,0,0,0.5);
/* İçeriği ortala: sadece .is-open olduğunda görünür */
align-items: center; 
justify-content: center; 
padding: 24px;
/* Boyut hesapları için değişkenler */
--picker-cols: 5;
--picker-cell: 56px;
--picker-gap: 10px;
--picker-pad: 14px;
--picker-width: calc(var(--picker-cols) * var(--picker-cell) + (var(--picker-cols) - 1) * var(--picker-gap) + 2 * var(--picker-pad));
}
/* Açık durumda göster ve flex ile ortala (inline display:none'u ezmek için !important) */
#knsdd-icon-picker.is-open { display: flex !important; flex-direction: column; gap: 0; }
#knsdd-icon-picker .knsdd-icon-grid { display: grid; grid-template-columns: repeat(5, 56px); gap: 10px; padding: 14px; justify-content: center; width: var(--picker-width); background: #fff; border: 1px solid #e2e8f0; border-top: none; border-radius: 0 0 10px 10px; box-shadow: 0 6px 24px rgba(0,0,0,0.15); }
#knsdd-icon-picker .knsdd-icon-item { width: 56px; height: 56px; border: 1px solid #e2e8f0; background: #fff; border-radius: 8px; display: inline-flex; align-items: center; justify-content: center; cursor: pointer; transition: box-shadow .15s ease, border-color .15s ease, background-color .15s ease; color: #000; }
#knsdd-icon-picker .knsdd-icon-item:hover { border-color: #2271b1; background-color: #f1f5f9; box-shadow: 0 0 0 2px rgba(34, 113, 177, 0.12); color: #000; }
#knsdd-icon-picker .knsdd-icon-item.is-selected { border-color: #2271b1; box-shadow: 0 0 0 2px rgba(34, 113, 177, 0.22); background-color: #eef6fc; color: #000; }
#knsdd-icon-picker .knsdd-icon-item svg { width: 24px; height: 24px; }
/* Admin picker: tüm şekilleri stroke tabanlı ve ince çizimli yap */
#knsdd-icon-picker .knsdd-icon-item svg * {
fill: none;
stroke: currentColor;
stroke-width: 1.2;
stroke-linecap: round;
stroke-linejoin: round;
stroke-opacity: 1;
vector-effect: non-scaling-stroke;
}
#knsdd-icon-picker .knsdd-icon-picker-header { background: #f6f7f7; border: 1px solid #e2e8f0; border-bottom: none; border-radius: 10px 10px 0 0; display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; width: var(--picker-width); box-shadow: 0 6px 24px rgba(0,0,0,0.08); }
#knsdd-icon-picker .knsdd-icon-picker-header strong { font-weight: 600; color: #1d2327; }
#knsdd-icon-picker .knsdd-icon-picker-close { font-size: 20px; line-height: 1; color: #1d2327; text-decoration: none; }
#knsdd-icon-picker .knsdd-icon-picker-close:hover { color: #2271b1; }

/* Küçük ekran: paneli daralt ve sütun sayısını azalt */
@media (max-width: 560px) {
#knsdd-icon-picker { --picker-cols: 4; }
#knsdd-icon-picker .knsdd-icon-grid { grid-template-columns: repeat(4, 56px); }
}

/* ==========================================================================
   10. IMPORT/EXPORT UI COMPONENTS
   ==========================================================================
*/

/* Card Header with Toolbar */
.knsdd-card-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    flex-wrap: wrap;
    gap: 12px;
}

.knsdd-card-header h2 {
    margin: 0;
    flex: 1;
}

.knsdd-import-export-toolbar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-shrink: 0;
}

/* Export Button Wrapper (single button) */

/* New: Single export button wrapper (no split) */
.knsdd-export-wrapper {
    position: relative;
    display: inline-block;
}

/* (legacy split-button/dropdown stilleri tamamen kaldırıldı) */

/* (legacy export panel stilleri kaldırıldı) */

/* Export modal options */
.knsdd-export-options { display: grid; grid-template-columns: 1fr; row-gap: 6px; margin: 8px 0; }
.knsdd-export-options label { display: flex; align-items: center; gap: 8px; font-size: 13px; margin: 0; }
.knsdd-export-options label:hover { background: #f6f7f7; }

/* Import Modal Specific Styles */
.knsdd-import-modal-content {
    max-width: 600px !important;
    width: 90% !important;
}

/* Export Modal Specific Styles (compact) */
.knsdd-export-modal-content {
    width: min(92vw, 480px) !important; /* daha dar, içerik odaklı */
    max-width: 480px !important;
    min-height: 0 !important;       /* gereksiz dikey yüksekliği kaldır */
    max-height: 60vh !important;    /* daha düşük tavan yüksekliği */
    margin: 10% auto !important;    /* biraz daha aşağıdan başlat */
    padding: 14px 16px 18px !important; /* daha kompakt iç boşluk */
}
.knsdd-export-modal-content h3 { margin: 0 0 10px 0; font-size: 16px; }
.knsdd-export-modal-content .knsdd-modal-actions { margin-top: 12px; }

.knsdd-import-step {
    margin-bottom: 20px;
}

.knsdd-import-step h4 {
    margin: 0 0 12px 0;
    color: #1d2327;
    font-size: 14px;
    font-weight: 600;
}

/* File Upload Area */
.knsdd-file-upload-area {
    margin: 16px 0;
}

.knsdd-file-drop-zone {
    border: 2px dashed #c3c4c7;
    border-radius: 6px;
    padding: 32px 16px;
    text-align: center;
    background: #f9f9f9;
    cursor: pointer;
    transition: border-color 0.2s ease, background-color 0.2s ease;
}

.knsdd-file-drop-zone:hover,
.knsdd-file-drop-zone.dragover {
    border-color: #2271b1;
    background: #f0f6fc;
}

.knsdd-file-drop-content .dashicons {
    font-size: 32px;
    color: #8c8f94;
    margin-bottom: 8px;
}

.knsdd-file-drop-content p {
    margin: 8px 0 16px 0;
    color: #646970;
    font-size: 14px;
}

.knsdd-file-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 12px;
    background: #f0f6fc;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    margin-top: 12px;
    font-size: 13px;
}

.knsdd-file-name {
    font-weight: 600;
    color: #1d2327;
}

.knsdd-file-size {
    color: #646970;
}

/* Validation Report */
.knsdd-validation-summary {
    padding: 12px;
    border-radius: 4px;
    margin-bottom: 16px;
    font-size: 14px;
    font-weight: 600;
}

.knsdd-validation-summary.success {
    background: #d1e7dd;
    border: 1px solid #badbcc;
    color: #0f5132;
}

.knsdd-validation-summary.error {
    background: #f8d7da;
    border: 1px solid #f5c2c7;
    color: #842029;
}

.knsdd-validation-summary.warning {
    background: #fff3cd;
    border: 1px solid #ffecb5;
    color: #664d03;
}

.knsdd-validation-details {
    max-height: 200px;
    overflow-y: auto;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    background: #fff;
}

.knsdd-validation-item {
    padding: 8px 12px;
    border-bottom: 1px solid #f0f0f1;
    font-size: 13px;
    line-height: 1.4;
}

.knsdd-validation-item:last-child {
    border-bottom: none;
}

.knsdd-validation-item.error {
    background: #fef7f7;
    color: #842029;
}

.knsdd-validation-item.warning {
    background: #fffbf0;
    color: #664d03;
}

.knsdd-validation-item-code {
    font-family: monospace;
    font-size: 11px;
    background: rgba(0,0,0,0.05);
    padding: 2px 4px;
    border-radius: 2px;
    margin-right: 8px;
}

/* Progress Bar */
.knsdd-progress-bar {
    width: 100%;
    height: 8px;
    background: #f0f0f1;
    border-radius: 4px;
    overflow: hidden;
    margin: 12px 0;
}

.knsdd-progress-fill {
    height: 100%;
    background: #2271b1;
    width: 0%;
    transition: width 0.3s ease;
    border-radius: 4px;
}

.knsdd-progress-text {
    text-align: center;
    font-size: 13px;
    color: #646970;
    margin: 8px 0 0 0;
}

/* Import Results */
.knsdd-import-results {
    padding: 16px;
    background: #f0f6fc;
    border: 1px solid #c3c4c7;
    border-radius: 4px;
    font-size: 14px;
}

.knsdd-import-results h5 {
    margin: 0 0 8px 0;
    color: #1d2327;
    font-size: 14px;
    font-weight: 600;
}

.knsdd-import-results ul {
    margin: 8px 0 0 20px;
    padding: 0;
}

.knsdd-import-results li {
    margin: 4px 0;
    font-size: 13px;
    color: #646970;
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .knsdd-card-header {
        flex-direction: column;
        align-items: stretch;
    }
    
    .knsdd-import-export-toolbar {
        justify-content: center;
        width: 100%;
    }
    
    .knsdd-import-modal-content {
        width: 95% !important;
        margin: 5% auto !important;
    }
    .knsdd-export-modal-content {
        width: 95% !important;
        margin: 5% auto !important;
    }
    
    .knsdd-file-drop-zone {
        padding: 24px 12px;
    }
    
    .knsdd-file-drop-content .dashicons {
        font-size: 24px;
    }
}

@media (max-width: 480px) {
    .knsdd-import-export-toolbar {
        flex-direction: column;
        gap: 8px;
    }
    .knsdd-export-wrapper { width: 100%; }
    .knsdd-export-wrapper > .button { width: 100%; }
    
    #knsdd-import-groups {
        width: 100%;
    }
}