/* ============================================================
   Senbul Tasarım Katmanı
   main.css'ten SONRA yüklenir; tasarım değişkenleri (tokenlar),
   yerleşim onarımları ve bileşen düzeltmeleri burada toplanır.
   ============================================================ */

:root {
    /* Renkler */
    --sb-mavi: #2f8dcc;          /* birincil eylem rengi */
    --sb-mavi-koyu: #2472a8;
    --sb-turuncu: #f0862d;       /* vurgu rengi */
    --sb-turuncu-koyu: #d97316;
    --sb-zemin: #f5f7f9;         /* sayfa zemini */
    --sb-panel: #eef2f4;         /* kart/panel zemini */
    --sb-cizgi: #dfe6ea;         /* kenarlıklar */
    --sb-metin: #2d3b45;
    --sb-metin-soluk: #6b7a86;
    --sb-header-zemin: #dbe6e6;  /* mevcut header/footer zemini */

    /* Biçim */
    --sb-radius: 10px;
    --sb-radius-kucuk: 6px;
    --sb-golge: 0 2px 10px rgba(20, 40, 60, .08);

    /* Boşluk ölçeği */
    --sb-bosluk-1: 8px;
    --sb-bosluk-2: 16px;
    --sb-bosluk-3: 24px;
    --sb-bosluk-4: 40px;
}

/* ------------------------------------------------------------
   Yerleşim onarımı: footer her zaman sayfanın dibine yapışır.
   (Kısa sayfalarda footer ortada yüzüyor, altı beyaz kalıyordu.)
   ------------------------------------------------------------ */
body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

.footerWrap {
    margin-top: auto;
}

/* ------------------------------------------------------------
   Mobil header: dev logo bloğunu kompaktlaştır,
   hamburger'ı logoyla aynı satıra hizala.
   ------------------------------------------------------------ */
@media screen and (max-width: 767px) {
    .header .row > .col-md-2 {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 8px 15px;
    }

    .header .logo {
        float: none;
        margin: 0;
    }

    .header .logo img {
        max-width: 150px;
        height: auto;
    }

    .header .navbar-header {
        float: none;
        margin: 0;
    }

    .navbar-toggle {
        margin: 0;
        background: var(--sb-mavi);
        border: none;
    }

    .navbar-toggle .icon-bar {
        background: #fff;
    }

    /* Açılan mobil menü: okunaklı, tam genişlik, dokunmaya uygun */
    .navbar-collapse {
        background: #fff;
        border-top: 1px solid var(--sb-cizgi);
        box-shadow: var(--sb-golge);
    }

    .navbar-nav > li {
        padding: 0;
        border-bottom: 1px solid var(--sb-cizgi);
    }

    .navbar-nav > li:last-child {
        border-bottom: none;
    }

    .navbar-nav > li > a {
        padding: 14px 20px;
        display: block;
    }
}

/* ============================================================
   FAZ 1 — Site geneli görsel dil birliği
   ============================================================ */

/* ------------------------------------------------------------
   Header: beyaz, yapışkan, belirgin aktif menü durumu
   ------------------------------------------------------------ */
.header {
    background: #fff;
    border-bottom: 1px solid var(--sb-cizgi);
    position: sticky;
    top: 0;
    z-index: 1000;
}

body.admin-bar .header {
    top: 32px;
}

.navbar-nav > li > a {
    color: var(--sb-metin-soluk);
    border-bottom: 2px solid transparent;
}

.navbar-nav > li > a:hover,
.navbar-nav > li:hover > a {
    color: var(--sb-mavi);
    border-bottom-color: var(--sb-mavi);
    background: none;
}

.navbar-nav > li.active > a,
.navbar-nav > li.current-menu-item > a,
.navbar-nav > li.current_page_item > a,
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:focus,
.navbar-default .navbar-nav > .active > a:hover {
    color: var(--sb-metin);
    border-bottom-color: var(--sb-turuncu);
}

/* Header CTA butonları (Giriş Yap / Kayıt Ol) */
.navbar-nav li.postjob a {
    background: var(--sb-mavi);
    border-bottom-color: var(--sb-mavi);
}

.navbar-nav li.jobseeker a {
    background: var(--sb-turuncu);
    border-bottom-color: var(--sb-turuncu);
}

.navbar-nav li.postjob a:hover,
.navbar-nav li.postjob:hover > a {
    background: var(--sb-mavi-koyu);
    border-bottom-color: var(--sb-mavi-koyu);
    color: #fff;
}

.navbar-nav li.jobseeker a:hover,
.navbar-nav li.jobseeker:hover > a {
    background: var(--sb-turuncu-koyu);
    border-bottom-color: var(--sb-turuncu-koyu);
    color: #fff;
}

/* ------------------------------------------------------------
   Başlıklar: turuncu + text-shadow yerine sade koyu başlık,
   altında kısa turuncu vurgu çizgisi
   ------------------------------------------------------------ */
.userccount h5 {
    color: var(--sb-metin);
    text-shadow: none;
    font-size: 24px;
    position: relative;
    padding-bottom: 12px;
}

.userccount h5:after {
    content: "";
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 0;
    width: 48px;
    height: 3px;
    border-radius: 2px;
    background: var(--sb-turuncu);
}

/* ------------------------------------------------------------
   Paneller: soluk gri-mavi kutular yerine beyaz kart
   (ana sayfa formu, giriş, kayıt, üyelik/şirket bilgileri)
   ------------------------------------------------------------ */
.userccount {
    background: #fff;
    border: 1px solid var(--sb-cizgi);
    border-radius: var(--sb-radius);
    box-shadow: var(--sb-golge);
}

/* ------------------------------------------------------------
   Butonlar: tek dil — birincil mavi, hover koyu mavi
   ------------------------------------------------------------ */
.formpanel .btn,
.contact-form button,
.searchform .btn,
.error-msg .btn {
    background: var(--sb-mavi);
    color: #fff;
    border: none;
    border-radius: var(--sb-radius-kucuk);
    transition: background .2s ease-in-out;
}

.formpanel .btn:hover,
.formpanel .btn:focus,
.contact-form button:hover,
.searchform .btn:hover,
.error-msg .btn:hover {
    background: var(--sb-mavi-koyu);
    color: #fff;
    border-radius: var(--sb-radius-kucuk);
}

.pageSearch a.btn {
    background: var(--sb-turuncu);
    border-radius: var(--sb-radius-kucuk);
}

.pageSearch a.btn:hover {
    background: var(--sb-turuncu-koyu);
}

/* ------------------------------------------------------------
   Form elemanları: tutarlı kenarlık + görünür odak durumu
   ------------------------------------------------------------ */
.form-control {
    border-color: var(--sb-cizgi);
    border-radius: var(--sb-radius-kucuk);
    box-shadow: none;
}

.form-control:focus {
    border-color: var(--sb-mavi);
    box-shadow: 0 0 0 3px rgba(47, 141, 204, .15);
    outline: none;
}

/* ------------------------------------------------------------
   Panel sol menüsü (Menüler): aktif/hover durumu okunur olsun
   (eski hali: açık zemin üzerinde beyaz yazı — okunmuyordu)
   ------------------------------------------------------------ */
.usernavdash li a {
    border-color: var(--sb-cizgi);
    color: var(--sb-metin-soluk);
    border-left: 3px solid transparent;
    transition: background .15s ease-in-out, color .15s ease-in-out;
}

.usernavdash li a:hover {
    background: var(--sb-zemin);
    color: var(--sb-mavi);
}

.usernavdash li.active a {
    background: rgba(47, 141, 204, .08);
    color: var(--sb-mavi);
    border-left-color: var(--sb-mavi);
    font-weight: 600;
}

.usernavdash li a:hover i,
.usernavdash li.active a i {
    color: var(--sb-mavi);
}

/* Panel sol menüsü (widget.php > .optionlist) */
.widget .optionlist li {
    padding: 0;
    margin-bottom: 4px;
}

.widget .optionlist li a {
    display: block;
    padding: 10px 12px;
    color: var(--sb-metin-soluk);
    font-weight: 600;
    font-size: 13px;
    border-radius: var(--sb-radius-kucuk);
    border-left: 3px solid transparent;
    text-decoration: none;
    transition: background .15s ease-in-out, color .15s ease-in-out;
}

.widget .optionlist li a:hover {
    background: var(--sb-zemin);
    color: var(--sb-mavi);
}

.widget .optionlist li.aktif a {
    background: rgba(47, 141, 204, .08);
    color: var(--sb-mavi);
    border-left-color: var(--sb-mavi);
}

/* ============================================================
   FAZ 3 — Tipografi düzeni
   ============================================================ */

/* Eski reset body'ye line-height:1 veriyordu — metinler her yerde
   sıkışıktı. Okunabilir taban değerleri: */
body {
    line-height: 1.6;
    color: var(--sb-metin);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
    line-height: 1.3;
    color: var(--sb-metin);
}

p {
    line-height: 1.6;
}

/* Başlık vurgu çizgisi: varsayılan sol hizalı (panel başlıkları),
   giriş/kayıt gibi ortalanmış bloklarda (.socialLogin) ortada */
.userccount h5:after {
    left: 0;
    transform: none;
}

.socialLogin h5:after {
    left: 50%;
    transform: translateX(-50%);
}

/* "Onay beklemektedir" uyarısı: yanıp sönen soluk yazı yerine
   okunabilir sabit durum bandı */
h4.blink {
    animation: none !important;
    -webkit-animation: none !important;
    opacity: 1 !important;
    background: rgba(240, 134, 45, .12);
    border: 1px solid rgba(240, 134, 45, .35);
    color: var(--sb-turuncu-koyu);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.5;
    padding: 12px 16px;
    border-radius: var(--sb-radius-kucuk);
}

/* Kredi Paketleri: sayfaya özel Montserrat yerine site fontu */
.pricing8,
.pricing8 h1, .pricing8 h2, .pricing8 h3,
.pricing8 h4, .pricing8 h5, .pricing8 h6 {
    font-family: inherit;
}

/* Mesajlar sekmeleri: pasif sekme turuncu genel link rengini
   almasın; aktif sekme mavi vurgulu olsun */
.nav-tabs > li > a {
    color: var(--sb-metin-soluk);
    font-weight: 600;
}

.nav-tabs > li > a:hover {
    color: var(--sb-mavi);
    background: var(--sb-zemin);
}

.nav-tabs > li.active > a,
.nav-tabs > li > a.active,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
    color: var(--sb-mavi);
    border-bottom: 2px solid var(--sb-mavi);
}

/* ============================================================
   FAZ 2 — Sayfa bölümleri
   ============================================================ */

/* --- Ana sayfa: hero --- */
.senbul-hero {
    text-align: center;
    padding: var(--sb-bosluk-4) var(--sb-bosluk-2) var(--sb-bosluk-3);
    max-width: 760px;
    margin: 0 auto;
}

.senbul-hero h1 {
    font-size: 34px;
    font-weight: 700;
    color: var(--sb-metin);
    line-height: 1.25;
    margin-bottom: var(--sb-bosluk-2);
}

.senbul-hero h1 span {
    color: var(--sb-mavi);
}

.senbul-hero p {
    font-size: 17px;
    color: var(--sb-metin-soluk);
    line-height: 1.6;
}

/* --- Ana sayfa: 3 adım --- */
.senbul-steps,
.senbul-sectors {
    max-width: 960px;
    margin: 0 auto;
    padding: var(--sb-bosluk-4) var(--sb-bosluk-2) 0;
    text-align: center;
}

.senbul-steps h2,
.senbul-sectors h2 {
    font-size: 24px;
    font-weight: 700;
    color: var(--sb-metin);
    margin-bottom: var(--sb-bosluk-3);
}

.senbul-steps-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sb-bosluk-2);
}

.senbul-step {
    position: relative;
    background: #fff;
    border: 1px solid var(--sb-cizgi);
    border-radius: var(--sb-radius);
    padding: var(--sb-bosluk-3) var(--sb-bosluk-2);
}

.senbul-step-no {
    position: absolute;
    top: -14px;
    left: 50%;
    transform: translateX(-50%);
    width: 28px;
    height: 28px;
    line-height: 28px;
    border-radius: 50%;
    background: var(--sb-turuncu);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
}

.senbul-step i {
    font-size: 30px;
    color: var(--sb-mavi);
    margin-bottom: var(--sb-bosluk-1);
}

.senbul-step h3 {
    font-size: 17px;
    font-weight: 700;
    color: var(--sb-metin);
    margin: var(--sb-bosluk-1) 0;
}

.senbul-step p {
    color: var(--sb-metin-soluk);
    line-height: 1.5;
    font-size: 14px;
}

/* --- Ana sayfa: sektör çipleri --- */
.senbul-sector-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center;
}

.senbul-chip {
    display: inline-block;
    padding: 8px 16px;
    background: #fff;
    border: 1px solid var(--sb-cizgi);
    border-radius: 999px;
    color: var(--sb-metin-soluk);
    font-size: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: all .15s ease-in-out;
}

.senbul-chip:hover {
    border-color: var(--sb-mavi);
    color: var(--sb-mavi);
    text-decoration: none;
}

.senbul-chip-more {
    background: var(--sb-mavi);
    border-color: var(--sb-mavi);
    color: #fff;
}

.senbul-chip-more:hover {
    background: var(--sb-mavi-koyu);
    color: #fff;
}

/* --- Ana sayfa: firma CTA --- */
.senbul-cta {
    max-width: 960px;
    margin: var(--sb-bosluk-4) auto 0;
    background: var(--sb-mavi);
    border-radius: var(--sb-radius);
    padding: var(--sb-bosluk-3) var(--sb-bosluk-4);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--sb-bosluk-2);
    flex-wrap: wrap;
}

.senbul-cta h2 {
    color: #fff;
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 6px;
}

.senbul-cta p {
    color: rgba(255, 255, 255, .85);
    margin: 0;
}

.senbul-cta-btn {
    background: #fff;
    color: var(--sb-mavi);
    font-weight: 700;
    border-radius: var(--sb-radius-kucuk);
    padding: 12px 28px;
}

.senbul-cta-btn:hover {
    background: var(--sb-turuncu);
    color: #fff;
}

/* --- Şirket Bul: firma kartları --- */
.senbul-firms {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--sb-bosluk-2);
    margin-bottom: var(--sb-bosluk-4);
}

.senbul-firm-card {
    background: #fff;
    border: 1px solid var(--sb-cizgi);
    border-radius: var(--sb-radius);
    padding: var(--sb-bosluk-2);
    display: flex;
    flex-direction: column;
    gap: 12px;
    transition: box-shadow .15s ease-in-out;
}

.senbul-firm-card:hover {
    box-shadow: var(--sb-golge);
}

.senbul-firm-top {
    display: flex;
    align-items: center;
    gap: 14px;
}

.senbul-firm-logo {
    width: 56px;
    height: 56px;
    border-radius: var(--sb-radius-kucuk);
    overflow: hidden;
    flex-shrink: 0;
}

.senbul-firm-logo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.senbul-avatar {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    font-weight: 700;
    color: #fff;
}

.senbul-avatar-c0 { background: #2f8dcc; }
.senbul-avatar-c1 { background: #f0862d; }
.senbul-avatar-c2 { background: #4caf7d; }
.senbul-avatar-c3 { background: #8e6cc0; }
.senbul-avatar-c4 { background: #d9534f; }

.senbul-firm-info h3 {
    font-size: 17px;
    font-weight: 700;
    color: var(--sb-metin);
    margin: 0 0 6px;
}

.senbul-firm-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
}

.senbul-badge {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    padding: 3px 10px;
    border-radius: 999px;
}

.senbul-badge i {
    margin-right: 3px;
}

.senbul-badge-sektor {
    background: rgba(47, 141, 204, .1);
    color: var(--sb-mavi);
}

.senbul-badge-konum {
    background: rgba(240, 134, 45, .12);
    color: var(--sb-turuncu-koyu);
}

.senbul-firm-desc {
    color: var(--sb-metin-soluk);
    font-size: 14px;
    line-height: 1.55;
    margin: 0;
}

.senbul-firm-actions {
    margin-top: auto;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}

.senbul-firm-actions .btn {
    border-radius: var(--sb-radius-kucuk);
    font-size: 14px;
    font-weight: 600;
    padding: 8px 16px;
}

.senbul-btn-ara {
    background: #fff;
    border: 1px solid var(--sb-mavi);
    color: var(--sb-mavi);
}

.senbul-btn-ara:hover {
    background: var(--sb-mavi);
    color: #fff;
}

.senbul-btn-mesaj {
    background: var(--sb-mavi);
    color: #fff;
    border: 1px solid var(--sb-mavi);
}

.senbul-btn-mesaj:hover {
    background: var(--sb-mavi-koyu);
    color: #fff;
}

/* --- Hesabım: özet kartları --- */
.senbul-dash-welcome h3 {
    font-size: 22px;
    font-weight: 700;
    color: var(--sb-metin);
    margin-bottom: var(--sb-bosluk-2);
}

.senbul-dash-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--sb-bosluk-2);
    margin-top: var(--sb-bosluk-2);
}

.senbul-dash-card {
    background: #fff;
    border: 1px solid var(--sb-cizgi);
    border-radius: var(--sb-radius);
    padding: var(--sb-bosluk-3) var(--sb-bosluk-2);
    text-align: center;
    text-decoration: none;
    transition: box-shadow .15s ease-in-out, border-color .15s ease-in-out;
}

.senbul-dash-card:hover {
    box-shadow: var(--sb-golge);
    border-color: var(--sb-mavi);
    text-decoration: none;
}

.senbul-dash-card > i {
    font-size: 26px;
    color: var(--sb-mavi);
}

.senbul-dash-num {
    font-size: 30px;
    font-weight: 700;
    color: var(--sb-metin);
    margin: 8px 0 2px;
}

.senbul-dash-status {
    font-size: 18px;
}

.senbul-dash-status.ok { color: #3d9b6f; }
.senbul-dash-status.bekliyor { color: var(--sb-turuncu-koyu); }

.senbul-dash-label {
    color: var(--sb-metin-soluk);
    font-size: 13px;
    font-weight: 600;
}

/* --- Boş durumlar --- */
.senbul-empty {
    text-align: center;
    padding: var(--sb-bosluk-4) var(--sb-bosluk-2);
    background: #fff;
    border: 1px dashed var(--sb-cizgi);
    border-radius: var(--sb-radius);
    list-style: none;
}

.senbul-empty i {
    font-size: 36px;
    color: var(--sb-cizgi);
    display: block;
    margin-bottom: var(--sb-bosluk-1);
}

.senbul-empty h4 {
    color: var(--sb-metin);
    font-weight: 700;
    margin-bottom: 6px;
}

.senbul-empty p {
    color: var(--sb-metin-soluk);
    margin: 0;
}

/* --- İçerik sayfaları (Hakkımızda vb.) --- */
.senbul-page-title {
    font-size: 28px;
    font-weight: 700;
    color: var(--sb-metin);
    margin: var(--sb-bosluk-2) 0 var(--sb-bosluk-3);
    position: relative;
    padding-bottom: 12px;
}

.senbul-page-title:after {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 48px;
    height: 3px;
    border-radius: 2px;
    background: var(--sb-turuncu);
}

.site-main video,
.site-main iframe {
    max-width: 100%;
    height: auto;
}

/* --- Mobil düzen --- */
@media screen and (max-width: 767px) {
    .senbul-hero h1 {
        font-size: 26px;
    }

    .senbul-steps-grid,
    .senbul-firms,
    .senbul-dash-grid {
        grid-template-columns: 1fr;
    }

    .senbul-steps-grid {
        gap: var(--sb-bosluk-3);
    }

    .senbul-cta {
        flex-direction: column;
        text-align: center;
        padding: var(--sb-bosluk-3);
    }
}

/* --- Ana sayfa: talep onay ekranı --- */
.gm_bilgileri {
    max-width: 860px;
    margin: 0 auto;
}

.senbul-confirm-count {
    text-align: center;
    font-size: 18px;
    color: var(--sb-metin);
    margin: 0;
    padding: var(--sb-bosluk-2);
}

.senbul-confirm-count i {
    color: var(--sb-mavi);
    margin-right: 6px;
}

/* ------------------------------------------------------------
   404 sayfası
   ------------------------------------------------------------ */
.senbul-404 {
    text-align: center;
    padding: var(--sb-bosluk-4) var(--sb-bosluk-2);
}

.senbul-404-code {
    font-size: 96px;
    font-weight: 700;
    line-height: 1;
    color: var(--sb-cizgi);
    margin-bottom: var(--sb-bosluk-2);
}

.senbul-404 h1 {
    font-size: 28px;
    color: var(--sb-metin);
    margin-bottom: var(--sb-bosluk-1);
}

.senbul-404-text {
    color: var(--sb-metin-soluk);
    margin-bottom: var(--sb-bosluk-3);
}

.senbul-404-actions {
    display: flex;
    gap: var(--sb-bosluk-2);
    justify-content: center;
    flex-wrap: wrap;
}

.senbul-404-actions .btn {
    border-radius: var(--sb-radius-kucuk);
    padding: 10px 24px;
}

.senbul-404-actions .btn-primary {
    background: var(--sb-mavi);
    border-color: var(--sb-mavi);
    color: #fff;
}

.senbul-404-actions .btn-primary:hover {
    background: var(--sb-mavi-koyu);
    border-color: var(--sb-mavi-koyu);
}