/* Ana sayfa Node aramasi: anahtar kelime + kategori + buton tek bir arama
   cubugunda; kategori menusu ve sonuc listesi cubugun altinda acilir.
   Tema renkleri defaultMainNode.asp'deki .ps-theme-<tema> sarmalayicisindan
   gelir; temalar homepageNavbar4.asp'deki ihdTema eslemesiyle aynidir. */

/* ---------- Tema degiskenleri ---------- */
.public-search {
    --ps-grad: linear-gradient(120deg, #6f85de 0%, #946dd0 45%, #c04fc6 100%);
    --ps-accent: #8a5cd0;
    --ps-accent-ink: #5b3a99;
    --ps-accent-soft: #efe6fb;
    --ps-accent-line: #d6c3f2;
    --ps-ink: #1f2328;
    --ps-muted: #6b7280;
    /* Yukseklik ekran yuksekligine gore: kisa ekranda video asagi kaymasin */
    --ps-h: clamp(34px, 5.5vh, 46px);
}

.ps-theme-maviTema .public-search {
    --ps-grad: linear-gradient(120deg, #265073 0%, #336b99 60%, #3f82b8 100%);
    --ps-accent: #336b99;
    --ps-accent-ink: #265073;
    --ps-accent-soft: #e4eef7;
    --ps-accent-line: #b9d1e7;
}

.ps-theme-kusursuzTema .public-search {
    --ps-grad: linear-gradient(120deg, #58d641 0%, #2b75c2 75%);
    --ps-accent: #2b75c2;
    --ps-accent-ink: #1f5a96;
    --ps-accent-soft: #e3eefa;
    --ps-accent-line: #b6d1ee;
}

.ps-theme-siyahTema .public-search {
    --ps-grad: linear-gradient(120deg, #1a1a1a 0%, #404040 100%);
    --ps-accent: #404040;
    --ps-accent-ink: #1a1a1a;
    --ps-accent-soft: #ebebeb;
    --ps-accent-line: #c8c8c8;
}

/* ---------- Kapsayici ---------- */
.public-search {
    position: relative;
    box-sizing: border-box;
    width: min(720px, calc(100vw - 32px));
    margin: clamp(6px, 1.6vh, 18px) auto 0;
    color: var(--ps-ink);
    text-align: center;
}

.public-search *,
.public-search *::before,
.public-search *::after {
    box-sizing: border-box;
}

.public-search [hidden] {
    display: none !important;
}

.public-search :is(input, button, select, textarea) {
    font-family: inherit;
}

/* "Anahtar kelime" etiketi ekran okuyucular icin kalir, gorselde placeholder yeterli */
.public-search label[for="public-search-keyword"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

/* ---------- Arama cubugu ---------- */
.public-search-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 230px auto;
    align-items: stretch;
    gap: 0;
    margin: 0;
    padding: clamp(2px, 0.5vh, 4px);
    border: 2px solid transparent;
    border-radius: 14px;
    background: linear-gradient(#fff, #fff) padding-box, var(--ps-grad) border-box;
    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.28);
    text-align: left;
    transition: box-shadow 0.2s, border-color 0.2s;
}

.public-search-row:focus-within {
    box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.35), 0 10px 30px rgba(0, 0, 0, 0.28);
}

.public-search-row > * {
    min-width: 0;
}

.public-search #public-search-keyword {
    width: 100%;
    height: var(--ps-h);
    margin: 0;
    padding: 0 14px 0 42px;
    border: 0;
    border-radius: 10px;
    background: transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8f98' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 14px center / 18px;
    color: var(--ps-ink);
    font-size: 15px;
    font-weight: 500;
    box-shadow: none;
    outline: none;
}

.public-search #public-search-keyword::placeholder {
    color: #8a8f98;
    font-weight: 400;
}

.public-search #public-search-keyword::-webkit-search-cancel-button {
    cursor: pointer;
}

/* ---------- Kategori secici ---------- */
#public-category-picker {
    position: relative;
    margin: 0;
}

#public-category-summary {
    position: relative;
    display: block;
    height: var(--ps-h);
    margin: 0;
    padding: 0 34px 0 16px;
    border: 0;
    border-left: 1px solid var(--ps-accent-line);
    border-radius: 0;
    background: transparent;
    color: var(--ps-accent-ink);
    font-size: 14.5px;
    font-weight: 600;
    line-height: var(--ps-h);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    list-style: none;
    cursor: pointer;
    user-select: none;
    transition: color 0.2s;
}

#public-category-summary::-webkit-details-marker {
    display: none;
}

#public-category-summary::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 14px;
    width: 8px;
    height: 8px;
    margin-top: -6px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    color: var(--ps-accent);
    transform: rotate(45deg);
    transition: transform 0.2s, margin-top 0.2s;
}

#public-category-summary:hover,
#public-category-picker[open] > #public-category-summary {
    background: var(--ps-accent-soft);
}

#public-category-picker[open] > #public-category-summary::after {
    margin-top: -2px;
    transform: rotate(-135deg);
}

.public-category-menu {
    position: absolute;
    top: calc(100% + 12px);
    right: -5px;
    z-index: 1100;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    width: 400px;
    max-width: calc(100vw - 32px);
    padding: 12px;
    border: 1px solid var(--ps-accent-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(0, 0, 0, 0.25);
    text-align: left;
}

.public-category-menu > * {
    flex: 1 1 100%;
    min-width: 0;
}

.public-search #public-category-filter {
    flex: 1 1 180px;
    width: 100%;
    height: 40px;
    margin: 0;
    padding: 0 12px 0 38px;
    border: 1px solid var(--ps-accent-line);
    border-radius: 8px;
    background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%238a8f98' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") no-repeat 12px center / 17px;
    color: var(--ps-ink);
    font-size: 14.5px;
    box-shadow: none;
    transition: border-color 0.2s, box-shadow 0.2s, background 0.2s;
}

.public-search #public-category-filter:focus {
    border-color: var(--ps-accent);
    background-color: #fff;
    box-shadow: 0 0 0 3px var(--ps-accent-soft);
    outline: none;
}

/* Tumu: filtreyi kaldirir; ikincil (ghost) buton */
.public-search #public-category-clear {
    flex: 0 0 auto;
    height: 40px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid var(--ps-accent-line);
    border-radius: 8px;
    background: var(--ps-accent-soft);
    color: var(--ps-accent-ink);
    font-size: 13.5px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
}

.public-search #public-category-clear:hover {
    border-color: transparent;
    background: var(--ps-grad);
    color: #fff;
}

/* ---------- Secilen kategoriler (JS arama kutusu ile liste arasina ekler) ---------- */
.public-category-chips {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 2px 0 10px;
    border-bottom: 1px solid var(--ps-accent-line);
}

.public-category-chips-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
}

.public-category-chips-head > span {
    color: var(--ps-muted);
    font-size: 12.5px;
    font-weight: 600;
}

.public-search .public-category-chips-clear {
    height: 24px;
    margin: 0;
    padding: 0 10px;
    border: 1px solid var(--ps-accent);
    border-radius: 999px;
    background: #fff;
    color: var(--ps-accent-ink);
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s, border-color 0.2s;
}

.public-search .public-category-chips-clear:hover {
    border-color: transparent;
    background: var(--ps-grad);
    color: #fff;
}

/* Cipler tam genislikte alt alta; ~3,5 cipten sonra kayar */
.public-category-chip-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 118px;
    padding-right: 2px;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.public-search .public-category-chip {
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    height: 28px;
    margin: 0;
    padding: 0 10px 0 12px;
    border: 1px solid var(--ps-accent);
    border-radius: 999px;
    background: #fff;
    color: var(--ps-accent-ink);
    font-size: 13px;
    font-weight: 500;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s;
}

.public-search .public-category-chip > span {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.public-search .public-category-chip::after {
    content: "\00D7";
    flex-shrink: 0;
    color: var(--ps-accent);
    font-size: 17px;
    font-weight: 600;
    line-height: 1;
}

.public-search .public-category-chip:hover {
    background: var(--ps-accent-soft);
}

#public-category-list {
    max-height: 320px;
    margin: 0;
    padding-right: 2px;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.public-category-group + .public-category-group {
    margin-top: 8px;
}

.public-search .public-category-parent,
.public-search .public-category-child {
    display: flex;
    align-items: center;
    gap: 12px;
    margin: 0;
    border-radius: 8px;
    line-height: 1.35;
    cursor: pointer;
    transition: background 0.15s, border-color 0.15s;
}

/* Ana kategori: buyuk harfli baslik, sol tema cizgisi, sagda alt kategori sayisi (JS data-count) */
.public-search .public-category-parent {
    margin-bottom: 4px;
    padding: 10px 12px;
    background: var(--ps-accent-soft);
    box-shadow: inset 4px 0 0 var(--ps-accent);
    color: var(--ps-accent-ink);
    font-size: 12.5px;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
}

.public-search .public-category-parent[data-count]::after {
    content: attr(data-count);
    flex-shrink: 0;
    margin-left: auto;
    padding: 1px 8px;
    border-radius: 999px;
    background: var(--ps-grad);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0;
}

.public-search .public-category-parent:hover {
    background: color-mix(in srgb, var(--ps-accent-soft) 60%, var(--ps-accent-line));
}

/* Alt kategori: sade satir; uzerine gelince/secilince acik tema zemini ve cerceve */
.public-search .public-category-child {
    margin-left: 14px;
    padding: 9px 12px;
    border: 1px solid transparent;
    color: var(--ps-ink);
    font-size: 14.5px;
    font-weight: 400;
}

.public-search .public-category-child:hover,
.public-search .public-category-child:has(input:checked) {
    border-color: var(--ps-accent-line);
    background: var(--ps-accent-soft);
}

.public-search .public-category-child:has(input:checked) {
    color: var(--ps-accent-ink);
    font-weight: 500;
}

/* Yuvarlak secim isareti; secilince tema gradyani ve beyaz tik */
.public-category-menu input[type="checkbox"] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin: 0;
    border: 1.5px solid #c3c7cf;
    border-radius: 50%;
    background: #fff;
    cursor: pointer;
    -webkit-appearance: none;
    appearance: none;
    transition: border-color 0.15s, background 0.15s;
}

.public-search .public-category-parent input[type="checkbox"] {
    border-color: var(--ps-accent-line);
}

.public-search .public-category-parent:hover input[type="checkbox"],
.public-search .public-category-child:hover input[type="checkbox"] {
    border-color: var(--ps-accent);
}

.public-category-menu input[type="checkbox"]:checked {
    border-color: transparent;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") center / 11px no-repeat, var(--ps-grad);
}

.public-category-menu input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--ps-accent);
    outline-offset: 2px;
}

.public-category-menu input[type="checkbox"]:disabled {
    border-color: #e1e3e7;
    background: #f3f4f6;
    cursor: default;
}

.public-search input:disabled + span {
    opacity: 0.5;
}

.public-search .public-category-child:has(input:disabled) {
    cursor: default;
}

.public-search .public-category-child:has(input:disabled):hover {
    border-color: transparent;
    background: none;
}

#public-category-empty {
    padding: 12px 8px;
    color: var(--ps-muted);
    font-size: 13.5px;
    text-align: center;
}

/* ---------- Ara butonu ---------- */
.public-search #public-search-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: var(--ps-h);
    margin: 0;
    padding: 0 20px;
    border: 1px solid rgba(255, 255, 255, 0.45);
    border-radius: 10px;
    background: var(--ps-grad);
    color: #fff;
    font-size: 15px;
    font-weight: 600;
    white-space: nowrap;
    cursor: pointer;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.3), 0 4px 12px rgba(0, 0, 0, 0.18);
    transition: filter 0.2s, box-shadow 0.2s;
}

.public-search #public-search-submit::before {
    content: "";
    flex-shrink: 0;
    width: 17px;
    height: 17px;
    background: currentColor;
    -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
    mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.public-search #public-search-submit:hover {
    filter: brightness(1.1);
}

.public-search #public-search-submit:disabled {
    filter: none;
    opacity: 0.75;
    cursor: progress;
}

/* Arama surerken ikon yerine donen gosterge */
#public-search-form[aria-busy="true"] #public-search-submit::before {
    border: 2px solid rgba(255, 255, 255, 0.4);
    border-top-color: #fff;
    border-radius: 50%;
    background: none;
    -webkit-mask: none;
    mask: none;
    animation: ps-spin 0.7s linear infinite;
}

@keyframes ps-spin {
    to { transform: rotate(360deg); }
}

/* ---------- Odak halkalari ---------- */
.public-search :is(input, button, summary, a):focus-visible {
    outline: 2px solid var(--ps-accent);
    outline-offset: 2px;
}

.public-search #public-search-keyword:focus-visible {
    outline: none;
}

.public-search #public-search-submit:focus-visible {
    outline: 2px solid #fff;
    box-shadow: 0 0 0 4px var(--ps-accent);
}

/* ---------- Ipucu ve mesaj ----------
   Ipucu gosterilmez (placeholder yeterli). Mesaj akista yer kaplamaz;
   cubugun altinda, menulerin ustunde bildirim kutusu olarak acilir.
   data-tone (JS): loading | error | info */
.public-search-hint {
    display: none;
}

#public-search-message {
    position: absolute;
    top: calc(100% + 12px);
    left: 50%;
    z-index: 1200;
    display: flex;
    align-items: center;
    gap: 12px;
    width: max-content;
    max-width: 100%;
    margin: 0;
    padding: 10px 16px 10px 10px;
    border: 2px solid transparent;
    border-radius: 12px;
    background: linear-gradient(#fff, #fff) padding-box, var(--ps-grad) border-box;
    color: var(--ps-ink);
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.3);
    transform: translateX(-50%);
    animation: ps-toast 0.2s ease-out;
}

#public-search-message:empty {
    display: none;
}

#public-search-message::before {
    content: "i";
    flex-shrink: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    background: var(--ps-grad);
    color: #fff;
    font-size: 14px;
    font-weight: 700;
    font-style: normal;
}

#public-search-message[data-tone="error"]::before {
    content: "!";
    background: #e5484d;
}

#public-search-message[data-tone="loading"]::before {
    content: "";
    width: 20px;
    height: 20px;
    margin: 3px;
    border: 2px solid var(--ps-accent-line);
    border-top-color: var(--ps-accent);
    background: none;
    animation: ps-spin 0.7s linear infinite;
}

@keyframes ps-toast {
    from {
        opacity: 0;
        transform: translate(-50%, -6px);
    }
}

/* ---------- Sonuclar ---------- */
#public-search-results {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    right: 0;
    z-index: 1050;
    overflow: hidden;
    border: 2px solid transparent;
    border-radius: 14px;
    background: linear-gradient(#fff, #fff) padding-box, var(--ps-grad) border-box;
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.32);
    text-align: left;
}

/* Sonuc yokken mesaj ve liste birlikte acik: liste mesajin altina iner */
.public-search:has(#public-search-message:not(:empty)) #public-search-results {
    top: calc(100% + 70px);
}

.public-results-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    padding: 12px 14px 12px 18px;
    border-bottom: 1px solid var(--ps-accent-line);
    background: var(--ps-accent-soft);
}

.public-results-heading :is(h2, h3, h4, h5, p, span, strong) {
    margin: 0;
}

#public-search-count {
    color: var(--ps-accent-ink);
    font-size: 15px;
    font-weight: 700;
}

.public-search #public-search-close {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 32px;
    height: 32px;
    margin: 0;
    padding: 0 10px;
    border: 1px solid transparent;
    border-radius: 8px;
    background: transparent;
    color: var(--ps-muted);
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
}

.public-search #public-search-close:hover {
    background: #fff;
    color: var(--ps-accent-ink);
}

#public-search-items {
    max-height: 50vh;
    overflow: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
}

.public-result-card {
    padding: 13px 18px;
    border-bottom: 1px solid #f0f1f3;
    transition: background 0.15s;
}

.public-result-card:last-child {
    border-bottom: 0;
}

.public-result-card:hover {
    background: var(--ps-accent-soft);
    box-shadow: inset 3px 0 0 var(--ps-accent);
}

.public-result-card h4 {
    margin: 0 0 4px;
    color: var(--ps-ink);
    font-size: 15px;
    font-weight: 600;
    line-height: 1.45;
}

.public-result-card p {
    margin: 0;
    color: var(--ps-muted);
    font-size: 13px;
}

/* Iptal / Arsiv: guncel olmayan kayit, notr etiket */
.public-result-badge {
    display: inline-block;
    margin-bottom: 6px;
    padding: 2px 8px;
    border: 1px solid #e3e5e8;
    border-radius: 999px;
    background: #f4f5f7;
    color: #4b5563;
    font-size: 11.5px;
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
}

.public-search .public-search-more {
    display: block;
    margin: 0;
    padding: 13px;
    background: var(--ps-grad);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    text-align: center;
    text-decoration: none;
    transition: background 0.2s, color 0.2s;
}

.public-search .public-search-more:hover {
    color: #fff;
    filter: brightness(1.1);
}

/* ---------- Mobil ---------- */
@media (max-width: 700px) {
    .public-search {
        --ps-h: clamp(34px, 5.5vh, 42px);
    }

    .public-search-row {
        grid-template-columns: minmax(0, 1fr) auto;
        border-radius: 12px;
    }

    .public-search #public-search-keyword {
        grid-column: 1 / -1;
        margin-bottom: 4px;
        border-bottom: 1px solid var(--ps-accent-line);
        border-radius: 8px 8px 0 0;
        font-size: 16px; /* iOS odakta yakinlastirmasin */
    }

    #public-category-summary {
        padding-left: 12px;
        border-left: 0;
        font-size: 14px;
    }

    .public-search #public-search-submit {
        padding: 0 16px;
        font-size: 14px;
    }

    .public-category-menu {
        left: -5px;
        right: auto;
        width: min(380px, calc(100vw - 32px));
    }

    #public-search-items {
        max-height: 55vh;
    }
}