﻿/*body {
    padding-top: 50px;
    padding-bottom: 20px;
}*/

/* Set padding to keep content from hitting the edges */
/*.body-content {
    padding-left: 15px;
    padding-right: 15px;
}*/

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
/*.dl-horizontal dt {
    white-space: normal;
}*/

/* Set width on the form input elements since they're 100% wide by default */
/*input,
select,
textarea {
    max-width: 280px;
}*/

.field-validation-error {
    color: #e80c4d;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #e80c4d;
}

.validation-summary-errors {
    color: #e80c4d;
    font-weight: bold;
    font-size: 1.1em;
}

.validation-summary-valid {
    display: none;
}

.request-overlay {
    z-index: 9999;
    position: fixed; /*Important to cover the screen in case of scolling content*/
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: block;
    text-align: center;
    background: rgba(200,200,200,0.5) url('../Content/img/loader.gif') no-repeat center; /*.gif file or just div with message etc. however you like*/
}

/* AdminLTE'nin .main-header'ı (üstteki mor navbar) "position: relative; z-index: 1030;" ile kendi
   stacking context'ini oluşturuyor. bootstrap-datepicker ise takvim popup'ını açarken kendi z-index'ini
   CSS'ten değil, JS tarafında INLINE style olarak (en yakın pozisyonlanmış atadan bulduğu z-index'e göre,
   örn. ".main-sidebar"ın 810'undan) hesaplayıp yazıyor - bu yüzden harici bir stylesheet kuralı normal
   (important'sız) şekilde yazılırsa, her zaman daha yüksek öncelikli olan bu inline style tarafından
   eziliyor ve hesaplanan değer (örn. 810) üst navbar'ın 1030'undan düşük kalabiliyor. Sonuç: sayfanın alt
   kısımlarındaki bir tarih alanına tıklanıp takvim yukarı doğru açıldığında (altta yeterli boşluk yoksa)
   takvimin üst kısmı üst navbar'ın ARKASINDA kalıp kesilmiş görünüyordu. Inline style'ı ezebilmek için
   burada !important şart. Bootstrap modal içindeki (z-index: 1050) bir tarih alanı için de aynı sorun
   geçerli olabileceğinden, ikisinin de üzerine çıkacak şekilde yükseltiliyor.
*/
.datepicker.dropdown-menu {
    z-index: 1060 !important;
}

/* Sol üst köşedeki marka alanı: eski düz "Üçüncü Binyıl ERP" yazısı yerine, favicon'da kullanılan aynı
   marka dili ile "3" işareti (Content/img/logo-mark.png) + hemen bitişiğinde "Erp" yazısı, ardından
   "üçüncübinyıl" yazısı ve altında "Geleceğinizi Tasarlayın" sloganı.

   Renk mantığı: AdminLTE'deki skinlerin BÜYÜK ÇOĞUNLUĞU (blue/green/red/yellow/purple, hepsi + light
   varyantları) ".main-header .logo" için doygun bir renk arkaplan + BEYAZ metin kullanıyor - bu yüzden
   varsayılan (aşağıdaki genel kural) metin rengi beyaz. Ama "skin-black" ve "skin-black-light" farklı:
   AdminLTE'nin kendi orijinal tasarımında bu ikisinde menü/sidebar siyah kalırken logo kutusunun kendisi
   BEYAZ arkaplan kullanır (bkz. skins/skin-black(-light).css - bu projede _all-skins.min.css üzerinden
   YÜKLENMİYOR, o yüzden arkaplanı burada kendimiz sağlıyoruz) - bu iki skin'de beyaz üzerine beyaz yazı
   görünmez olacağından, metin renkleri logonun ORİJİNAL tonlarına (gri #4d4d4d "üçüncü"/slogan, mavi
   #0086cf "binyıl") çevriliyor. "Erp" de aynı mantıkla lacivert (#0f2a3d, favicon'daki gibi) oluyor.

   Hizalama: "3" ile "Erp" favicon'daki gibi bitişik ve alt hizalı görünsün diye ikisi ayrı bir iç flex grup
   (.logo-mark-erp, align-items:flex-end) içinde birbirine göre hizalanıyor; bu grup ile yanındaki yazı
   bloğu ise DIŞ flex konteynerde (.logo-lg, align-items:center) dikey ortalanıyor - sadece "flex-end"
   kullanılsaydı grup 50px'lik kutunun en altına yapışıp üstte çirkin bir boşluk bırakıyordu.

   AdminLTE.css, Site.css'ten SONRA yüklendiği için (bkz. _Layout.cshtml) kendi ".logo-lg{display:block}"
   kuralı aynı specificity'deki bu kuralı ezer - "display: flex" için !important şart.
*/
.main-header .logo .logo-lg {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 50px;
}
.main-header .logo .logo-mark-erp {
    display: flex;
    align-items: flex-end;
    flex-shrink: 0;
}
.main-header .logo .logo-mark {
    height: 24px;
    width: auto;
    margin-right: 2px;
}
.main-header .logo .logo-erp-text {
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    color: #ffffff;
    letter-spacing: 0.2px;
}
.main-header .logo .logo-wordmark-text {
    margin-left: 6px;
    line-height: 1.05;
    text-align: center;
    min-width: 0;
    overflow: hidden;
}
.main-header .logo .logo-wordmark-main {
    display: block;
    font-size: 16px;
    font-weight: 400;
    color: #ffffff;
    white-space: nowrap;
}
.main-header .logo .logo-wordmark-main b {
    font-weight: 800;
}
.main-header .logo .logo-wordmark-tagline {
    display: block;
    font-size: 8px;
    font-weight: 400;
    color: rgba(255, 255, 255, 0.85);
    white-space: nowrap;
}
.main-header .logo .logo-mini .logo-mark {
    height: 30px;
    margin-right: 0;
}

.skin-black .main-header .logo,
.skin-black-light .main-header .logo {
    background-color: #ffffff !important;
}
.skin-black .main-header .logo:hover,
.skin-black-light .main-header .logo:hover {
    background-color: #fcfcfc !important;
}
.skin-black .main-header .logo .logo-erp-text,
.skin-black-light .main-header .logo .logo-erp-text {
    color: #0f2a3d;
}
.skin-black .main-header .logo .logo-wordmark-main,
.skin-black-light .main-header .logo .logo-wordmark-main,
.skin-black .main-header .logo .logo-wordmark-tagline,
.skin-black-light .main-header .logo .logo-wordmark-tagline {
    color: #4d4d4d;
}
.skin-black .main-header .logo .logo-wordmark-main b,
.skin-black-light .main-header .logo .logo-wordmark-main b {
    color: #0086cf;
}

/* Account/Login sayfası - Layout.cshtml kullanmayan (Layout = null) bağımsız bir sayfa, Site.css'i kendisi
   ayrıca yüklüyor. Buradaki ".login-logo" da aynı "3" + "Erp" + "üçüncübinyıl"/slogan mantığını kullanıyor,
   ama sidebar'daki gibi dar bir kutuya (230px) sıkışmadığı ve arkaplanı AdminLTE'nin ".login-page"
   arkaplanıyla (#d2d6de, açık gri) aynı olduğu için, sidebar'daki beyaz metin yerine doğrudan logonun
   ORİJİNAL tonları (gri/mavi/lacivert) kullanılıyor - tıpkı sidebar'ın "skin-black" durumundaki gibi.
*/
.login-logo {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}
.login-logo .logo-mark-erp {
    display: flex;
    align-items: flex-end;
    flex-shrink: 0;
}
.login-logo .logo-mark {
    height: 46px;
    width: auto;
    margin-right: 4px;
}
.login-logo .logo-erp-text {
    font-size: 42px;
    font-weight: 900;
    line-height: 1;
    color: #0f2a3d;
    letter-spacing: 0.2px;
}
.login-logo .logo-wordmark-text {
    margin-left: 12px;
    line-height: 1.1;
    text-align: center;
}
.login-logo .logo-wordmark-main {
    display: block;
    font-size: 28px;
    font-weight: 400;
    color: #4d4d4d;
    white-space: nowrap;
}
.login-logo .logo-wordmark-main b {
    font-weight: 800;
    color: #0086cf;
}
.login-logo .logo-wordmark-tagline {
    display: block;
    font-size: 13px;
    font-weight: 400;
    color: #4d4d4d;
    white-space: nowrap;
}