/* AUK Helmets Bayi Portal — Tailwind tamamlayıcı stilleri */

html { scroll-behavior: smooth; }
body { font-feature-settings: "cv02","cv03","cv04","cv11"; }

/* Form input default reset */
input[type="text"], input[type="email"], input[type="password"], input[type="number"],
input[type="search"], input[type="tel"], textarea, select {
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

/* ============================================
   PORTAL LAYOUT — Sidebar + Topbar
   ============================================ */

.portal-shell { min-height: 100vh; display: flex; }

/* Sidebar (sol, sabit) */
.portal-sidebar {
  width: 17.5rem; flex-shrink: 0;
  position: fixed; inset: 0 auto 0 0; z-index: 40;
  background: #0f172a;
  color: #cbd5e1;
  display: flex; flex-direction: column;
  transform: translateX(-100%);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}
.portal-sidebar.is-open { transform: translateX(0); }
@media (min-width: 1024px) {
  .portal-sidebar { transform: translateX(0); }
}

.portal-sidebar-logo {
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid rgb(255 255 255 / .06);
  display: flex; align-items: center; gap: .75rem;
}

.portal-sidebar-nav {
  flex: 1; overflow-y: auto;
  padding: .75rem .5rem;
  scrollbar-width: thin;
  scrollbar-color: #334155 transparent;
}
.portal-sidebar-nav::-webkit-scrollbar { width: 6px; }
.portal-sidebar-nav::-webkit-scrollbar-track { background: transparent; }
.portal-sidebar-nav::-webkit-scrollbar-thumb { background: #334155; border-radius: 3px; }

.portal-nav-section {
  font-size: .6875rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .08em;
  color: #64748b;
  padding: 1.25rem 1rem .5rem;
}

.portal-nav-item {
  display: flex; align-items: center; gap: .75rem;
  padding: .625rem 1rem;
  margin: .125rem 0;
  border-radius: .5rem;
  font-size: .875rem; font-weight: 500;
  color: #cbd5e1;
  border-left: 3px solid transparent;
  transition: all .15s ease;
  cursor: pointer;
}
.portal-nav-item:hover {
  background: rgb(255 255 255 / .04);
  color: #fff;
}
.portal-nav-item.is-active {
  background: rgb(255 107 53 / .12);
  color: #ffa370;
  border-left-color: #ff6b35;
}
.portal-nav-item .nav-icon { width: 1.125rem; height: 1.125rem; flex-shrink: 0; }
.portal-nav-item .nav-badge {
  margin-left: auto;
  background: #ff6b35; color: #fff;
  font-size: .6875rem; font-weight: 700;
  padding: .125rem .5rem; border-radius: 999px;
}

.portal-sidebar-footer {
  padding: 1rem;
  border-top: 1px solid rgb(255 255 255 / .06);
}
.portal-user-card {
  display: flex; align-items: center; gap: .75rem;
  padding: .625rem .75rem;
  background: rgb(255 255 255 / .04);
  border-radius: .625rem;
}
.portal-user-avatar {
  width: 2.25rem; height: 2.25rem;
  background: linear-gradient(135deg, #ff6b35, #ed5424);
  color: #fff; font-weight: 700; font-size: .8125rem;
  border-radius: .5rem;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
}

/* Backdrop */
.portal-sidebar-backdrop {
  position: fixed; inset: 0; z-index: 30;
  background: rgb(15 23 42 / .55);
  opacity: 0; pointer-events: none;
  transition: opacity .2s ease;
}
.portal-sidebar-backdrop.is-open { opacity: 1; pointer-events: auto; }
@media (min-width: 1024px) {
  .portal-sidebar-backdrop { display: none !important; }
}

/* Main wrapper */
.portal-main {
  flex: 1; min-width: 0;
  display: flex; flex-direction: column;
}
@media (min-width: 1024px) {
  .portal-main { margin-left: 17.5rem; }
}

/* Topbar */
.portal-topbar {
  position: sticky; top: 0; z-index: 20;
  background: #fff;
  border-bottom: 1px solid #e2e8f0;
  box-shadow: 0 1px 2px rgb(0 0 0 / .03);
}

.portal-content { flex: 1; }

/* ============================================
   ORTAK BİLEŞENLER
   ============================================ */

/* Toast bildirimleri */
.toast-stack {
  position: fixed; top: 1rem; right: 1rem; z-index: 9999;
  display: flex; flex-direction: column; gap: .5rem;
  pointer-events: none;
}
.toast {
  pointer-events: auto;
  min-width: 280px; max-width: 380px;
  padding: .875rem 1rem;
  border-radius: .75rem;
  background: #fff;
  box-shadow: 0 10px 25px -5px rgb(0 0 0 / .15), 0 4px 10px -6px rgb(0 0 0 / .1);
  border-left: 4px solid #94a3b8;
  display: flex; align-items: flex-start; gap: .75rem;
  animation: toast-in .25s cubic-bezier(.2,.8,.2,1);
}
.toast.toast-success { border-left-color: #10b981; }
.toast.toast-error { border-left-color: #ef4444; }
.toast.toast-warning { border-left-color: #f59e0b; }
.toast.toast-info { border-left-color: #3b82f6; }
.toast.toast-leaving { animation: toast-out .2s ease forwards; }

@keyframes toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes toast-out { to { opacity: 0; transform: translateX(20px); } }

/* Modal overlay */
.app-modal-overlay {
  position: fixed; inset: 0; z-index: 9000;
  background: rgb(15 23 42 / .55);
  display: flex; align-items: center; justify-content: center;
  padding: 1rem;
  opacity: 0; pointer-events: none;
  transition: opacity .2s ease;
}
.app-modal-overlay.is-open { opacity: 1; pointer-events: auto; }
.app-modal {
  background: #fff; border-radius: 1rem;
  width: 100%; max-width: 480px;
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / .35);
  transform: scale(.96); transition: transform .2s ease;
  max-height: 90vh; overflow-y: auto;
}
.app-modal-overlay.is-open .app-modal { transform: scale(1); }

/* Loading spinner */
.app-spinner {
  width: 1.25rem; height: 1.25rem;
  border: 2px solid rgb(255 107 53 / .25);
  border-top-color: #ff6b35;
  border-radius: 50%;
  animation: spin 0.7s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* Tablo hover */
.app-table tbody tr { transition: background-color .15s ease; }
.app-table tbody tr:hover { background-color: rgb(248 250 252); }

/* Card hover (ürün kartları için) */
.app-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: .75rem;
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}
.app-card:hover {
  border-color: #cbd5e1;
  box-shadow: 0 4px 12px -2px rgb(15 23 42 / .08);
}

/* Line-clamp (Tailwind CDN tüm sürümlerinde olmayabilir — fallback) */
.card-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Pill tabs (yatay tab navigation) */
.pill-tabs {
  display: flex; gap: .25rem;
  padding: .25rem;
  background: #f1f5f9;
  border-radius: .625rem;
  overflow-x: auto;
  scrollbar-width: none;
}
.pill-tabs::-webkit-scrollbar { display: none; }
.pill-tab {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .5rem .875rem;
  border-radius: .5rem;
  font-size: .8125rem; font-weight: 600;
  color: #475569;
  white-space: nowrap;
  cursor: pointer;
  transition: all .15s ease;
}
.pill-tab:hover { color: #0f172a; }
.pill-tab.is-active {
  background: #fff;
  color: #ff6b35;
  box-shadow: 0 1px 3px rgb(15 23 42 / .08);
}

/* Print-friendly */
@media print {
  .no-print { display: none !important; }
  body { background: #fff !important; }
  .portal-sidebar, .portal-topbar, .topnav { display: none !important; }
  .portal-main, .topnav-shell { margin-left: 0 !important; padding-top: 0 !important; }
}

/* ============================================
   TOP NAVBAR LAYOUT — yatay üst menü (koyu tema)
   ============================================ */

.topnav-shell {
  min-height: 100vh;
  display: flex; flex-direction: column;
  background: #f6f7f9;
}

/* Üst yapışkan navbar — koyu kurumsal */
.topnav {
  position: sticky; top: 0; z-index: 40;
  background: #0a0e1a;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
  border-bottom: 1px solid rgba(255, 107, 53, 0.15);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.4), 0 4px 12px -4px rgba(0, 0, 0, 0.2);
}
.topnav-inner {
  display: flex; align-items: center; gap: 1rem;
  height: 4.75rem;
  padding: 0 1rem;
  max-width: 1500px;
  margin: 0 auto;
}
@media (min-width: 640px) {
  .topnav-inner { padding: 0 1.5rem; height: 5rem; gap: 1.25rem; }
}
@media (min-width: 1280px) {
  .topnav-inner { gap: 2rem; }
}

/* Logo bloğu */
.topnav-brand {
  display: flex; align-items: center; gap: .75rem;
  flex-shrink: 0;
}
.topnav-brand img {
  height: 2rem; width: auto;
  filter: brightness(0) invert(1); /* AUK logosu siyah → beyaz */
}
.topnav-brand-divider {
  width: 1px; height: 1.75rem;
  background: rgba(255, 255, 255, 0.12);
}
.topnav-brand-tag {
  font-size: 10px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: rgba(255, 255, 255, 0.45);
  line-height: 1;
}

/* Ana menü — orta */
.topnav-menu {
  display: none;
  align-items: center;
  gap: .125rem;
  min-width: 0;
}
@media (min-width: 1024px) {
  .topnav-menu { display: flex; }
}

.topnav-link {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .625rem .75rem;
  font-size: .8125rem; font-weight: 600;
  color: rgba(255, 255, 255, 0.65);
  border-radius: .5rem;
  transition: all .15s ease;
  position: relative;
  white-space: nowrap;
}
@media (min-width: 1280px) {
  .topnav-link { padding: .625rem 1rem; font-size: .875rem; }
}
.topnav-link:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
}
.topnav-link.is-active {
  color: #ff854a;
  background: rgba(255, 107, 53, 0.10);
}
.topnav-link.is-active::after {
  content: '';
  position: absolute;
  left: 50%; bottom: -1.5rem;
  transform: translateX(-50%);
  width: 2rem; height: 2px;
  background: #ff6b35;
  border-radius: 999px;
}
.topnav-link-icon { width: 1rem; height: 1rem; opacity: .55; }
.topnav-link:hover .topnav-link-icon { opacity: .9; }
.topnav-link.is-active .topnav-link-icon { opacity: 1; }
.topnav-link-badge {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 1.125rem; height: 1.125rem;
  padding: 0 .375rem;
  background: #ed5424; color: #fff;
  font-size: .625rem; font-weight: 800;
  border-radius: 999px;
}

/* Sağ aksiyon grubu */
.topnav-actions {
  display: flex; align-items: center; gap: .5rem;
  flex-shrink: 0;
}

/* Arama (koyu zemine uyumlu) */
.topnav-search {
  display: none;
  position: relative;
  width: 14rem;
  margin-left: auto;
}
@media (min-width: 768px) {
  .topnav-search { display: block; }
}
@media (min-width: 1280px) {
  .topnav-search { width: 18rem; }
}
.topnav-search input {
  width: 100%;
  padding: .5625rem .75rem .5625rem 2.25rem;
  background: rgba(255, 255, 255, 0.06);
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: .5rem;
  font-size: .8125rem;
  color: #fff;
  outline: none;
  transition: all .15s ease;
}
.topnav-search input::placeholder { color: rgba(255, 255, 255, 0.4); }
.topnav-search input:hover {
  background: rgba(255, 255, 255, 0.09);
  border-color: rgba(255, 255, 255, 0.12);
}
.topnav-search input:focus {
  background: #fff;
  color: #0f172a;
  border-color: #ff6b35;
  box-shadow: 0 0 0 3px rgba(255, 107, 53, 0.2);
}
.topnav-search input:focus::placeholder { color: #94a3b8; }
.topnav-search-icon {
  position: absolute; left: .75rem; top: 50%;
  transform: translateY(-50%);
  width: 1rem; height: 1rem;
  color: rgba(255, 255, 255, 0.5);
  pointer-events: none;
  transition: color .15s ease;
}
.topnav-search input:focus ~ .topnav-search-icon,
.topnav-search:focus-within .topnav-search-icon { color: #ed5424; }

/* İkon butonu (sepet, mobil hamburger, vs.) */
.topnav-icon-btn {
  position: relative;
  width: 2.5rem; height: 2.5rem;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: .5rem;
  color: rgba(255, 255, 255, 0.7);
  transition: all .15s ease;
  background: transparent;
}
.topnav-icon-btn:hover {
  background: rgba(255, 255, 255, 0.06);
  color: #fff;
}
.topnav-icon-btn-badge {
  position: absolute; top: .25rem; right: .25rem;
  min-width: 1.125rem; height: 1.125rem;
  padding: 0 .25rem;
  background: #ed5424; color: #fff;
  font-size: .625rem; font-weight: 800;
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid #0a0e1a;
}

/* USD kur pill — her sayfada görünür; tahsil edilen tutarın kurunu açıkça gösterir */
.topnav-kur-pill {
  display: inline-flex; align-items: center; gap: .375rem;
  padding: .375rem .625rem;
  background: rgba(16, 185, 129, 0.10);      /* emerald-500/10 */
  border: 1px solid rgba(16, 185, 129, 0.25); /* emerald-500/25 */
  border-radius: .5rem;
  color: #d1fae5;                             /* emerald-100 */
  font-size: .75rem; font-weight: 600;
  line-height: 1;
  transition: all .15s ease;
}
.topnav-kur-pill:hover {
  background: rgba(16, 185, 129, 0.18);
  border-color: rgba(16, 185, 129, 0.4);
}
.topnav-kur-pill-icon {
  display: inline-flex; align-items: center; justify-content: center;
  color: #34d399;                             /* emerald-400 */
}
.topnav-kur-pill-label {
  font-size: .625rem; font-weight: 700; letter-spacing: .08em;
  text-transform: uppercase;
  color: #6ee7b7;                             /* emerald-300 */
}
.topnav-kur-pill-value {
  font-weight: 800;
  color: #fff;
  font-variant-numeric: tabular-nums;
}

/* Bakiye Yükle pill (üst bar — emerald, sepetin yanında) */
.topnav-bakiye {
  display: none; align-items: center; gap: .4rem;
  padding: .45rem .85rem;
  background: rgba(16, 185, 129, 0.12);       /* emerald-500/12 */
  border: 1px solid rgba(16, 185, 129, 0.3);  /* emerald-500/30 */
  border-radius: .625rem;
  color: #6ee7b7;                             /* emerald-300 */
  font-size: .8125rem; font-weight: 700;
  white-space: nowrap;
  transition: all .15s ease;
}
.topnav-bakiye:hover {
  background: rgba(16, 185, 129, 0.22);
  border-color: rgba(16, 185, 129, 0.55);
  color: #fff;
}
.topnav-bakiye svg { width: 1rem; height: 1rem; flex-shrink: 0; }
@media (min-width: 1024px) { .topnav-bakiye { display: inline-flex; } }

/* Sepet pill (tutar göstergeli, koyu temada belirgin) */
.topnav-cart {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .375rem .875rem .375rem .375rem;
  background: rgba(255, 107, 53, 0.12);
  border: 1px solid rgba(255, 107, 53, 0.25);
  border-radius: .625rem;
  transition: all .15s ease;
  color: #fff;
  font-size: .8125rem; font-weight: 700;
  position: relative;
}
.topnav-cart:hover {
  background: rgba(255, 107, 53, 0.2);
  border-color: rgba(255, 107, 53, 0.4);
}
.topnav-cart-icon-wrap {
  position: relative;
  width: 1.875rem; height: 1.875rem;
  background: #ff6b35;
  border-radius: .375rem;
  display: inline-flex; align-items: center; justify-content: center;
  color: #fff;
}
.topnav-cart-badge {
  position: absolute; top: -.3125rem; right: -.3125rem;
  min-width: 1.125rem; height: 1.125rem;
  padding: 0 .25rem;
  background: #fff; color: #ed5424;
  font-size: .625rem; font-weight: 800;
  border-radius: 999px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 2px solid #0a0e1a;
}

/* Kullanıcı dropdown */
.topnav-user {
  position: relative;
}
.topnav-user-trigger {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .25rem .625rem .25rem .25rem;
  border-radius: .625rem;
  transition: all .15s ease;
  cursor: pointer;
  background: transparent;
  border: 1px solid transparent;
}
.topnav-user-trigger:hover {
  background: rgba(255, 255, 255, 0.06);
  border-color: rgba(255, 255, 255, 0.08);
}
.topnav-user-avatar {
  width: 2rem; height: 2rem;
  background: linear-gradient(135deg, #ff6b35, #ed5424);
  color: #fff;
  font-weight: 700; font-size: .75rem;
  border-radius: .375rem;
  display: inline-flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  letter-spacing: .02em;
}
.topnav-user-name {
  font-size: .8125rem; font-weight: 700;
  color: rgba(255, 255, 255, 0.9);
  max-width: 9rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: none;
}
@media (min-width: 1024px) {
  .topnav-user-name { display: inline-block; }
}
.topnav-user-trigger .text-slate-400 { color: rgba(255, 255, 255, 0.5) !important; }

.topnav-dropdown {
  position: absolute; right: 0; top: calc(100% + .5rem);
  width: 17rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: .875rem;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 12px 32px -8px rgba(15, 23, 42, 0.16);
  overflow: hidden;
  opacity: 0; transform: translateY(-4px) scale(.98);
  pointer-events: none;
  transition: opacity .15s ease, transform .15s ease;
  z-index: 50;
}
.topnav-dropdown.is-open {
  opacity: 1; transform: translateY(0) scale(1);
  pointer-events: auto;
}
.topnav-dropdown-head {
  padding: 1rem 1.125rem;
  border-bottom: 1px solid #e2e8f0;
  background: #f8fafc;
}
.topnav-dropdown-head-name {
  font-size: .875rem; font-weight: 700;
  color: #0f172a;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.topnav-dropdown-head-meta {
  font-size: .75rem; color: #64748b;
  margin-top: .125rem;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.topnav-dropdown-link {
  display: flex; align-items: center; gap: .625rem;
  padding: .625rem 1.125rem;
  font-size: .8125rem; font-weight: 600;
  color: #334155;
  transition: background .15s ease;
}
.topnav-dropdown-link:hover { background: #f8fafc; color: #0a0e1a; }
.topnav-dropdown-link.is-danger:hover { color: #dc2626; background: #fef2f2; }
.topnav-dropdown-link svg { width: 1rem; height: 1rem; opacity: .7; }
.topnav-dropdown-divider {
  height: 1px; background: #e2e8f0;
  margin: 0;
}

/* Mobil hamburger */
.topnav-mobile-toggle {
  display: inline-flex;
}
@media (min-width: 1024px) {
  .topnav-mobile-toggle { display: none; }
}

/* Mobil çekmece */
.mobile-drawer {
  position: fixed; inset: 0; z-index: 50;
  background: rgba(15, 23, 42, 0.5);
  backdrop-filter: blur(4px);
  opacity: 0; pointer-events: none;
  transition: opacity .2s ease;
}
.mobile-drawer.is-open { opacity: 1; pointer-events: auto; }
.mobile-drawer-panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  width: 20rem; max-width: 85vw;
  background: #fff;
  display: flex; flex-direction: column;
  transform: translateX(100%);
  transition: transform .25s cubic-bezier(.2,.8,.2,1);
}
.mobile-drawer.is-open .mobile-drawer-panel { transform: translateX(0); }
.mobile-drawer-head {
  padding: 1rem 1.25rem;
  border-bottom: 1px solid #e2e8f0;
  display: flex; align-items: center; justify-content: space-between;
}
.mobile-drawer-nav {
  flex: 1;
  padding: .75rem .75rem;
  overflow-y: auto;
}
.mobile-drawer-link {
  display: flex; align-items: center; gap: .75rem;
  padding: .75rem 1rem;
  border-radius: .5rem;
  font-size: .9375rem; font-weight: 600;
  color: #334155;
  transition: all .15s ease;
  margin: .125rem 0;
}
.mobile-drawer-link:hover { background: #f1f5f9; color: #0a0e1a; }
.mobile-drawer-link.is-active {
  background: #fff5f0; color: #ed5424;
  box-shadow: inset 0 0 0 1px #ffe6d6;
}
.mobile-drawer-link svg { width: 1.125rem; height: 1.125rem; }
.mobile-drawer-section {
  font-size: 10px; font-weight: 700;
  letter-spacing: 0.18em; text-transform: uppercase;
  color: #94a3b8;
  padding: 1rem 1.25rem .375rem;
}
.mobile-drawer-foot {
  padding: 1rem 1.25rem;
  border-top: 1px solid #e2e8f0;
  background: #f8fafc;
}

/* Ana içerik wrapper */
.topnav-content {
  flex: 1;
  width: 100%;
}

/* ============================================
   ARAMA DROPDOWN — yatay kompakt sonuç paneli
   ============================================ */
#searchResults {
  position: absolute !important;
  top: calc(100% + .625rem) !important;
  right: 0 !important;
  left: auto !important;
  width: 26rem !important;
  max-width: calc(100vw - 2rem);
  max-height: 75vh !important;
  overflow-y: auto !important;
  background: #fff !important;
  border: 1px solid #e2e8f0 !important;
  border-radius: .875rem !important;
  box-shadow:
    0 1px 2px rgba(15, 23, 42, 0.04),
    0 16px 40px -12px rgba(15, 23, 42, 0.3) !important;
  padding: .375rem !important;
  z-index: 60 !important;
}

/* search.php Bootstrap container/row override — vertical liste */
#searchResults .container,
#searchResults .container > .row {
  padding: 0 !important;
  margin: 0 !important;
  max-width: none !important;
  width: 100% !important;
  display: block !important;
}

/* Ürün kartını YATAY satıra çevir: 56x56 thumbnail solda, info sağda */
#searchResults .app-card {
  display: flex !important;
  flex-direction: row !important;
  align-items: stretch !important;
  height: auto !important;
  border: none !important;
  border-bottom: 1px solid #f1f5f9 !important;
  border-radius: .5rem !important;
  padding: .5rem !important;
  margin: 0 !important;
  gap: .75rem;
  transition: background .15s ease;
  overflow: hidden !important;
}
#searchResults .app-card:last-child { border-bottom: none !important; }
#searchResults .app-card:hover {
  background: #fff5f0 !important;
}

/* Stok kodu üst satırı — thumbnail'in altına gizle, sadece info kısmında göster */
#searchResults .app-card > .flex.items-center.justify-between {
  display: none !important;
}

/* Thumbnail (resim alanı) — küçük kare, sola */
#searchResults .app-card > a.aspect-square,
#searchResults .app-card > a.relative.block {
  flex: 0 0 64px !important;
  width: 64px !important;
  height: 64px !important;
  aspect-ratio: 1 !important;
  margin: 0 !important;
  border-radius: .375rem !important;
  background: #f8fafc !important;
  overflow: hidden;
}
#searchResults .app-card > a img {
  padding: 0 !important;
  object-fit: contain !important;
  width: 100% !important; height: 100% !important;
}

/* İndirim rozetini gizle (kompakt görünüm için) */
#searchResults .app-card .absolute.top-2.left-2 {
  display: none !important;
}

/* Gövde — sağ taraf */
#searchResults .app-card > .flex.flex-col.flex-1 {
  flex: 1 !important;
  padding: 0 !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  gap: .25rem !important;
  min-width: 0;
}

/* Ürün adı — tek satır clamp */
#searchResults .app-card > .flex.flex-col.flex-1 > a {
  font-size: .8125rem !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  min-height: auto !important;
  margin: 0 !important;
  -webkit-line-clamp: 2 !important;
  color: #0f172a !important;
}

/* Stok rozeti satırı — yan yana */
#searchResults .app-card > .flex.flex-col.flex-1 > .mb-2 {
  margin: 0 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: .5rem !important;
}
#searchResults .app-card > .flex.flex-col.flex-1 > .mb-2 > span {
  font-size: 9px !important;
  padding: .0625rem .375rem !important;
  line-height: 1.2 !important;
}
#searchResults .app-card .mb-2 svg,
#searchResults .app-card .mb-2 i { width: .625rem !important; height: .625rem !important; }

/* Fiyat satırı */
#searchResults .app-card > .flex.flex-col.flex-1 > .mb-3 {
  margin: 0 !important;
  display: flex !important;
  align-items: baseline !important;
  gap: .375rem !important;
}
#searchResults .app-card .mb-3 .text-lg {
  font-size: .875rem !important;
  font-weight: 800 !important;
  color: #ed5424 !important;
}
#searchResults .app-card .mb-3 del {
  font-size: 10px !important;
  color: #94a3b8 !important;
}

/* Sepet butonu varsa gizle (dropdown için gereksiz, ürün detayına yönlensin) */
#searchResults .app-card .mt-auto.pt-3 {
  display: none !important;
}

/* "Bayi girişi yapınız" linkini gizle (zaten giriş yapmış oluyor portal'da) */
#searchResults .app-card .mt-auto.inline-flex {
  display: none !important;
}

/* "Tükendi" durumu */
#searchResults .app-card .mt-auto.bg-slate-50 {
  display: none !important;
}

/* Loading / boş durum */
#searchResults > .p-4 {
  padding: 1rem !important;
  font-size: .8125rem !important;
  color: #64748b !important;
}

/* Mobil — sağa hizalı, viewport'a göre */
@media (max-width: 767px) {
  #searchResults {
    width: calc(100vw - 1.5rem) !important;
    right: .75rem !important;
  }
}

/* ===========================================================
   GLOBAL LOADER (üst progress bar + tam ekran spinner overlay)
   =========================================================== */

/* Üst progress bar */
.app-progress {
  position: fixed;
  top: 0; left: 0; right: 0;
  height: 3px;
  z-index: 9999;
  pointer-events: none;
  opacity: 0;
  transition: opacity .25s ease;
}
.app-progress.is-active { opacity: 1; }
.app-progress-bar {
  height: 100%;
  width: 0;
  background: linear-gradient(90deg, #ff6b35 0%, #ffa177 50%, #ff6b35 100%);
  background-size: 200% 100%;
  box-shadow: 0 0 10px rgba(255, 107, 53, 0.6), 0 0 4px rgba(255, 107, 53, 0.4);
  border-radius: 0 2px 2px 0;
  transition: width .35s cubic-bezier(0.22, 0.61, 0.36, 1);
  animation: app-progress-shimmer 1.5s linear infinite;
}
@keyframes app-progress-shimmer {
  0%   { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* Tam ekran overlay loader */
.app-loader {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.45);
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
  z-index: 9998;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  visibility: hidden;
  transition: opacity .2s ease, visibility .2s ease;
}
.app-loader.is-active {
  opacity: 1;
  visibility: visible;
}
.app-loader-box {
  background: #fff;
  border-radius: 14px;
  padding: 24px 32px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  box-shadow: 0 24px 48px -12px rgba(15, 23, 42, .3), 0 0 0 1px rgba(15, 23, 42, .05);
  transform: scale(.95);
  transition: transform .2s ease;
}
.app-loader.is-active .app-loader-box {
  transform: scale(1);
}
.app-loader-spinner {
  width: 44px;
  height: 44px;
  border: 3px solid #e2e8f0;
  border-top-color: #ff6b35;
  border-right-color: #ff6b35;
  border-radius: 50%;
  animation: app-spin 0.7s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite;
}
.app-loader-text {
  font-size: .875rem;
  font-weight: 600;
  color: #475569;
  letter-spacing: 0.01em;
}
@keyframes app-spin {
  to { transform: rotate(360deg); }
}

/* Buton içi inline spinner (data-loader bootstrap için ekstra) */
.app-spinner {
  display: inline-block;
  width: 16px; height: 16px;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: app-spin .65s linear infinite;
  vertical-align: middle;
}

/* Loader açıkken arkadaki sayfa scroll kilitlensin */
body.app-loader-locked { overflow: hidden; }

/* ============ ÜRÜN AÇIKLAMASI + TEKNİK ÖZELLİKLER (2026-10-20) — urun.php · içerik panelden ("Ürün Açıklamaları") ============ */
.urun-bilgi { background: #ffffff; border: 1px solid #e2e8f0; border-radius: 1rem; overflow: hidden; }
.urun-bilgi-sekmeler { display: flex; gap: .25rem; padding: 0 1rem; background: #f8fafc; border-bottom: 1px solid #e2e8f0; overflow-x: auto; }
.urun-bilgi-sekmeler button { margin-bottom: -1px; padding: .9rem .9rem; font-size: .9rem; font-weight: 600; color: #64748b; white-space: nowrap; background: none; border: 0; border-bottom: 2px solid transparent; cursor: pointer; }
.urun-bilgi-sekmeler button:hover { color: #0f172a; }
.urun-bilgi-sekmeler button.secili { color: #0f172a; border-bottom-color: rgb(237 84 36); }
.urun-bilgi-govde { padding: 1.25rem 1.5rem 1.5rem; }
.urun-bilgi-govde[hidden] { display: none; }
.urun-bilgi-aciklama { font-size: .925rem; line-height: 1.7; color: #334155; overflow-wrap: anywhere; }
.urun-bilgi-aciklama > :first-child { margin-top: 0; }
.urun-bilgi-aciklama > :last-child { margin-bottom: 0; }
.urun-bilgi-aciklama p { margin: 0 0 .75rem; }
.urun-bilgi-aciklama h2, .urun-bilgi-aciklama h3, .urun-bilgi-aciklama h4 { margin: 1.25rem 0 .5rem; font-weight: 700; line-height: 1.3; color: #0f172a; }
.urun-bilgi-aciklama h2 { font-size: 1.15rem; } .urun-bilgi-aciklama h3 { font-size: 1.05rem; } .urun-bilgi-aciklama h4 { font-size: .95rem; }
.urun-bilgi-aciklama ul, .urun-bilgi-aciklama ol { margin: 0 0 .75rem; padding-left: 1.4rem; }
.urun-bilgi-aciklama ul { list-style: disc; } .urun-bilgi-aciklama ol { list-style: decimal; }
.urun-bilgi-aciklama li { margin: .25rem 0; list-style: inherit; }
.urun-bilgi-aciklama a { color: rgb(237 84 36); text-decoration: underline; }
.urun-bilgi-aciklama strong, .urun-bilgi-aciklama b { font-weight: 700; color: #0f172a; }
.urun-bilgi-aciklama blockquote { margin: 0 0 .75rem; padding: .6rem 1rem; color: #475569; background: #f8fafc; border-left: 3px solid rgb(237 84 36); border-radius: .375rem; }
.urun-bilgi-aciklama hr { margin: 1rem 0; border: 0; border-top: 1px solid #e2e8f0; }
.urun-bilgi-aciklama table { width: 100%; margin: 0 0 .75rem; border-collapse: collapse; font-size: .875rem; }
.urun-bilgi-aciklama th, .urun-bilgi-aciklama td { padding: .5rem .65rem; text-align: left; vertical-align: top; border: 1px solid #e2e8f0; }
.urun-bilgi-aciklama th { font-weight: 600; background: #f8fafc; }
.urun-bilgi-tablo { width: 100%; font-size: .9rem; border-collapse: collapse; }
.urun-bilgi-tablo th, .urun-bilgi-tablo td { padding: .7rem 0; text-align: left; vertical-align: top; border-bottom: 1px solid #f1f5f9; }
.urun-bilgi-tablo th { width: 38%; padding-right: 1rem; font-weight: 500; color: #64748b; }
.urun-bilgi-tablo td { font-weight: 600; color: #0f172a; overflow-wrap: anywhere; }
.urun-bilgi-tablo tr.ara th { width: auto; padding-top: 1.1rem; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: #0f172a; }