/* ===========================================================
   POLSKAELITA.PL - WYSZUKIWARKA I WYNIKI
   pe_search.css v1.0 | MyBB 1.8.41 / Green Dark TEST

   ACP: Do wybranych plikow
   Plik: search.php
   Czynnosci: Do wszystkich

   Kompletny, samodzielny arkusz.
   =========================================================== */

/* 01. PANEL, NAGLOWEK I WIERSZE */

body .stable:has(> .container .search-by),
body .stable:has(> .container form[action="search.php"]) {
    width: 100%;
    box-sizing: border-box;
    margin: 18px 0 20px;
    padding: 0;

    background: #11191b;
    border: 1px solid #365748;
    border-radius: 11px;
    overflow: visible;
    color: #e8f3eb;
}

body .stable:has(> .container .search-by) > .headline,
body .stable:has(> .container form[action="search.php"]) > .headline {
    display: flex;
    align-items: center;
    justify-content: space-between;

    box-sizing: border-box;
    width: 100%;
    min-height: 61px;
    height: auto;

    margin: 0;
    padding: 15px 21px;

    background: linear-gradient(
        110deg,
        #1c292b 0%,
        #172528 68%,
        #182f25 100%
    );

    border: 0;
    border-bottom: 1px solid #365748;
    border-radius: 10px 10px 0 0;

    color: #eaf6ed;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.5;
}

body .stable:has(> .container .search-by) > .container,
body .stable:has(> .container form[action="search.php"]) > .container {
    padding: 11px 12px 14px;
    box-sizing: border-box;

    background: #11191b;
    border-radius: 0 0 10px 10px;
}

body .stable:has(> .container .search-by)
> .container > .row,

body .stable:has(> .container form[action="search.php"])
> .container > form > .row {
    box-sizing: border-box;
    width: 100%;

    margin: 6px 0;
    padding: 13px 16px;

    background: linear-gradient(
        120deg,
        #202c30,
        #1a292c
    );

    border: 1px solid #314b40;
    border-radius: 8px;

    color: #dcece0;
    line-height: 1.55;
}

/* 02. PASEK SORTOWANIA W WYNIKACH */

body .stable .container > .row:has(> .search-by) {
    display: flex;
    justify-content: flex-end;
    align-items: center;

    min-height: 44px;
    position: relative;
}

body .stable .search-by {
    position: relative;
    text-align: right;
}

body .stable .search-by > .dropdown-link {
    display: inline-flex;
    align-items: center;
    min-height: 34px;

    padding: 7px 12px;

    border: 1px solid #42644f;
    border-radius: 6px;

    background: #17282a;
    color: #b4dec0;

    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
}

body .stable .search-by > .dropdown-link:hover {
    background: #244236;
}

body .stable .search-by > ul.dropdown {
    z-index: 999999;
    min-width: 195px;
    padding: 6px;

    background: #1b292b;
    border: 1px solid #42644f;
    border-radius: 8px;

    box-shadow: 0 12px 24px #0008;
}

body .stable .search-by > ul.dropdown li {
    padding: 0;
    margin: 0;
}

body .stable .search-by > ul.dropdown li a {
    display: inline-block;
    padding: 7px 9px;

    color: #d8ecde;
    font-size: 12px;
    text-decoration: none;
}

body .stable .search-by > ul.dropdown li a:hover {
    color: #a1e4b0;
}

/* ===========================================================
   03. WYNIKI WYSZUKIWANIA

   6 faktycznych elementow szablonu:
   status | icon | thread-info | stats | last-post | modbit
   =========================================================== */

body .stable > .container > .row.thread {
    display: grid !important;

    grid-template-columns:
        22px
        24px
        minmax(0, 1fr)
        120px
        210px
        28px;

    align-items: center;

    column-gap: 12px;
    row-gap: 8px;

    box-sizing: border-box;

    width: 100%;
    min-height: 100px;

    margin: 7px 0;
    padding: 14px 16px;

    background: linear-gradient(
        112deg,
        #202c30,
        #1b292b 74%,
        #1b3028
    );

    border: 1px solid #314b40;
    border-radius: 8px;

    color: #e5efe8;
    text-align: left;
}

body .stable > .container > .row.thread:hover {
    border-color: #558568;

    background: linear-gradient(
        112deg,
        #233337,
        #1c3030 74%,
        #1c352a
    );
}

body .stable > .container > .row.thread::before,
body .stable > .container > .row.thread::after {
    content: none !important;
    display: none !important;
}

body .stable > .container > .row.thread > div {
    position: relative;

    float: none !important;
    display: block;

    box-sizing: border-box;

    min-width: 0;
    width: auto !important;

    padding: 0;
    margin: 0;

    vertical-align: middle;
}

body .stable > .container > .row.thread > .status {
    grid-column: 1;
    text-align: center;
}

body .stable > .container > .row.thread > .icon {
    grid-column: 2;
    text-align: center;
}

body .stable > .container > .row.thread > .thread-info {
    grid-column: 3;
}

body .stable > .container > .row.thread > .stats {
    grid-column: 4;
    text-align: center;
}

body .stable > .container > .row.thread > .last-post {
    grid-column: 5;
    text-align: left;
}

body .stable > .container > .row.thread > .modbit {
    grid-column: 6;
    text-align: center;
}

body .stable > .container > .row.thread > .modbit input {
    margin: 0;
    accent-color: #67bb7b;
}

/* ===========================================================
   04. TYTUL, AUTOR I AVATAR
   Bez absolutnego pozycjonowania
   =========================================================== */

body .stable > .container > .row.thread .thread-info {
    display: flex !important;
    align-items: center;

    gap: 13px;
    min-width: 0;
    text-align: left;
}

body .stable > .container > .row.thread
.thread-info > .avatar {
    position: static !important;
    transform: none !important;
    float: none !important;

    flex: 0 0 auto;

    width: auto !important;
    max-width: 64px;
    height: auto;

    margin: 0 !important;
    padding: 0 !important;
}

body .stable > .container > .row.thread
.thread-info > .avatar:empty {
    display: none !important;
}

body .stable > .container > .row.thread
.thread-info > .info {
    position: static !important;
    float: none !important;

    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;

    margin: 0;
    padding: 0 !important;

    line-height: 1.5;
}

body .stable > .container > .row.thread
.thread-info .thread-name {
    color: #f1faf3;

    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;

    overflow-wrap: anywhere;
}

body .stable > .container > .row.thread
.thread-info .thread-name a {
    color: #ecf7ee;

    font-size: 13px;
    font-weight: 700;

    text-decoration: none;
}

body .stable > .container > .row.thread
.thread-info .thread-name a:hover {
    color: #9de2af;
}

body .stable > .container > .row.thread .forum-name,
body .stable > .container > .row.thread .post-prev {
    margin: 4px 0;

    color: #b3c9b9;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.45;
}

body .stable > .container > .row.thread .forum-name a {
    color: #b6dbbb;
    font-size: 11px;
}

body .stable > .container > .row.thread
.thread-info .author {
    display: flex;
    align-items: center;
    flex-wrap: wrap;

    gap: 7px;
    margin: 5px 0 0;

    color: #d5e7da;
    font-size: 11px;
}

body .stable > .container > .row.thread
.thread-info .author a {
    color: #b5e1bf;
}

body .stable > .container > .row.thread
.thread-info .avatarep_fd,

body .stable > .container > .row.thread
.thread-info .avatarep_img,

body .stable > .container > .row.thread
.thread-info .avatarep_bg {
    position: static !important;
    transform: none !important;
    float: none !important;
}

body .stable > .container > .row.thread
.thread-info .avatar img,

body .stable > .container > .row.thread
.thread-info .avatarep_img {
    max-width: 54px;
    max-height: 54px;

    object-fit: cover;
    border-radius: 50%;
}

/* 05. ODPOWIEDZI, WYŚWIETLENIA, OSTATNI POST */

body .stable > .container > .row.thread .stats {
    color: #d4e2d7;
    line-height: 1.65;
    white-space: nowrap;
}

body .stable > .container > .row.thread .stats span {
    color: #a2b8aa;
    font-size: 11px;
}

body .stable > .container > .row.thread .stats a,
body .stable > .container > .row.thread .stats .views {
    color: #e3f1e6;
    font-size: 11px;
}

body .stable > .container > .row.thread .last-post {
    display: flex !important;
    flex-direction: row;

    align-items: center;
    justify-content: flex-start;

    gap: 10px;
    min-width: 0;
}

body .stable > .container > .row.thread
.last-post > .info {
    position: static !important;
    float: none !important;

    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;

    margin: 0 !important;
    padding: 0 !important;

    text-align: left !important;
    color: #c3d5c9;

    line-height: 1.5;
}

body .stable > .container > .row.thread
.last-post > .avatar {
    position: static !important;
    transform: none !important;

    flex: 0 0 auto;

    margin: 0 !important;
    padding: 0 !important;
}

body .stable > .container > .row.thread
.last-post > .avatar:empty {
    display: none !important;
}

body .stable > .container > .row.thread .last-post .author,
body .stable > .container > .row.thread .last-post .date {
    color: #c3d5c9;
    font-size: 11px;
}

body .stable > .container > .row.thread .last-post a {
    color: #afe2b9;
    text-decoration: none;
}

body .stable > .container > .row.thread
.last-post .avatarep_fd,

body .stable > .container > .row.thread
.last-post .avatarep_bg {
    position: static !important;
    transform: none !important;
    float: none !important;
}

/* 06. MODERACJA POD WYNIKAMI */

body .tl-container {
    display: flex;
    align-items: center;
    justify-content: space-between;

    gap: 14px;
    flex-wrap: wrap;

    margin: 15px 0 22px;
}

body .tl-container::before,
body .tl-container::after {
    content: none !important;
    display: none !important;
}

body .tl-container > .left,
body .tl-container > .right {
    float: none !important;
    width: auto !important;
    margin: 0;
}

body .tl-container > .right {
    display: flex;
    align-items: center;
    justify-content: flex-end;

    gap: 9px;
    flex-wrap: wrap;

    margin-left: auto;
    color: #cbdccc;
}

body .tl-container select,
body .stable input.textbox,
body .stable select {
    box-sizing: border-box;

    min-height: 40px;
    max-width: 100%;

    padding: 9px 12px;

    background: #152527;
    color: #e8f4ec;

    border: 1px solid #466a54;
    border-radius: 7px;
}

body .tl-container input.button,
body .tl-container button,
body .stable input.button {
    min-height: 40px;
    padding: 9px 16px;

    background: linear-gradient(
        #2b7547,
        #1e5934
    );

    border: 1px solid #5aab74;
    border-radius: 7px;

    color: #f4fff5;
    font-size: 11px;
    font-weight: 700;

    cursor: pointer;
}

/* 07. FORMULARZ WYSZUKIWANIA */

body .stable .container
form[action="search.php"] > .row.wp.clearfix {
    display: grid;

    grid-template-columns:
        repeat(2, minmax(0,1fr));

    gap: 18px;
    padding: 12px;
}

body .stable .container
form[action="search.php"] > .row.wp.clearfix::before,

body .stable .container
form[action="search.php"] > .row.wp.clearfix::after {
    content: none !important;
    display: none !important;
}

body .stable .container
form[action="search.php"] > .row.wp.clearfix > .left50 {
    float: none !important;

    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;

    padding: 0;
    margin: 0;
}

body .stable .container
form[action="search.php"] .row.normal {
    padding: 12px 14px;

    background: linear-gradient(
        110deg,
        #243b32,
        #1d302d
    );

    border-left: 3px solid #69b17a;

    color: #e3f3e6;
    font-size: 12px;
    font-weight: 700;
}

body .stable .container
form[action="search.php"] .row.wb {
    padding: 15px;

    background: #1b2a2d;
    color: #d8eadc;

    border: 1px solid #334c40;
    border-radius: 0 0 7px 7px;
}

body .stable .container
form[action="search.php"] .input-line {
    margin: 9px 0;
}

body .stable .container
form[action="search.php"] input[type="radio"],

body .stable .container
form[action="search.php"] input[type="checkbox"] {
    accent-color: #64b77b;
}

/* 08. MNIEJSZE EKRANY */

@media (max-width: 1030px) {
    body .stable > .container > .row.thread {
        grid-template-columns:
            20px
            18px
            minmax(0,1fr)
            100px
            150px
            22px;

        gap: 8px;
        padding: 12px;
    }
}

@media (max-width: 780px) {
    body .stable > .container > .row.thread {
        grid-template-columns:
            20px
            minmax(0,1fr)
            94px
            22px;

        row-gap: 8px;
    }

    body .stable > .container > .row.thread > .icon {
        display: none !important;
    }

    body .stable > .container > .row.thread > .thread-info {
        grid-column: 2;
    }

    body .stable > .container > .row.thread > .stats {
        grid-column: 3;
    }

    body .stable > .container > .row.thread > .last-post {
        grid-column: 2 / 4;
        grid-row: 2;
    }

    body .stable > .container > .row.thread > .modbit {
        grid-column: 4;
        grid-row: 1;
    }

    body .stable .container
    form[action="search.php"] > .row.wp.clearfix {
        grid-template-columns: minmax(0,1fr);
    }
}

@media (max-width: 500px) {
    body .stable > .container > .row.thread {
        grid-template-columns:
            18px
            minmax(0,1fr)
            22px;

        padding: 11px 9px;
    }

    body .stable > .container > .row.thread > .thread-info {
        grid-column: 2;
    }

    body .stable > .container > .row.thread > .stats {
        grid-column: 2;
        grid-row: 2;
        text-align: left;
    }

    body .stable > .container > .row.thread > .last-post {
        grid-column: 2;
        grid-row: 3;
    }

    body .stable > .container > .row.thread > .modbit {
        grid-column: 3;
        grid-row: 1;
    }

    body .stable > .container > .row.thread
    .thread-info .avatar img {
        max-width: 40px;
        max-height: 40px;
    }

    body .stable > .container > .row.thread
    .thread-info .thread-name,

    body .stable > .container > .row.thread
    .thread-info .thread-name a {
        font-size: 12px;
    }

    body .tl-container > .right {
        justify-content: flex-start;
        margin-left: 0;
    }
}