/* ========================================================= */
/* ANA CSS DOSYASI (YÖNETİCİ)                                */
/* ========================================================= */

/* 1. Fontları Yükle (EN ÜSTTE OLMALI) */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap');

/* 2. Değişkenleri Yükle (RENKLER BURADAN GELECEK) */
@import "css/variables.css";

/* 3. Diğer Stilleri Yükle */
@import "css/login.css";
@import "css/register.css";
@import "css/general.css";

/* 4. HTML ve BODY Ayarları (Fontu burada zorluyoruz) */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html, body {
    /* Poppins fontunu zorla uygula */
    font-family: 'Poppins', sans-serif !important;
    /* Variables.css'den gelen arka plan rengini uygula */
    background-color: var(--color-bg-page);
    color: var(--color-text-primary);
    height: 100%;
    width: 100%;
    overflow: hidden; /* Scrollbar sorunlarını önlemek için */
}

/* 5. iOS Select Box Düzeltmesi (Mevcut yapını koruyoruz) */
.form-select {
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    padding-left: 2.8rem !important;
    padding-right: 2rem !important;
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 0.75rem center;
    background-size: 16px 12px;
}

.dark .form-select {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23F9FAFB' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='M2 5l6 6 6-6'/%3e%3c/svg%3e");
    background-color: var(--color-bg-input);
    color: var(--color-text-primary);
}

/* ===================================================================
   PANEL / POPUP KAPATMA DUGMELERI  (global, kapsamsiz)

   Bu siniflarin HICBIR CSS kurali yoktu; tarayicinin varsayilan gri
   cerceveli butonu ciziliyordu. Yonetim ekranlarindaki 18 panel ve POS
   popuplarindaki 6 dugme bundan etkileniyordu.

   Kapsamsiz oldugu icin bir bilesen kendi .razor.css dosyasinda ayni
   sinifi tanimlarsa o kazanir (Blazor kapsamli seciciye [b-xxxxx]
   ekledigi icin ozgullugu daha yuksektir) - mevcut tasarimlar bozulmaz.

   Dokunmatik POS icin en az 36x36 hedef; oncesinde tiklanabilir alan
   yalnizca "x" glifi kadardi.
   =================================================================== */
.close-button,
.popup-close-btn,
.pp-close-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    padding: 0;
    background: none;
    border: none;
    border-radius: 6px;
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    color: var(--color-text-placeholder, #9CA3AF);
    transition: background-color 0.15s ease, color 0.15s ease;
}

    .close-button:hover,
    .popup-close-btn:hover,
    .pp-close-btn:hover {
        background-color: var(--color-bg-input, rgba(127, 127, 127, 0.15));
        color: var(--color-text-primary, #1F2937);
    }

    .close-button:focus-visible,
    .popup-close-btn:focus-visible,
    .pp-close-btn:focus-visible {
        outline: 2px solid var(--color-primary, #f97316);
        outline-offset: 2px;
    }

/* Girdi icindeki "temizle" dugmesi (kapatma degil, alani sifirlar).
   Bunun da CSS kurali yoktu; varsayilan gri buton kutusu cikiyordu. */
.edit-item-clear-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    padding: 0;
    background: none;
    border: none;
    border-radius: 50%;
    font-size: 1.25rem;
    line-height: 1;
    cursor: pointer;
    color: var(--color-text-placeholder, #9CA3AF);
    transition: background-color 0.15s ease, color 0.15s ease;
}

    .edit-item-clear-btn:hover {
        background-color: var(--color-bg-input, rgba(127, 127, 127, 0.15));
        color: var(--color-text-primary, #1F2937);
    }