/* ============================================================
   ui-transitions.css
   Arayuz gecis yumusakligi - global mikro-etkilesim katmani.

   Kurallar:
   - "transition: all" ve "*" seciciden kacinilir (repaint maliyeti).
     Sadece tiklanabilir ogelere, sadece ucuz property'lere verilir.
   - Animasyon icin transform/opacity tercih edilir (GPU).
   - Mevcut transition'i olan ogeler (.grid-btn, .second.hero-card,
     navbar/dropdown) bilerek disarida birakilmistir.

   BOLUM 1 - Ortak temel   : her layout'ta calisir
   BOLUM 2 - Admin paneli  : .table100, .excel-filter-*, .hero-*
   BOLUM 3 - Guest tarafi  : (henuz bos - admin onaylandiktan sonra)
   ============================================================ */

:root {
    --ui-ease: cubic-bezier(0.4, 0, 0.2, 1);      /* dogal yavaslama */
    --ui-ease-bounce: cubic-bezier(0.34, 1.56, 0.64, 1); /* hafif zipla */
    --ui-dur-fast: 0.18s;  /* buton gibi sik tiklanan ogeler */
    --ui-dur: 0.3s;        /* kart, panel gibi buyuk ogeler */
    --ui-gold: #b5a479;    /* admin tema rengi */
}

/* ============================================================
   BOLUM 1 - ORTAK TEMEL
   ============================================================ */

/* Tiklanabilir ogelerde renk/golge gecisleri */
a,
button,
.btn,
.badge,
.page-link,
.list-group-item,
input,
select,
textarea,
label {
    transition: color var(--ui-dur-fast) var(--ui-ease),
                background-color var(--ui-dur-fast) var(--ui-ease),
                border-color var(--ui-dur-fast) var(--ui-ease),
                box-shadow var(--ui-dur-fast) var(--ui-ease),
                opacity var(--ui-dur-fast) var(--ui-ease);
}

/* Butonlarda kalkma + basma hissi */
.btn {
    transition: color var(--ui-dur-fast) var(--ui-ease),
                background-color var(--ui-dur-fast) var(--ui-ease),
                border-color var(--ui-dur-fast) var(--ui-ease),
                box-shadow var(--ui-dur-fast) var(--ui-ease),
                transform var(--ui-dur-fast) var(--ui-ease-bounce);
}

.btn:hover:not(:disabled):not(.disabled) {
    transform: translateY(-2px);
}

.btn:active:not(:disabled):not(.disabled) {
    transform: translateY(0) scale(0.97);
}

/* Buton icindeki ikon hafifce buyusun */
.btn > i {
    transition: transform var(--ui-dur-fast) var(--ui-ease-bounce);
}

.btn:hover > i {
    transform: scale(1.12);
}

/* Form odak halkasi - tema rengiyle */
input:focus,
select:focus,
textarea:focus {
    box-shadow: 0 0 0 3px rgba(181, 164, 121, 0.25);
}

/* ============================================================
   BOLUM 2 - ADMIN PANELI
   ============================================================ */

/* Tablo satirlari - sadece arka plan.
   transform verilmez: DataTables yeniden cizerken titreme yapar. */
.table100 .row100 td,
.table100 tbody tr td {
    transition: background-color 0.25s var(--ui-ease),
                color 0.25s var(--ui-ease);
}

/* Navbar linkleri ve dropdown ogeleri - basma hissi.
   Sadece <a> ogeleri hedeflenir: menudeki <li class="dropdown-item dropdown">
   kutularina transform verilirse icindeki alt menu (position:absolute)
   basili tutarken yerinden kayar.
   Mevcut hover kurallari !important oldugu icin burada da gerekli. */
.navbar-nav a.nav-link:active {
    transform: translateY(0) scale(0.96) !important;
}

/* Hover'daki translateX(3px) korunur, yoksa basarken 3px sola sicriyor. */
a.dropdown-item:active {
    transform: translateX(3px) scale(0.97) !important;
}

/* Excel benzeri filtre menusu */
.excel-filter-item {
    transition: background-color var(--ui-dur-fast) var(--ui-ease);
}

.excel-filter-footer button {
    transition: background-color var(--ui-dur-fast) var(--ui-ease),
                color var(--ui-dur-fast) var(--ui-ease),
                transform var(--ui-dur-fast) var(--ui-ease-bounce);
}

.excel-filter-footer button:active {
    transform: scale(0.96);
}

/* Dashboard kartlari - .second.hero-card zaten transition'a sahip,
   burada sadece uzerindeki metin/buton rengi yumusatilir. */
.hero-btn,
.hero-description,
.hero-date {
    transition: color var(--ui-dur) var(--ui-ease);
}

/* Bootstrap kartlari (dashboard disi paneller) */
.card {
    transition: box-shadow var(--ui-dur) var(--ui-ease),
                transform var(--ui-dur) var(--ui-ease);
}

/* ------------------------------------------------------------
   Form alanlari (label + .form-control)

   Tum admin formlari ayni Bootstrap kalibini kullaniyor:
   .form-group > label + input/select/textarea.form-control

   Bootstrap'in sabit .form-control yuksekligi BILEREK korunuyor.
   Dikey dolgu artirilsa alanlar buyur, tablo ici ve yan yana
   yerlesimlerde satirlar kayar. Sadece kenarlik, kose, yatay
   dolgu ve odak halkasi yenileniyor.
   ------------------------------------------------------------ */

.form-group label {
    margin-bottom: 6px;
    font-size: 13.5px;
    font-weight: 600;
    color: #4a5568;
    letter-spacing: 0.01em;
}

.form-control {
    padding-left: 14px;
    padding-right: 14px;
    color: #2d3748;
    background-color: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    box-shadow: none;
}

.form-control::placeholder {
    color: #a0aec0;
}

.form-control:hover:not(:disabled):not([readonly]) {
    border-color: #cbd5e0;
}

/* Bootstrap'in mavi odak halkasi yerine panelin altin tonu */
.form-control:focus {
    color: #2d3748;
    background-color: #fff;
    border-color: var(--ui-gold);
    box-shadow: 0 0 0 3px rgba(181, 164, 121, 0.18);
    outline: none;
}

.form-control:disabled,
.form-control[readonly] {
    background-color: #f7fafc;
    color: #718096;
    cursor: not-allowed;
}

/* Cok satirli alanlarda nefes payi - yukseklik zaten rows ile geliyor */
textarea.form-control {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 1.5;
}

select.form-control {
    cursor: pointer;
}

/* ------------------------------------------------------------
   Dosya secme alanlari (native "Choose File")

   Markup'a dokunulmaz: tarayicinin urettigi buton
   ::file-selector-button ile bicimlendirilir, boylece mevcut ve
   ileride eklenecek tum <input type="file"> ogeleri otomatik kapsanir.

   NOT: ::-webkit-file-upload-button ayri blokta yazilmali.
   Bilinmeyen bir pseudo-element seciciyi gecersiz kilarsa tarayici
   TUM kural blogunu atar; ayni listede birlestirilemez.
   ------------------------------------------------------------ */

input[type="file"] {
    /* Bootstrap .form-control sabit yukseklik veriyor, buton tasiyor */
    height: auto;
    padding: 6px;
    font-size: 13.5px;
    color: #4a5568;
    background: #fff;
    border: 1.5px solid #e2e8f0;
    border-radius: 10px;
    cursor: pointer;
}

input[type="file"]:hover {
    border-color: var(--ui-gold);
}

/* Standart (Chrome 89+, Firefox 82+, Safari 16.4+) */
input[type="file"]::file-selector-button {
    margin-right: 12px;
    padding: 8px 18px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #b5a479 0%, #8c7b53 100%);
    color: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    cursor: pointer;
    transition: box-shadow var(--ui-dur-fast) var(--ui-ease),
                filter var(--ui-dur-fast) var(--ui-ease),
                transform var(--ui-dur-fast) var(--ui-ease-bounce);
}

input[type="file"]::file-selector-button:hover {
    filter: brightness(1.08);
    box-shadow: 0 4px 12px rgba(181, 164, 121, 0.45);
}

input[type="file"]::file-selector-button:active {
    transform: scale(0.97);
    box-shadow: none;
}

/* Eski WebKit (Safari 16.4 oncesi) icin ayni gorunum */
input[type="file"]::-webkit-file-upload-button {
    margin-right: 12px;
    padding: 8px 18px;
    border: 0;
    border-radius: 8px;
    background: linear-gradient(135deg, #b5a479 0%, #8c7b53 100%);
    color: #fff;
    font-family: inherit;
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0.2px;
    cursor: pointer;
    transition: box-shadow var(--ui-dur-fast) var(--ui-ease),
                filter var(--ui-dur-fast) var(--ui-ease),
                transform var(--ui-dur-fast) var(--ui-ease-bounce);
}

input[type="file"]::-webkit-file-upload-button:hover {
    filter: brightness(1.08);
    box-shadow: 0 4px 12px rgba(181, 164, 121, 0.45);
}

input[type="file"]::-webkit-file-upload-button:active {
    transform: scale(0.97);
    box-shadow: none;
}

/* ============================================================
   BOLUM 3 - GUEST TARAFI
   (HOTELUICSS.css kendi transition'larina sahip.
    Admin onaylandiktan sonra .svc-card / .btn-accent / .chip /
    .fab gibi sinif listesi buraya eklenecek.)
   ============================================================ */

/* ============================================================
   ERISILEBILIRLIK
   Isletim sisteminde "hareketi azalt" acik olan kullanicilar icin
   tum gecis ve animasyonlar devre disi birakilir.
   ============================================================ */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
    }
}
