/* ============================================================
   1. GENEL AYARLAR & FONTLAR
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');

body, h1, h2, h3, h4, h5, h6, p, a, span, li, button, input, select, textarea, div {
    font-family: 'Poppins', sans-serif !important;
}

/* İkon Fontlarını Koru */
.fa, .fas, .far, .fab, .glyphicon, .material-icons, i {
    font-family: FontAwesome !important;
}

/* ============================================================
   2. ARAMA ÇUBUĞU (SEARCH BAR) - "BEYAZ HAP" MODU
   ============================================================ */
/* Önce eski stilleri temizle */
#search, #search input, #search button, .search-button, .input-group, .input-group-btn {
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: none !important;
}

/* ANA KAPSAYICI (WRAPPER) */
#search {
    background-color: #ffffff !important; /* Arka plan BEYAZ */
    border-radius: 50px !important;       /* Tam yuvarlak */
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    height: 50px !important;              /* Yükseklik biraz artırıldı */
    width: 100% !important;
    /* Modern yumuşak gölge */
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important; 
    position: relative !important;
    z-index: 99 !important;
    overflow: hidden !important; /* ÖNEMLİ: İçerik taşarsa köşeleri bozmasın */
    border: 2px solid #ffffff !important; /* Kenarlarda pürüz kalmaması için */
}

/* INPUT ALANI (YAZI) */
#search input, .search-input, input[name="search"] {
    background: transparent !important;
    border: none !important;
    height: 100% !important;
    width: 100% !important;
    padding-left: 25px !important;  /* Soldan boşluk */
    padding-right: 60px !important; /* Butonun altında kalmasın */
    color: #333 !important;
    font-size: 14px !important;
    font-weight: 500 !important;
}

/* Placeholder (İpucu Yazısı) Rengi */
#search input::placeholder {
    color: #aaa !important;
    opacity: 1 !important;
}

/* ARAMA BUTONU KAPSAYICISI */
#search .input-group-btn {
    position: absolute !important;
    right: 5px !important; /* Sağdan hafif boşluk */
    top: 50% !important;
    transform: translateY(-50%) !important; /* Dikey ortalama */
    height: 40px !important;
    width: 40px !important;
    z-index: 100 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

/* ARAMA BUTONU (İKON) */
#search button, .search-button {
    background: #222 !important; /* Butona koyu arka plan (Opsiyonel) */
    color: #fff !important;      /* İkon beyaz */
    font-size: 16px !important;
    padding: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    height: 100% !important;
    border-radius: 50% !important; /* Butonu da yuvarlak yap */
    cursor: pointer !important;
    transition: all 0.3s ease !important;
}

/* Buton Hover Efekti */
#search button:hover {
    background: #000 !important;
    transform: scale(1.05);
}

/* ============================================================
   3. SOL MENÜ, PANELLER VE MODÜLLER
   ============================================================ */
/* Panel Başlıkları */
div[class*="heading"], .box-heading, .panel-heading {
    background: transparent !important;
    color: #222 !important;
    font-weight: 600 !important;
    border-bottom: 1px solid #eee !important;
    padding: 15px 0 !important;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

/* Panel Kutuları */
.box, .panel, .module {
    background: #fff !important;
    /* Daha modern, dağılan gölge */
    box-shadow: 0 10px 30px rgba(0,0,0,0.05) !important; 
    border-radius: 12px !important; /* Senin görseldeki 10px'e yakın ama daha yumuşak */
    margin-bottom: 30px !important;
    padding: 20px !important;
    border: none !important;
}

/* Genel Butonlar ve Resimler */
.btn, select, .product-thumb, img {
    border-radius: 8px !important;
}