/* ============================================================
   Propagare Search — Frontend Styles
   ============================================================ */

:root {
    --ps-primary:     #1a1a2e;
    --ps-accent:      #e94560;
    --ps-accent-soft: #fff0f3;
    --ps-text:        #1a1a2e;
    --ps-muted:       #6b7280;
    --ps-border:      #e5e7eb;
    --ps-bg:          #f9fafb;
    --ps-white:       #ffffff;
    --ps-radius:      8px;
    --ps-shadow:      0 1px 3px rgba(0,0,0,.08), 0 4px 16px rgba(0,0,0,.04);
    --ps-font:        'Georgia', 'Times New Roman', serif;
    --ps-font-ui:     system-ui, -apple-system, sans-serif;
}

/* Wrap */
.ps-wrap { font-family: var(--ps-font-ui); color: var(--ps-text); }

/* ---- Search bar ---- */
.ps-form { margin-bottom: 2rem; }

.ps-search-bar {
    display: flex;
    align-items: center;
    background: var(--ps-white);
    border: 2px solid var(--ps-border);
    border-radius: 50px;
    padding: 4px 4px 4px 20px;
    box-shadow: var(--ps-shadow);
    transition: border-color .2s;
    gap: 8px;
}
.ps-search-bar:focus-within { border-color: var(--ps-accent); }

.ps-search-icon { color: var(--ps-muted); display: flex; align-items: center; flex-shrink: 0; }

.ps-input {
    flex: 1;
    border: none;
    outline: none;
    font-size: 1rem;
    background: transparent;
    color: var(--ps-text);
    font-family: var(--ps-font-ui);
    padding: 8px 0;
}
.ps-input::placeholder { color: #b0b7c3; }

.ps-btn-search {
    background: var(--ps-accent);
    color: #fff;
    border: none;
    border-radius: 50px;
    padding: 10px 28px;
    font-size: .95rem;
    font-weight: 600;
    cursor: pointer;
    font-family: var(--ps-font-ui);
    transition: background .2s, transform .1s;
    white-space: nowrap;
}
.ps-btn-search:hover  { background: #c73652; }
.ps-btn-search:active { transform: scale(.97); }

/* ---- Filtros ---- */
.ps-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px;
    align-items: flex-end;
}

.ps-filter-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.ps-filter-group label {
    font-size: .75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--ps-muted);
}
.ps-filter-group select,
.ps-filter-group input[type="date"] {
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    padding: 6px 10px;
    font-size: .875rem;
    background: var(--ps-white);
    color: var(--ps-text);
    font-family: var(--ps-font-ui);
    cursor: pointer;
    transition: border-color .2s;
}
.ps-filter-group select:focus,
.ps-filter-group input[type="date"]:focus {
    outline: none;
    border-color: var(--ps-accent);
}

.ps-btn-clear {
    display: inline-flex;
    align-items: center;
    padding: 6px 14px;
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    font-size: .875rem;
    color: var(--ps-muted);
    text-decoration: none;
    background: var(--ps-white);
    transition: all .2s;
    margin-top: 20px;
}
.ps-btn-clear:hover { border-color: var(--ps-accent); color: var(--ps-accent); }

/* ---- Meta resultados ---- */
.ps-results-meta {
    font-size: .875rem;
    color: var(--ps-muted);
    margin-bottom: 1.25rem;
    padding-bottom: .75rem;
    border-bottom: 1px solid var(--ps-border);
}
.ps-results-meta strong { color: var(--ps-text); }

/* ---- Items ---- */
.ps-results { display: flex; flex-direction: column; gap: 1px; }

.ps-result-item {
    display: flex;
    gap: 1.25rem;
    background: var(--ps-white);
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    padding: 1.25rem;
    margin-bottom: .75rem;
    transition: box-shadow .2s, transform .15s;
}
.ps-result-item:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,.08);
    transform: translateY(-1px);
}

.ps-result-thumb {
    flex-shrink: 0;
    width: 120px;
    height: 80px;
    border-radius: 6px;
    overflow: hidden;
    display: block;
}
.ps-result-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.ps-result-body { flex: 1; min-width: 0; }

.ps-result-meta {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 6px;
    flex-wrap: wrap;
}

.ps-badge {
    display: inline-block;
    background: var(--ps-accent-soft);
    color: var(--ps-accent);
    font-size: .7rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .06em;
    padding: 2px 8px;
    border-radius: 50px;
}

.ps-date {
    font-size: .8rem;
    color: var(--ps-muted);
}

.ps-result-title {
    font-size: 1.1rem;
    font-weight: 700;
    margin: 0 0 6px;
    font-family: var(--ps-font);
    line-height: 1.3;
}
.ps-result-title a {
    color: var(--ps-primary);
    text-decoration: none;
    transition: color .2s;
}
.ps-result-title a:hover { color: var(--ps-accent); }

.ps-result-excerpt {
    font-size: .9rem;
    color: var(--ps-muted);
    margin: 0 0 10px;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Highlight */
.ps-result-title mark,
.ps-result-excerpt mark {
    background: #fff3b0;
    color: inherit;
    padding: 0 2px;
    border-radius: 2px;
}

/* ---- Terms ---- */
.ps-result-terms { display: flex; flex-wrap: wrap; gap: 6px; }

.ps-term {
    font-size: .75rem;
    padding: 2px 8px;
    border-radius: 50px;
    text-decoration: none;
    transition: all .2s;
}
.ps-term-cat {
    background: #f0f4ff;
    color: #3b5bdb;
    border: 1px solid #c5d3f8;
}
.ps-term-cat:hover { background: #3b5bdb; color: #fff; }

.ps-term-tag {
    background: var(--ps-bg);
    color: var(--ps-muted);
    border: 1px solid var(--ps-border);
}
.ps-term-tag:hover { background: var(--ps-text); color: #fff; }

/* ---- Sem resultados ---- */
.ps-no-results {
    text-align: center;
    padding: 4rem 2rem;
    color: var(--ps-muted);
}
.ps-no-results-icon { font-size: 3rem; margin-bottom: 1rem; }
.ps-no-results h3 { color: var(--ps-text); margin: 0 0 .5rem; }

/* ---- Erro ---- */
.ps-error {
    background: #fff5f5;
    border: 1px solid #fecaca;
    border-radius: var(--ps-radius);
    padding: 1rem 1.25rem;
    color: #dc2626;
}

/* ---- Paginação ---- */
.ps-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 2rem;
    flex-wrap: wrap;
}

.ps-page-btn {
    padding: 8px 18px;
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    text-decoration: none;
    color: var(--ps-text);
    font-size: .875rem;
    background: var(--ps-white);
    transition: all .2s;
}
.ps-page-btn:hover { border-color: var(--ps-accent); color: var(--ps-accent); }

.ps-page-numbers { display: flex; gap: 4px; }

.ps-page-num {
    width: 36px;
    height: 36px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--ps-border);
    border-radius: var(--ps-radius);
    text-decoration: none;
    color: var(--ps-text);
    font-size: .875rem;
    background: var(--ps-white);
    transition: all .2s;
}
.ps-page-num:hover   { border-color: var(--ps-accent); color: var(--ps-accent); }
.ps-page-active {
    background: var(--ps-accent) !important;
    border-color: var(--ps-accent) !important;
    color: #fff !important;
    font-weight: 700;
}

/* ---- Responsive ---- */
@media ( max-width: 640px ) {
    .ps-search-bar { border-radius: var(--ps-radius); padding: 4px 12px; }
    .ps-btn-search { padding: 8px 16px; font-size: .875rem; }
    .ps-filters { flex-direction: column; }
    .ps-filter-group select,
    .ps-filter-group input[type="date"] { width: 100%; }
    .ps-result-thumb { width: 80px; height: 60px; }
    .ps-result-title { font-size: 1rem; }
}

/* ---- Page wrapper — centraliza e protege das margens do tema ---- */
.ps-page-wrap {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    padding: 2rem 20px;
    margin: 0 auto;
}

@media ( min-width: 768px ) {
    .ps-page-wrap {
        padding: 2rem 30px;
    }
}