/*
 * AI-Cazare.ro — Pagina /cazare/oras/{slug}/ (listare unități pe oraș)
 * Fișier: /assets/css/pages/oras.css
 *
 * Folosit doar de pages/oras.php
 *
 * NOTĂ: .unit-card aici suprascrie .unit-card din style.css global.
 *       Inline avea display:block + box-shadow mai mic decât varianta globală.
 *       Ordinea încărcării (style.css → oras.css prin $extra_head) garantează
 *       că oras.css câștigă pe această pagină.
 *
 * NOTĂ: .breadcrumb duplicat cu legal.css și alte 7 pagini.
 *       Va fi unificat în iterație dedicată după refactorul complet pages/.
 */

/* ── Container și hero gradient ──────────────────────────────── */
.oras-wrap{max-width:1200px;margin:0 auto;padding:20px 16px}
.oras-hero{
    background:linear-gradient(135deg,#0f172a,#1e293b);
    border-radius:18px;
    padding:32px;
    margin-bottom:24px;
    color:#fff;
    position:relative;
    overflow:hidden;
}
.oras-hero::before{
    content:'';
    position:absolute;
    right:-40px;top:-40px;
    width:200px;height:200px;
    border-radius:50%;
    background:rgba(249,115,22,.15);
}

/* ── Grid carduri unități (override .unit-card global) ───────── */
.unitati-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:16px;
}
.unit-card{
    background:#fff;
    border-radius:14px;
    overflow:hidden;
    box-shadow:0 1px 4px rgba(0,0,0,.07);
    text-decoration:none;
    display:block;
    transition:transform .15s,box-shadow .15s;
}
.unit-card:hover{
    transform:translateY(-3px);
    box-shadow:0 6px 20px rgba(0,0,0,.1);
}
.unit-card-img{
    width:100%;height:175px;
    object-fit:cover;
    background:#f1f5f9;
}
.unit-card-img-ph{
    width:100%;height:175px;
    background:linear-gradient(135deg,#f1f5f9,#e2e8f0);
    display:flex;align-items:center;justify-content:center;
    font-size:36px;
}
.unit-card-body{padding:14px}

/* ── Sort tabs (filtre sus de listă) ─────────────────────────── */
.sort-tabs{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:14px}
.sort-tab{
    padding:5px 14px;
    border-radius:999px;
    font-size:12px;font-weight:700;
    text-decoration:none;
    border:1.5px solid #e2e8f0;
    color:#64748b;
    transition:all .12s;
}
.sort-tab:hover,
.sort-tab.active{
    border-color:#f97316;
    color:#f97316;
    background:#fff7ed;
}

/* ── Breadcrumb (duplicat — va fi unificat ulterior) ─────────── */
.breadcrumb{
    display:flex;align-items:center;gap:6px;
    font-size:12px;color:#94a3b8;
    margin-bottom:16px;
    flex-wrap:wrap;
}
.breadcrumb a{color:#64748b;text-decoration:none}
.breadcrumb a:hover{color:#f97316}

/* ── Pagination (jos de listă) ───────────────────────────────── */
.pagination{
    display:flex;gap:6px;
    justify-content:center;
    margin-top:28px;
    flex-wrap:wrap;
}
.page-btn{
    width:38px;height:38px;
    border-radius:10px;
    border:1.5px solid #e2e8f0;
    font-size:13px;font-weight:700;
    color:#64748b;
    text-decoration:none;
    display:inline-flex;
    align-items:center;justify-content:center;
    transition:all .12s;
}
.page-btn:hover{border-color:#f97316;color:#f97316}
.page-btn.active{
    background:#f97316;
    border-color:#f97316;
    color:#fff;
}
.page-btn.disabled{opacity:.4;pointer-events:none}

/* ── Responsive grid ─────────────────────────────────────────── */
@media(max-width:1100px){
    .unitati-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:600px){
    .unitati-grid{grid-template-columns:1fr}
}