:root{--fg:#0b132b;--muted:#6c7a89;--bg:#f7f9fb;--acc:#2a9d8f;--card:#fff;--border:#e9ecef}
*{box-sizing:border-box}body{margin:0;font-family:system-ui,Segoe UI,Roboto,Arial,sans-serif;color:var(--fg);background:var(--bg);line-height:1.6}
a{color:inherit;text-decoration:none;transition:.2s}a:hover{color:var(--acc)}.container{max-width:1000px;margin:0 auto;padding:16px}
.hero{background:linear-gradient(120deg,#0b132b 0%,#18324a 100%),url('/img/hero.jpg');background-blend-mode:overlay;color:#fff}.hero-inner{padding:36px 16px}
.brand{font-weight:800;font-size:1.4rem;color:#fff}.hero h1{margin:.2em 0 .2em 0;font-size:2rem}.topnav a{margin-right:14px;color:#eaf6f6}
.main-content{margin-top:8px}h1,h2,h3{line-height:1.2;margin:0 0 .6em}h2{font-size:1.6rem}h3{font-size:1.2rem}.muted{color:#a9bdc9}
.grid{display:grid;grid-template-columns:1fr;gap:20px}@media(min-width:720px){.grid{grid-template-columns:1fr 1fr}}
.card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:16px;box-shadow:0 1px 6px rgba(0,0,0,.05);transition:.2s}
.card:hover{transform:translateY(-3px);box-shadow:0 6px 14px rgba(0,0,0,.08)}.cover{width:100%;height:160px;object-fit:cover;border-radius:10px;margin-bottom:8px}
.cover-lg{width:100%;height:320px;object-fit:cover;border-radius:12px;margin:8px 0 16px}.btn{display:inline-block;margin-top:8px;padding:8px 14px;border-radius:10px;border:1px solid var(--acc);color:var(--acc)}
.btn:hover{background:var(--acc);color:#fff}.table{width:100%;border-collapse:collapse}.table th,.table td{border-bottom:1px solid var(--border);padding:8px;text-align:left}
footer.footer{margin-top:32px;border-top:1px solid var(--border);text-align:center;color:#6c7a89;padding:18px 0}
input,textarea,select{width:100%;padding:8px;border:1px solid #d7dee4;border-radius:8px;background:#fff}label{display:block;margin:10px 0 4px}
.content img{max-width:100%;height:auto;border-radius:10px;margin:8px 0}.tag{display:inline-block;background:#e0f2f1;color:#00695c;padding:4px 8px;border-radius:999px;margin-right:6px;font-size:.85rem}
.pagination{display:flex;gap:12px;justify-content:center;align-items:center;margin-top:24px}.pagination a{color:var(--acc);border:1px solid var(--acc);padding:4px 10px;border-radius:6px}
.pagination a:hover{background:var(--acc);color:#fff}
.alert.error {
    background: #ffe8e8;
    border: 1px solid #ffb3b3;
    color: #8a1f1f;
    padding: 10px 12px;
    border-radius: 8px;
    margin: 10px 0;
}

.field-error {
    display: block;
    color: #b00020;
    font-size: .9rem;
    margin-top: 4px;
}
.table {
    width: 100%;
    border-collapse: collapse;
}

    .table th, .table td {
        padding: 8px 10px;
        border-bottom: 1px solid #eee;
        vertical-align: top;
    }

.table-responsive {
    overflow-x: auto;
}

.grid.three {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 12px;
}

@media (max-width: 900px) {
    .grid.three {
        grid-template-columns: 1fr;
    }
}
.hp {
    position: absolute;
    left: -9999px;
    width: 1px;
    height: 1px;
    overflow: hidden;
}
/* 🔍 Arama çubuğu */
.searchbar {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    max-width: 700px;
    margin-bottom: 20px;
}

    .searchbar input[type="text"] {
        flex: 1;
        height: 42px;
        padding: 0 12px;
        border: 1px solid #ccc;
        border-radius: 6px;
        font-size: 15px;
        box-sizing: border-box;
        line-height: 1.2;
    }

    .searchbar button.btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        height: 42px;
        margin:0px;
        padding: 0 14px;
        border: 1px solid #0078d7;
        border-radius: 6px;
        background: #f8fafc;
        color: #0078d7;
        font-size: 15px;
        line-height: 1; /* 🔹 Tam dikey ortalama */
        box-sizing: border-box;
        cursor: pointer;
        transform: translateY(-1px); /* 🔹 1px yukarı al: görsel farkı sıfırlar */
        transition: background .2s ease;
    }

        .searchbar button.btn:hover {
            background: #0078d7;
            color: #fff;
        }

    .searchbar .icon {
        width: 18px;
        height: 18px;
        flex-shrink: 0;
        display: block;
    }
/* Admin list utilities */
.tbl {
    width: 100%;
    border-collapse: collapse;
}

    .tbl th, .tbl td {
        padding: 8px 10px;
        border-bottom: 1px solid #eee;
        vertical-align: middle;
    }

    .tbl th {
        text-align: left;
        background: #fafafa;
    }

.card {
    padding: 12px;
    background: #fff;
    border: 1px solid #eee;
    border-radius: 10px;
    box-shadow: 0 1px 2px rgba(0,0,0,.03);
}

.alert {
    background: #fff8e1;
    border: 1px solid #ffe08a;
    padding: 10px 12px;
    border-radius: 8px;
}