/* =============================================
   D1FFERENCE Panel - Shared Styles v6.0.0
   ============================================= */

/* Base */
body {
    font-family: 'Inter', sans-serif;
}

/* Product UI v1 — stok sayfasını temel alan ortak sayfa kabuğu */
.ui-page-shell {
    background: rgb(255 255 255 / .95) !important;
    border-bottom: 1px solid rgb(226 232 240) !important;
    box-shadow: 0 1px 3px rgb(15 23 42 / .06) !important;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
}

.dark .ui-page-shell { background: rgb(31 41 55 / .95) !important; border-color: rgb(71 85 105) !important; }

.ui-page-header { min-height: 4.25rem !important; height: auto !important; background: transparent; }
.ui-page-header-inner { min-height: 4.25rem; }
.ui-page-heading { display: flex; min-width: 0; align-items: center; gap: .65rem; }
.ui-page-icon { display: grid; width: 2.25rem; height: 2.25rem; flex: 0 0 auto; place-items: center; border-radius: .75rem; background: rgb(239 246 255); color: rgb(37 99 235); }
.ui-page-icon.is-rose { background: rgb(255 241 242); color: rgb(225 29 72); }
.ui-page-icon.is-amber { background: rgb(255 251 235); color: rgb(217 119 6); }
.ui-page-icon.is-indigo { background: rgb(238 242 255); color: rgb(79 70 229); }
.ui-page-title { color: rgb(17 24 39); font-size: 1rem !important; font-weight: 800 !important; line-height: 1.25rem; letter-spacing: -.015em; }
.dark .ui-page-title { color: white; }
.ui-page-subtitle { margin-top: .1rem; color: rgb(107 114 128); font-size: .6875rem; line-height: 1rem; }
.ui-page-actions { display: flex; align-items: center; gap: .5rem; }
.ui-page-icon-button { display: grid; width: 2.25rem; height: 2.25rem; place-items: center; border-radius: .65rem; color: rgb(107 114 128); transition: background-color .15s ease, color .15s ease; }
.ui-page-icon-button:hover { background: rgb(243 244 246); color: rgb(37 99 235); }
.ui-page-toolbar { padding-top: .7rem !important; padding-bottom: .7rem !important; background: rgb(248 250 252 / .86) !important; }
.dark .ui-page-toolbar { background: rgb(15 23 42 / .28) !important; }
.ui-stat-chip { display: inline-flex; min-height: 2.4rem; align-items: center; gap: .35rem; border: 1px solid rgb(226 232 240) !important; border-radius: .7rem !important; padding: .45rem .7rem !important; background: white !important; box-shadow: 0 1px 2px rgb(15 23 42 / .03); }
.dark .ui-stat-chip { border-color: rgb(71 85 105) !important; background: rgb(31 41 55) !important; }
.ui-page-toolbar :is(input[type="text"], input[type="date"], select) { min-height: 2.4rem; border-color: rgb(203 213 225) !important; border-radius: .7rem !important; font-size: .75rem; }
.ui-page-toolbar :is(input[type="text"], input[type="date"], select):focus { border-color: rgb(59 130 246) !important; outline: none; box-shadow: 0 0 0 3px rgb(147 197 253 / .25); }
.ui-content-card { overflow: hidden; border: 1px solid rgb(226 232 240) !important; border-radius: .9rem !important; background: white; box-shadow: 0 1px 3px rgb(15 23 42 / .05) !important; }
.dark .ui-content-card { border-color: rgb(71 85 105) !important; background: rgb(31 41 55); }

@media (max-width: 640px) {
    .ui-page-header { min-height: 3.75rem !important; }
    .ui-page-header-inner { min-height: 3.75rem; padding-left: 3.25rem !important; padding-right: .75rem !important; }
    .ui-page-icon { width: 2rem; height: 2rem; }
    .ui-page-subtitle { display: none; }
    .ui-page-toolbar { padding: .55rem .65rem !important; }
    .ui-page-toolbar > div { gap: .45rem !important; }
    .ui-stat-chip { min-height: 2.1rem; padding: .35rem .55rem !important; }
}

/* Sayfa taban rengi — Tailwind CDN async yüklenir; bu olmadan her sayfa
   geçişinde beyaz flash görünür. Tailwind'in bg-gray-50 / dark:bg-gray-900
   renkleriyle eşleşir, böylece geçiş düz olur. */
html { background: #f9fafb; }
html.dark { background: #111827; }

/* Scrollbar */
::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: #cbd5e1;
    border-radius: 3px;
}

.dark ::-webkit-scrollbar-thumb {
    background: #475569;
}

/* No Scrollbar Utility */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Sidebar alanını ÖNCEDEN rezerve et — shared.js sidebar'ı body sonunda enjekte
   ediyor; boş #sidebar-container 0 genişlikteydi, dolunca içerik yatay kayıyordu
   (layout shift). Head'deki bu kuralla genişlik ilk boyamadan itibaren ayrılır.
   Collapsed durumda :has() ile daralır → boşluk kalmaz. */
#sidebar-container {
    flex-shrink: 0;
    width: 16rem;
    transition: width 0.3s ease;
}
#sidebar-container:has(aside.sidebar-collapsed) {
    width: 4.5rem;
}
@media (max-width: 768px) {
    #live-ticker-bar,
    .live-ticker-bar {
        display: none !important;
    }

    body.has-live-ticker {
        padding-bottom: 0 !important;
    }

    #mobile-menu-btn {
        top: max(0.5rem, env(safe-area-inset-top));
        left: max(0.5rem, env(safe-area-inset-left));
        transition: left 0.3s ease, transform 0.15s ease;
    }

    #mobile-menu-btn.is-open {
        left: calc(16rem - 2.75rem);
    }

    #sidebar-container .sidebar-header > button {
        display: none !important;
    }

    #sidebar-container aside {
        height: 100dvh !important;
        max-height: 100dvh;
        min-height: 0;
    }

    #sidebar-container aside > nav {
        min-height: 0;
        overscroll-behavior: contain;
        -webkit-overflow-scrolling: touch;
    }

    #sidebar-user-info {
        position: relative;
        z-index: 2;
        flex-shrink: 0;
        background: white;
    }

    #sidebar-user-info > div {
        padding-bottom: max(.85rem, env(safe-area-inset-bottom)) !important;
    }

    .dark #sidebar-user-info { background: #1f2937; }

    #mobile-menu-btn .menu-icon {
        position: relative;
        display: block;
        width: 1.35rem;
        height: 1rem;
    }

    #mobile-menu-btn .menu-icon span {
        position: absolute;
        left: 0;
        width: 100%;
        height: 2px;
        border-radius: 999px;
        background: currentColor;
        transform-origin: center;
        transition: top .25s ease, transform .25s ease, opacity .18s ease, width .25s ease;
    }

    #mobile-menu-btn .menu-icon span:nth-child(1) { top: 0; }
    #mobile-menu-btn .menu-icon span:nth-child(2) { top: 7px; width: 78%; }
    #mobile-menu-btn .menu-icon span:nth-child(3) { top: 14px; width: 55%; }
    #mobile-menu-btn.is-open .menu-icon span:nth-child(1) { top: 7px; width: 100%; transform: rotate(45deg); }
    #mobile-menu-btn.is-open .menu-icon span:nth-child(2) { opacity: 0; transform: scaleX(0); }
    #mobile-menu-btn.is-open .menu-icon span:nth-child(3) { top: 7px; width: 100%; transform: rotate(-45deg); }

    @media (prefers-reduced-motion: reduce) {
        #mobile-menu-btn,
        #mobile-menu-btn .menu-icon span { transition: none; }
    }

    /* Mobilde sidebar off-canvas (position:fixed) → yer kaplamamalı */
    #sidebar-container { width: 0; }
}

/* Sidebar Text (for collapse animation) */
.sidebar-collapsed .sidebar-text {
    opacity: 0;
    width: 0;
    overflow: hidden;
}

/* Sidebar collapsed state */
.sidebar-collapsed {
    width: 4.5rem !important;
    /* aside'ta inline style="min-width:16rem" var → collapse'i kilitliyordu.
       !important ile ezilmezse genişlik 16rem'de takılı kalır, aside taşar. */
    min-width: 4.5rem !important;
}

.sidebar-collapsed .sidebar-nav-text {
    display: none;
}

.sidebar-collapsed .sidebar-logo-text {
    display: none;
}

.sidebar-collapsed .sidebar-user-info {
    display: none;
}

.sidebar-collapsed .sidebar-submenu {
    display: none !important;
}

/* Daraltılınca logo gizlenir → daralt/genişlet butonu tek başına ortalansın */
.sidebar-collapsed .sidebar-header {
    justify-content: center;
    padding-left: 0;
    padding-right: 0;
}

/* Toast Notification */
.toast-enter {
    transform: translateY(0) !important;
    opacity: 1 !important;
}

/* Connection Status Dot */
.ws-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.3s;
}

.ws-status-dot.connected {
    background-color: #22c55e;
    box-shadow: 0 0 6px rgba(34, 197, 94, 0.5);
    animation: pulse-green 2s ease-in-out infinite;
}

.ws-status-dot.disconnected {
    background-color: #ef4444;
}

.ws-status-dot.connecting {
    background-color: #f59e0b;
    animation: pulse-amber 1s ease-in-out infinite;
}

@keyframes pulse-green {

    0%,
    100% {
        box-shadow: 0 0 4px rgba(34, 197, 94, 0.3);
    }

    50% {
        box-shadow: 0 0 10px rgba(34, 197, 94, 0.6);
    }
}

@keyframes pulse-amber {

    0%,
    100% {
        opacity: 0.5;
    }

    50% {
        opacity: 1;
    }
}

/* Order Detail Modal Overlay */
.modal-overlay {
    background: rgba(0, 0, 0, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}

/* Product UI v1 — sayfalar arasında tekrar kullanılabilir pencere dili */
.ui-modal {
    padding: 1rem;
    background: rgb(15 23 42 / 0.48) !important;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    animation: ui-modal-fade-in .16s ease-out;
}

.ui-modal > .ui-modal-panel {
    overflow: hidden;
    border: 1px solid rgb(226 232 240);
    border-radius: 1rem !important;
    background: #fff;
    box-shadow: 0 24px 70px rgb(15 23 42 / .25) !important;
    animation: ui-modal-rise-in .2s ease-out;
}

.dark .ui-modal > .ui-modal-panel {
    border-color: rgb(71 85 105);
    background: rgb(31 41 55);
}

.ui-modal-header {
    min-height: 4.5rem;
    padding: 1rem 1.25rem !important;
    background: linear-gradient(180deg, rgb(248 250 252), rgb(255 255 255));
}

.dark .ui-modal-header {
    background: linear-gradient(180deg, rgb(51 65 85 / .72), rgb(31 41 55));
}

.ui-modal-header h3 {
    font-size: 1rem !important;
    font-weight: 800 !important;
    letter-spacing: -.015em;
}

.ui-modal-header h3 > i:first-child {
    display: inline-grid;
    width: 2rem;
    height: 2rem;
    margin-right: .35rem;
    place-items: center;
    border-radius: .65rem;
    background: rgb(239 246 255);
    color: rgb(37 99 235) !important;
    vertical-align: middle;
}

.dark .ui-modal-header h3 > i:first-child {
    background: rgb(30 58 138 / .35);
    color: rgb(147 197 253) !important;
}

.ui-modal-toolbar {
    gap: .65rem !important;
    padding: .75rem 1.25rem !important;
    background: rgb(248 250 252 / .82);
}

.dark .ui-modal-toolbar { background: rgb(15 23 42 / .25); }

.ui-modal :is(input[type="text"], input[type="number"], input[type="date"], select) {
    min-height: 2.4rem;
    border-color: rgb(203 213 225) !important;
    border-radius: .7rem !important;
    padding: .45rem .7rem !important;
    font-size: .75rem;
    outline: none;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

.ui-modal :is(input[type="text"], input[type="number"], input[type="date"], select):focus {
    border-color: rgb(59 130 246) !important;
    box-shadow: 0 0 0 3px rgb(147 197 253 / .28);
}

.ui-modal input[type="checkbox"],
.ui-modal input[type="radio"] {
    accent-color: rgb(37 99 235);
}

.ui-modal-footer {
    min-height: 4rem;
    gap: .5rem !important;
    padding: .75rem 1.25rem !important;
    background: rgb(248 250 252 / .86);
}

.dark .ui-modal-footer { background: rgb(15 23 42 / .25); }

.ui-modal button[class*="px-"] {
    min-height: 2.4rem;
    border-radius: .7rem !important;
    font-size: .75rem;
    font-weight: 700;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease, transform .15s ease, box-shadow .15s ease;
}

.ui-modal button[class*="px-"]:active { transform: translateY(1px); }
.ui-modal button:focus-visible { outline: 3px solid rgb(147 197 253 / .52); outline-offset: 2px; }

@keyframes ui-modal-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes ui-modal-rise-in { from { opacity: 0; transform: translateY(8px) scale(.99); } to { opacity: 1; transform: translateY(0) scale(1); } }

@media (max-width: 640px) {
    .ui-modal { align-items: flex-end !important; padding: .5rem !important; }
    .ui-modal > .ui-modal-panel {
        width: 100% !important;
        max-width: none !important;
        max-height: calc(100dvh - .5rem) !important;
        margin: 0 !important;
        border-radius: 1rem 1rem .5rem .5rem !important;
    }
    .ui-modal-header { min-height: 4rem; padding: .85rem 1rem !important; }
    .ui-modal-toolbar { align-items: stretch !important; padding: .65rem 1rem !important; }
    .ui-modal-toolbar > :is(input[type="text"], select) { width: 100% !important; margin-left: 0 !important; }
    .ui-modal-footer { padding: .65rem 1rem max(.65rem, env(safe-area-inset-bottom)) !important; }
    .ui-modal-footer button[class*="px-"] { flex: 1 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
    .ui-modal,
    .ui-modal > .ui-modal-panel { animation: none; }
}

/* Sağdan açılan detay panelleri */
.ui-drawer .modal-overlay {
    background: rgb(15 23 42 / .46);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}

.ui-drawer-panel {
    border-left: 1px solid rgb(226 232 240);
    background: white;
    box-shadow: -24px 0 70px rgb(15 23 42 / .2) !important;
}

.dark .ui-drawer-panel { border-color: rgb(71 85 105); background: rgb(31 41 55); }

.ui-drawer-header {
    min-height: 4.5rem;
    background: rgb(255 255 255 / .94) !important;
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.dark .ui-drawer-header { background: rgb(31 41 55 / .94) !important; }

.ui-drawer-header h2 { font-size: 1rem !important; font-weight: 800 !important; letter-spacing: -.015em; }
.ui-drawer-header h2 > i:first-child { display: grid; width: 2rem; height: 2rem; place-items: center; border-radius: .65rem; background: rgb(238 242 255); }

@media (max-width: 640px) {
    .ui-drawer-panel { width: 100% !important; border-left: 0; }
    .ui-drawer-header { min-height: 4rem; padding: .75rem 1rem !important; }
}

/* Timeline Component */
.timeline-step {
    position: relative;
    padding-left: 2rem;
}

.timeline-step::before {
    content: '';
    position: absolute;
    left: 0.45rem;
    top: 1.5rem;
    bottom: -0.5rem;
    width: 2px;
    background: #e2e8f0;
}

.timeline-step:last-child::before {
    display: none;
}

.dark .timeline-step::before {
    background: #475569;
}

.timeline-dot {
    position: absolute;
    left: 0;
    top: 0.25rem;
    width: 1rem;
    height: 1rem;
    border-radius: 50%;
    border: 2px solid #e2e8f0;
    background: white;
    z-index: 1;
}

.dark .timeline-dot {
    border-color: #475569;
    background: #1f2937;
}

.timeline-dot.active {
    border-color: #6366f1;
    background: #6366f1;
}

.timeline-dot.completed {
    border-color: #22c55e;
    background: #22c55e;
}

/* Mobile Sidebar */
@media (max-width: 768px) {
    #sidebar-container aside {
        position: fixed;
        left: -100%;
        top: 0;
        bottom: 0;
        z-index: 50;
        width: 16rem !important;
        /* w-64 */
        transition: left 0.3s ease-in-out;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    }

    #sidebar-container aside.mobile-open {
        left: 0;
    }

    /* Overlay */
    .sidebar-overlay {
        position: fixed;
        inset: 0;
        background: rgba(0, 0, 0, 0.5);
        z-index: 45;
        backdrop-filter: blur(2px);
        opacity: 0;
        pointer-events: none;
        transition: opacity 0.3s;
    }

    .sidebar-overlay.active {
        opacity: 1;
        pointer-events: auto;
    }

    /* Hide desktop collapse logic on mobile */
    .sidebar-collapsed {
        width: 16rem !important;
    }
}

/* Print Styles */
@media print {
    .no-print {
        display: none !important;
    }

    body {
        background: white !important;
    }
}

/* =========================================================
   LIVE TICKER BAR — alt sabit canlı sipariş şeridi
   Tüm sayfalarda görünür (login/setup haric). WebSocket
   "order_received" event'inden besleniyor.
   ========================================================= */
.live-ticker-bar {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 36px;
    background: linear-gradient(to right, #0f172a, #1e293b);
    color: #fff;
    display: flex;
    align-items: center;
    z-index: 40;
    font-size: 12px;
    box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.35);
    transition: transform 0.3s ease;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}
.live-ticker-bar.collapsed { transform: translateY(28px); }
.live-ticker-label {
    background: #dc2626;
    color: #fff;
    padding: 0 12px;
    font-weight: 700;
    font-size: 11px;
    letter-spacing: 0.5px;
    display: flex;
    align-items: center;
    gap: 6px;
    height: 100%;
    flex-shrink: 0;
}
.live-ticker-dot {
    width: 7px; height: 7px;
    background: #fff;
    border-radius: 50%;
    animation: live-ticker-blink 1s infinite;
}
@keyframes live-ticker-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.25; }
}
.live-ticker-track-wrap {
    flex: 1;
    overflow: hidden;
    height: 100%;
    position: relative;
}
.live-ticker-track {
    display: inline-flex;
    align-items: center;
    gap: 28px;
    white-space: nowrap;
    height: 100%;
    padding-left: 100%;
    animation: live-ticker-scroll 50s linear infinite;
    will-change: transform;
}
.live-ticker-track:hover { animation-play-state: paused; }
@keyframes live-ticker-scroll {
    0% { transform: translateX(0); }
    100% { transform: translateX(-100%); }
}
.live-ticker-item {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0 6px;
    border-radius: 4px;
}
.live-ticker-item-new { animation: live-ticker-flash 2.5s ease-out; }
@keyframes live-ticker-flash {
    0% { background: rgba(34, 197, 94, 0.45); box-shadow: 0 0 12px rgba(34, 197, 94, 0.6); }
    100% { background: transparent; box-shadow: none; }
}
.live-ticker-pulse {
    width: 6px; height: 6px;
    background: #22c55e;
    border-radius: 50%;
    box-shadow: 0 0 6px #22c55e;
    flex-shrink: 0;
}
.live-ticker-time { color: #94a3b8; font-family: ui-monospace, monospace; }
.live-ticker-platform {
    padding: 2px 7px;
    border-radius: 4px;
    font-weight: 700;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 0.3px;
}
.live-ticker-platform-ty,
.live-ticker-platform-trendyol { background: #f97316; color: #fff; }
.live-ticker-platform-ty2 { background: #3b82f6; color: #fff; }
.live-ticker-platform-hepsiburada,
.live-ticker-platform-hb { background: #ea580c; color: #fff; }
.live-ticker-platform-n11 { background: #9333ea; color: #fff; }
.live-ticker-platform-flo { background: #ec4899; color: #fff; }
.live-ticker-platform-amazon { background: #f59e0b; color: #000; }
.live-ticker-text { color: #f1f5f9; font-weight: 600; }
.live-ticker-qty { color: #fca5a5; font-weight: 700; }
.live-ticker-placeholder { color: #64748b; font-style: italic; }
.live-ticker-close {
    background: transparent;
    color: #94a3b8;
    border: none;
    padding: 0 14px;
    cursor: pointer;
    height: 100%;
    font-size: 13px;
    transition: background 0.2s;
    flex-shrink: 0;
}
.live-ticker-close:hover { color: #fff; background: rgba(255, 255, 255, 0.08); }
body.has-live-ticker { padding-bottom: 40px !important; }

/* Ortak pazaryeri renk standardı */
.platform-badge { display:inline-flex; align-items:center; justify-content:center; padding:.18rem .48rem; border:1px solid transparent; border-radius:.42rem; font-size:.625rem; font-weight:800; line-height:1.1; white-space:nowrap; }
.platform-ty { background:#fff7ed; border-color:#fed7aa; color:#c2410c; }
.platform-ty2 { background:#eff6ff; border-color:#bfdbfe; color:#2563eb; }
.platform-hb { background:#fff1f2; border-color:#fecdd3; color:#e11d48; }
.platform-flo { background:#fdf2f8; border-color:#fbcfe8; color:#db2777; }
.platform-amazon { background:#fffbeb; border-color:#fde68a; color:#b45309; }
.platform-n11 { background:#f5f3ff; border-color:#ddd6fe; color:#7c3aed; }
.platform-other { background:#f8fafc; border-color:#e2e8f0; color:#64748b; }


/* ============================================================
   ENTIRIKA DİL KATMANI v1  (kaynak: _tasarim/index-bitmis.html)
   Ekleme niteliğinde: yeni --ent-* ad alanı + yeni bileşenler.
   Eski kurallara DOKUNMAZ. Panel düzeni: açık varsayılan + .dark
   ============================================================ */
:root{
  --ent-bg:#f8fafc; --ent-surface:#ffffff; --ent-raised:#f1f5f9; --ent-hover:#eef2f7;
  --ent-line:#e2e8f0; --ent-line-soft:#eaeff5;
  --ent-ink:#0f172a; --ent-muted:#64748b; --ent-faint:#94a3b8;
  --ent-brand:#6366f1; --ent-brand-strong:#4f46e5; --ent-brand-soft:rgb(99 102 241/.09);
  --ent-ok:#10b981; --ent-warn:#b45309; --ent-bad:#f43f5e; --ent-info:#3b82f6;
  --ent-r-ctl:8px; --ent-r-card:14px;
}
.dark{
  --ent-bg:#111827; --ent-surface:#1f2937; --ent-raised:#273244; --ent-hover:#2b3648;
  --ent-line:#374151; --ent-line-soft:#2c3849;
  --ent-ink:#f3f4f6; --ent-muted:#94a3b8; --ent-faint:#64748b;
  --ent-brand-soft:rgb(99 102 241/.13);
  --ent-warn:#f59e0b;
}

/* ---- PLATFORM MONOGRAMI v6: kutusuz wordmark ----
   Her platform kendi mini-logosu gibi yazılır; kimliği harf +
   imza detayı taşır (gülümseme, macenta top, üs işareti). */
.pm{
  position:relative;display:inline-flex;align-items:center;
  min-width:44px;font-family:'Nunito','Inter',sans-serif;font-size:12.5px;
  font-weight:900;color:var(--ent-ink);line-height:1;
}
.pm sup{font-size:8px;font-weight:900;margin-left:0;transform:translateY(-2px);letter-spacing:0}
.pm-ty,.pm-ty2{color:#f27a1a}
.pm-hb{color:#7c3aed}
.dark .pm-hb{color:#a06bf5}
.pm-n11::after{content:"";width:5px;height:5px;border-radius:50%;background:#e93ca8;margin-left:2.5px;align-self:flex-start}
.pm-flo{letter-spacing:.08em;font-size:11px}
.pm-amz,.pm-sf{padding-bottom:4px}
.pm-amz::after,.pm-sf::after{
  content:"";position:absolute;left:1px;bottom:0;height:5px;
  border-bottom:1.8px solid #ff9900;border-radius:0 0 55% 70%/0 0 100% 100%;
}
.pm-amz::after{width:29px}
.pm-sf::after{width:16px}
.pm.code{font-family:'Inter',sans-serif;color:var(--ent-faint);font-weight:600;letter-spacing:.04em;font-size:11px;min-width:40px}

/* ---- DURUM: yumuşak dolgulu pill ---- */
.st-pill{--stc:var(--ent-muted);display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:600;white-space:nowrap;
  color:var(--stc);background:color-mix(in srgb,var(--stc) 13%,transparent);border-radius:999px;padding:3px 10px}
.st-pill::before{content:"";width:5px;height:5px;border-radius:999px;background:var(--stc)}
.st-pill.ok{--stc:var(--ent-ok)}
.st-pill.warn{--stc:var(--ent-warn)}
.st-pill.bad{--stc:var(--ent-bad)}
.st-pill.info{--stc:var(--ent-info)}

/* ---- BORSA SAYACI (odometer) — entTickTo ile kullanılır ----
   Metrik kilidi şart: kapsayıcı .num-tick olmadan glifler kayar. */
.num-tick{font-variant-numeric:tabular-nums;transition:color .5s ease}
.num-tick.up-flash{color:#059669 !important;transition:color .12s ease}
.dark .num-tick.up-flash{color:#34d399 !important}
.num-tick.down-flash{color:#dc2626 !important;transition:color .12s ease}
.dark .num-tick.down-flash{color:#f87171 !important}
@media(prefers-reduced-motion:reduce){}

/* altyapi rozeti — yalniz ENT_INFRA_BADGE=true kiracilarda render edilir */
.ent-by{font-size:10.5px;color:var(--ent-faint);margin-top:2px}
.ent-by b{color:#818cf8;font-weight:600}

/* daktilo imleci (selamlama) */
.ent-caret{display:inline-block;width:2px;height:14px;background:var(--ent-brand);margin-left:3px;vertical-align:-2px;animation:ent-blink 1s steps(1) infinite}
@keyframes ent-blink{50%{opacity:0}}
.ent-caret.off{display:none}

/* ============ ENT RAIL: kenar cubugu her iki temada koyu ============
   Tailwind utility'leri kapsam icinde ele gecirilir; ikon renklerine
   (text-emerald-500 vb.) DOKUNULMAZ — sicaklik onlardan gelir. */
.ent-rail{background:#0d1420 !important;border-color:#1b2432 !important}
.ent-rail .sidebar-header{border-color:#1b2432 !important}
.ent-rail .border-gray-200{border-color:#1b2432 !important}
.ent-rail .border-gray-100,.ent-rail .border-gray-300{border-color:#1b2432 !important}
.ent-rail .text-gray-700{color:#a3b0c6 !important}
.ent-rail .text-gray-600{color:#a3b0c6 !important}
.ent-rail .text-gray-500{color:#8b98ad !important}
.ent-rail .text-gray-400{color:#5a677e !important}
.ent-rail .bg-gray-50{background:#111a29 !important}
.ent-rail .bg-gray-200{background:#111a29 !important;border-color:#243040 !important;color:#8b98ad !important}
.ent-rail nav a:hover,.ent-rail nav button:hover,.ent-rail .hover\:bg-gray-100:hover,.ent-rail .hover\:bg-indigo-50:hover{background:#151e2e !important}
.ent-rail #gs-sidebar-trigger:hover{background:#151e2e !important;border-color:#2a3a52 !important}
/* aktif link: koyu zeminde indigo cam */
.ent-rail .bg-indigo-50{background:rgb(99 102 241 / .16) !important}
.ent-rail .text-indigo-700{color:#c7d2fe !important}
.ent-rail .text-indigo-600{color:#a5b4fc !important}
/* kullanici blogu ve genel beyaz kutular */
.ent-rail .bg-white{background:#0d1420 !important}
.ent-rail .text-gray-800,.ent-rail .text-gray-900{color:#e2e8f0 !important}

/* ============ KPI ikon balonu + kart basligi cipi ============ */
.kpi-ic{--k:#6366f1;width:22px;height:22px;display:inline-grid;place-items:center;border-radius:7px;
  background:color-mix(in srgb,var(--k) 15%,transparent);color:var(--k);font-size:10px;flex:0 0 auto}
.hd-ic{--h:#6366f1;width:24px;height:24px;display:inline-grid;place-items:center;border-radius:7px;
  background:color-mix(in srgb,var(--h) 14%,transparent);color:var(--h);font-size:11px;margin-right:8px;vertical-align:-6px}

/* kiraci vurgu noktasi (marka yazisi beyaz kalir) */
.ent-brand-dot{display:inline-block;width:7px;height:7px;border-radius:999px;margin-left:7px;vertical-align:2px}

/* tema dalgasi: ozel clip-path animasyonu devralir */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}::view-transition-new(root){z-index:2}
/* pay bari: soldan dolar (dashboard + diger sayfalarda yeniden kullanilabilir) */
.ent-bar{transform-origin:left;transform:scaleX(0);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.ent-bar.dolu{transform:scaleX(1)}
/* basma hissi: yalniz belirgin eylem butonlari */
.ent-press{transition:transform .12s ease}
.ent-press:active{transform:scale(.96)}

/* KPI rakamlari HER ZAMAN tabular: num-tick sonradan eklendiginde
   genislik oynamasin (olculen fark 1.73px). */
.metric-value{font-variant-numeric:tabular-nums}

/* yeni siparis satiri: yukaridan kayarak girer + yesil parlar; iptal kirmizi */
tr.ent-fresh{animation:ent-rowin .45s cubic-bezier(.2,.7,.2,1)}
tr.ent-fresh td{animation:ent-rowglow 3s ease .1s}
tr.ent-fresh-bad{animation:ent-rowin .45s cubic-bezier(.2,.7,.2,1)}
tr.ent-fresh-bad td{animation:ent-rowglow-bad 3s ease .1s}
@keyframes ent-rowin{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:none}}
@keyframes ent-rowglow{0%{background:rgb(16 185 129/.16)}100%{background:transparent}}
@keyframes ent-rowglow-bad{0%{background:rgb(244 63 94/.15)}100%{background:transparent}}
@media(prefers-reduced-motion:reduce){
  tr.ent-fresh,tr.ent-fresh td,tr.ent-fresh-bad,tr.ent-fresh-bad td{animation:none}
}

/* ===== CANLI HAREKETLER (akis) — dil icinde ===== */
.ent-feed{position:relative;overflow:hidden;background:var(--ent-surface);
  border:1px solid var(--ent-line);border-left:3px solid var(--ent-ok);
  border-radius:10px;padding:9px 11px;cursor:pointer;
  transition:background-color .15s ease,border-color .15s ease}
.ent-feed:hover{background:var(--ent-hover)}
.ent-feed.bad{border-left-color:var(--ent-bad)}
.ent-feed .ust{display:flex;align-items:center;gap:8px;margin-bottom:5px}
.ent-feed .no{font-size:11px;color:var(--ent-muted);font-variant-numeric:tabular-nums}
.ent-feed .zaman{margin-left:auto;font-size:10.5px;color:var(--ent-faint);white-space:nowrap;
  font-variant-numeric:tabular-nums}
.ent-feed .satir{display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-size:11.5px;color:var(--ent-muted);min-width:0}
.ent-feed .satir .ad{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ent-feed .satir .adet{flex:0 0 auto;font-weight:600;color:var(--ent-ink);
  font-variant-numeric:tabular-nums}
.ent-feed .fazla{margin-top:3px;font-size:10.5px;color:var(--ent-faint)}
/* yeni dusen kayit: kayarak girer + bir kez parlar */
.ent-feed.yeni{animation:ent-feedin .45s cubic-bezier(.2,.7,.2,1)}
.ent-feed.yeni::after{content:"";position:absolute;inset:0;pointer-events:none;
  animation:ent-feedglow 2.6s ease forwards}
.ent-feed.bad.yeni::after{animation-name:ent-feedglow-bad}
@keyframes ent-feedin{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes ent-feedglow{0%{background:rgb(16 185 129/.15)}100%{background:transparent}}
@keyframes ent-feedglow-bad{0%{background:rgb(244 63 94/.15)}100%{background:transparent}}
/* bos akis */
.ent-feed-bos{padding:26px 12px;text-align:center}
.ent-feed-bos .hd-ic{--h:var(--ent-faint);margin:0 auto 9px;display:grid;width:30px;height:30px;font-size:13px}
.ent-feed-bos .baslik{font-size:12.5px;font-weight:700;color:var(--ent-muted)}
.ent-feed-bos .alt{margin-top:3px;font-size:10.5px;color:var(--ent-faint)}
@media(prefers-reduced-motion:reduce){
  .ent-feed.yeni,.ent-feed.yeni::after{animation:none}
}

/* tabular rakam yardimcisi: tutar/tarih/sipariş no kolonlari hizali kalir */
.ent-tnum{font-variant-numeric:tabular-nums}

/* ikon cipi: BOYUT cagri yerinden gelir (Tailwind genislik-yukseklik siniflari
   ile catismaz), renk --h ile verilir, koyu temada --hd tonuna acilir. */
.ent-ic{--h:#6366f1;background:color-mix(in srgb,var(--h) 14%,transparent);color:var(--h)}
.dark .ent-ic{background:color-mix(in srgb,var(--hd,var(--h)) 22%,transparent);color:var(--hd,var(--h))}
