
main.container.my-4{
  min-height: clamp(220px, 30vh, 800px);
  height: auto !important;
  transition: none !important;
}

ins.adsbygoogle[data-ad-status="unfilled"] {
    display: none !important;
}

@media only screen and (max-width: 767px) {
    /* Elimină spațiul deasupra reclamei */
    .adsbygoogle, .code-block {
        margin-top: -10px !important; 
        margin-bottom: 0 !important;
    }
    
    /* Elimină spațiul de sub imaginea reclamei */
    div[id^="google_ads_iframe"], ins.adsbygoogle {
        padding: 0 !important;
        margin: 0 !important;
    }
}

/* Stil pentru butonul de switch */
.btn-theme {
  background: rgba(0,0,0,0.05);
  border: 1px solid rgba(0,0,0,0.1);
  border-radius: 50%;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  color: #1f2937;
  margin-left: 10px;
}

.btn-theme:hover { background: rgba(0,0,0,0.1); transform: scale(1.1); }

/* --- CULORI DARK MODE --- */
body.dark-mode {
  --bg-global: #0f172a;
  --bg-card: #1e293b;
  --text-main: #f1f5f9;
  --text-muted: #94a3b8;
  --border-color: rgba(255, 255, 255, 0.1);
  --brand: #7c9dff;
}

body.dark-mode {
  background-color: var(--bg-global) !important;
  color: var(--text-main) !important;
}

/* 1. Definim culorile direct aici pentru a fi siguri că funcționează */
:root {
    --search-bg: #f9fafb;
    --search-card: #ffffff;
    --search-text: #1f2937;
    --search-muted: #6b7280;
    --search-border: rgba(0,0,0,0.08);
}

/* 2. Culorile pentru Dark Mode */
body.dark-mode {
    --search-bg: #0f172a;
    --search-card: #1e293b;
    --search-text: #f1f5f9;
    --search-muted: #94a3b8;
    --search-border: rgba(255,255,255,0.1);
}

/* 3. Aplicăm stilurile folosind aceste variabile */
.search-wrap { 
    max-width: 1140px; 
    margin: 0 auto; 
    padding: 20px 12px;
}

.search-title { 
    margin: 40px 0 20px; 
    color: var(--search-text) !important; /* Forțăm culoarea titlului */
    text-align: center; 
    font-weight: 700;
}

.search-grid { 
    display: grid; 
    grid-template-columns: 1fr; 
    gap: 25px; 
}

@media (min-width: 768px) { 
    .search-grid { grid-template-columns: repeat(2, 1fr); } 
}

.search-card { 
    background-color: var(--search-card) !important; 
    border: 1px solid var(--search-border) !important; 
    border-radius: 16px; 
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
    overflow: hidden; 
    transition: transform 0.2s ease;
}

.search-quote { 
    color: var(--search-text) !important; 
    font-size: 1.05rem;
    font-style: italic;
    text-align: center;
    margin: 10px 0;
}

.search-share { 
    border-top: 1px solid var(--search-border); 
    padding-top: 15px;
    display: flex;
    justify-content: center;
    gap: 20px;
}

.search-share a { 
    color: var(--search-text) !important; 
    opacity: 0.7;
    font-size: 1.2rem;
}

/* Stilizare Paginare */
.pagination a { 
    background: var(--search-card) !important; 
    color: var(--search-text) !important; 
    border: 1px solid var(--search-border) !important;
    padding: 10px 18px;
    border-radius: 8px;
    text-decoration: none;
    font-weight: bold;
}

.pagination a.active { 
    background: #2563eb !important; /* Albastru standard pentru activ */
    color: #ffffff !important; 
}

/* Aplicarea clasei dark-mode pe elementele tale */
body.dark-mode .navbar.fixed-top, 
body.dark-mode footer.citatul-footer, 
body.dark-mode #footer-buttons,
body.dark-mode .quote-card, 
body.dark-mode .card, 
body.dark-mode .meniul a.link, 
body.dark-mode .recent-posts-list a, 
body.dark-mode .citatul-zilei-container, 
body.dark-mode .qotd-box,
body.dark-mode #footer-buttons .buton,
body.dark-mode .quote-list-item,
body.dark-mode .share-bar .share-btn {
  background: var(--bg-card) !important;
  color: var(--text-main) !important;
  border-color: var(--border-color) !important;
}

body.dark-mode a, 
body.dark-mode .h1, 
body.dark-mode .qotd-text,
body.dark-mode .qli-body .quote-quote {
  color: var(--text-main) !important;
}

/* Schimbarea iconiței în buton când e activ dark mode */
body.dark-mode .btn-theme {
  background: rgba(255,255,255,0.1);
  color: #fbbf24; /* Galben solar */
  border-color: rgba(255,255,255,0.2);
}

/* Regula forțată pentru DARK MODE */
body.dark-mode main#page-wrap > article.card {
    background-color: #1e293b !important; /* Culoarea din prima ta imagine (navy/dark) */
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
    color: #f1f5f9 !important;
}

/* Fix pentru textul din interior care rămâne negru */
body.dark-mode main#page-wrap > article.card .text-muted,
body.dark-mode main#page-wrap > article.card .small {
    color: #94a3b8 !important;
}

/* Fundalul principal al cardului (scăpăm de alb) */
body.dark-mode main#page-wrap > article.card {
    background-color: #1e293b !important;
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* TEXTUL PRINCIPAL: Titlu, Autor, Categorie, Dificultate */
body.dark-mode main#page-wrap > article.card header.qt-top-meta h1,
body.dark-mode main#page-wrap > article.card header.qt-top-meta h3,
body.dark-mode main#page-wrap > article.card header.qt-top-meta .text-muted,
body.dark-mode main#page-wrap > article.card header.qt-top-meta .small,
body.dark-mode .qt-title,
body.dark-mode .qt-meta p {
    color: #f1f5f9 !important; /* Alb mat/gri deschis */
}

/* TEXTUL DIN CITAT (Blockquote din dreapta) */
body.dark-mode main#page-wrap > article.card .card-body blockquote.quote-quote,
body.dark-mode main#page-wrap > article.card .card-body .quote-quote {
    color: #f8fafc !important; /* Aproape alb */
}

/* BUTOANELE (Copiază, Favorite, Raportează) */
body.dark-mode .card-body .btn,
body.dark-mode .card-body .btn-outline-secondary,
body.dark-mode .share-bar .share-btn {
    background: rgba(255, 255, 255, 0.05) !important;
    color: #f1f5f9 !important;
    border: 1px solid rgba(255, 255, 255, 0.2) !important;
}

/* Efect de hover pe butoane pentru feedback vizual */
body.dark-mode .card-body .btn:hover {
    background: rgba(255, 255, 255, 0.1) !important;
    color: #fff !important;
}

/* Stelutele de vot (Votează:) */
body.dark-mode .qt-meta, 
body.dark-mode span[style*="color: rgb(33, 37, 41)"] {
    color: #cbd5e1 !important;
}

/* --- Stil Butoane Acțiune (Dark Mode) --- */
body.dark-mode main#page-wrap > article.card > .card-body .row.g-2 .btn,
body.dark-mode .share-bar .share-btn {
    background-color: rgba(255, 255, 255, 0.05) !important; /* Fundal foarte ușor gri/transparent */
    color: #f1f5f9 !important;                             /* Text alb mat */
    border: 1px solid rgba(255, 255, 255, 0.2) !important;  /* Bordură fină vizibilă */
    transition: all 0.2s ease !important;
}

/* Forțăm iconițele (Bootstrap Icons) să fie albe */
body.dark-mode main#page-wrap > article.card > .card-body .row.g-2 .btn i,
body.dark-mode .share-bar .share-btn i {
    color: #f1f5f9 !important;
}

/* Efect de Hover (când treci cu mouse-ul peste ele) */
body.dark-mode main#page-wrap > article.card > .card-body .row.g-2 .btn:hover,
body.dark-mode .share-bar .share-btn:hover {
    background-color: rgba(255, 255, 255, 0.15) !important;
    border-color: var(--brand) !important;                 /* Marginea devine albastră la hover */
    color: #ffffff !important;
}

/* Fix pentru textul specific de lângă iconițe (dacă există label) */
body.dark-mode .btn-label {
    color: #f1f5f9 !important;
}

/* Fix pentru textul "Votează:" și steluțe */
body.dark-mode .qt-meta, 
body.dark-mode .qt-meta b,
body.dark-mode .qt-meta span {
    color: #cbd5e1 !important; /* Gri deschis */
}
/* --- Fix pentru textul "Votează:" (Dark Mode) --- */
body.dark-mode .label-vote {
    color: #f1f5f9 !important; /* Un alb mat, mult mai lizibil decât #444 */
    text-shadow: 0 1px 2px rgba(0,0,0,0.5); /* Opțional: adaugă puțină profunzime */
}

/* Dacă vrei ca și restul textului de rating (ex: "0/5 din 0") să fie vizibil */
body.dark-mode .label-vote + span, 
body.dark-mode .label-vote ~ span {
    color: #94a3b8 !important; /* Gri deschis pentru cifrele de rating */
}

/* Schimbă logo-ul automat în Dark Mode */
body.dark-mode .navbar-brand img {
    content: url("/resurse/logo/logoalb.svg") !important;
}

/* Ajustare opțională pentru contrastul navbar-ului */
body.dark-mode .navbar.fixed-top {
    background-color: rgba(30, 41, 59, 0.8) !important; /* Semi-transparent navy */
    backdrop-filter: blur(10px);
    border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}
/* Stil SEO Box */
.author-info-alert {
    background-color: #ffffff;
    border: 1px dotted #dee2e6; /* Border punctat pentru un look de "notă" */
    border-radius: 15px;
}

.seo-title-group h2 {
    color: #212529;
    font-size: 1.1rem;
}

/* Accent pe cuvinte cheie în Dark Mode */
body.dark-mode .author-info-alert {
    background-color: #1a202c !important;
    border-color: rgba(255, 255, 255, 0.05) !important;
}

body.dark-mode .seo-title-group h2 {
    color: #f1f5f9 !important;
}

body.dark-mode .text-recunostinta strong {
    color: #ffc107 !important; /* Subliniem entitatea (autorul) cu galben */
}
/* --- Stiluri de bază pentru Light Mode (dacă nu sunt deja) --- */
.custom-author-list .list-group-item {
    background-color: #ffffff;
    border-color: #dee2e6;
}

.custom-author-list .list-group-item a {
    color: #0d6efd; /* Albastru standard Bootstrap */
}

/* --- Stiluri pentru DARK MODE --- */
body.dark-mode .custom-author-list .list-group-item {
    background-color: #1a202c !important; /* Fundal închis pentru rând */
    border-color: #2d3748 !important;   /* Bordură discretă */
}

body.dark-mode .custom-author-list .list-group-item a {
    color: #f1f5f9 !important; /* Textul autorului devine alb/gri deschis */
}

body.dark-mode .custom-author-list .list-group-item a:hover {
    color: #63b3ed !important; /* O nuanță de albastru mai deschis la hover */
}

body.dark-mode .custom-author-list .badge.bg-secondary {
    background-color: #4a5568 !important; /* Badge-ul devine un gri mai vizibil */
    color: #ffffff !important;
}
/* Stil Buton Adaugă (Light Mode) */
.btn-add-author {
    background-color: #0d6efd;
    color: #ffffff !important;
    border-radius: 50px; /* Buton tip pastilă */
    padding: 10px 25px;
    font-weight: 600;
    transition: all 0.3s ease;
    border: none;
    display: inline-flex;
    align-items: center;
}

.btn-add-author:hover {
    background-color: #0b5ed7;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(13, 110, 253, 0.3);
}

/* Stil pentru varianta DARK MODE */
body.dark-mode .text-muted {
    color: #cbd5e0 !important; /* Textul devine gri deschis pe negru */
}

body.dark-mode .btn-add-author {
    background-color: transparent;
    color: #63b3ed !important; /* Text albastru deschis */
    border: 2px solid #63b3ed;
}

body.dark-mode .btn-add-author:hover {
    background-color: #63b3ed;
    color: #1a202c !important; /* Text negru la hover pe albastru */
    box-shadow: 0 0 15px rgba(99, 179, 237, 0.4);
}
/* --- REPARARE PAGINARE DARK MODE --- */
body.dark-mode .pagination .page-link {
    background-color: #2d3748 !important; /* Gri închis pentru fundal */
    border-color: #4a5568 !important;   /* Bordură vizibilă */
    color: #f8fafc !important;           /* Text alb curat */
}

/* Starea pentru butoanele dezactivate (Anterior/Următor când nu există pagini) */
body.dark-mode .page-item.disabled .page-link {
    background-color: #1a202c !important;
    color: #718096 !important; /* Gri șters pentru butoane inactive */
    border-color: #2d3748 !important;
}

/* Hover pe butoanele de paginare */
body.dark-mode .page-link:hover {
    background-color: #4a5568 !important;
    border-color: #cbd5e0 !important;
}

/* --- REPARARE TEXT ȘI BUTON ADĂUGARE --- */
body.dark-mode .text-muted {
    color: #cbd5e0 !important; /* Face textul gri-deschis pe fundal negru */
}

body.dark-mode .btn-add-author {
    background-color: transparent;
    border: 2px solid #63b3ed; /* Contur albastru deschis */
    color: #63b3ed !important;
    padding: 10px 20px;
    border-radius: 50px;
    transition: 0.3s;
}

body.dark-mode .btn-add-author:hover {
    background-color: #63b3ed;
    color: #1a202c !important; /* Text negru la hover pentru contrast */
}
/* --- PAGINA TAGURI DARK MODE --- */

/* Literele (a-z) */
body.dark-mode .letters .btn-outline-primary {
    color: #63b3ed !important;
    border-color: #63b3ed !important;
}

body.dark-mode .letters .btn-primary {
    background-color: #63b3ed !important;
    border-color: #63b3ed !important;
    color: #1a202c !important; /* Text negru pe butonul activ pentru contrast */
}

/* Lista de taguri */
body.dark-mode .list-group-item {
    background-color: #1a202c !important;
    border-color: #2d3748 !important;
}

body.dark-mode .list-group-item a {
    color: #f1f5f9 !important; /* Text deschis la culoare */
}

body.dark-mode .list-group-item a:hover {
    color: #63b3ed !important;
}

/* Badge-uri (numere) */
body.dark-mode .badge.bg-secondary {
    background-color: #4a5568 !important;
    color: #ffffff !important;
}

/* Paginare (Fix final) */
body.dark-mode .pagination .page-link {
    background-color: #2d3748 !important;
    border-color: #4a5568 !important;
    color: #e2e8f0 !important;
}

body.dark-mode .page-item.disabled .page-link {
    background-color: #1a202c !important;
    color: #4a5568 !important;
}

/* Alerta de "Nu există cuvinte" */
body.dark-mode .alert-info {
    background-color: #2c5282 !important;
    color: #bee3f8 !important;
    border: none;
}
/* Containerul de butoane */
.share-bar {
    margin: 20px 0;
}

/* Stilul Monocrom (Adaptabil) */
.share-btn-mono {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    transition: all 0.3s ease;
    
    /* LIGHT MODE (Default) */
    background-color: #f1f3f5; /* Fundal gri foarte deschis */
    color: #343a40 !important;   /* Pictograma gri închis */
    border: 1px solid #dee2e6;
}

.share-btn-mono:hover {
    background-color: #343a40;
    color: #ffffff !important;
    transform: translateY(-3px);
}

/* --- DARK MODE (Fix pentru fundalul tău închis) --- */
body.dark-mode .share-btn-mono {
    background-color: #2d3748; /* Fundal gri-albăstrui închis */
    color: #e2e8f0 !important;   /* Pictograma alb-gri */
    border-color: #4a5568;
}

body.dark-mode .share-btn-mono:hover {
    background-color: #ffffff;
    color: #1a202c !important; /* Pictograma neagră pe fundal alb */
}

/* Asigurăm că SVG-urile moștenesc culoarea corectă */
.share-btn-mono svg {
    fill: currentColor;
}
body.dark-mode .quote-list-item {
    background: #1a202c; /* Fundal închis pentru card */
    border-color: rgba(255, 255, 255, .1);
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .3);
}

body.dark-mode .share-bar a {
    background: #2d3748; /* Fundal gri închis pentru cerculețe */
    border-color: rgba(255, 255, 255, .1);
    color: #e2e8f0 !important; /* Pictograme alb-gri pe Dark Mode */
}

body.dark-mode .share-bar a:hover {
    background: #ffffff;
    color: #1a202c !important; /* Pictograma devine neagră la hover pe alb */
}

/* Dacă ai text în interiorul qli-body, asigură-te că e alb pe Dark */
body.dark-mode .qli-body {
    color: #f7fafc;
}
/* Stil Titlu Pagină (Light Mode - Default) */
.dynamic-title {
    color: #374151; /* Culoarea ta originală */
    margin: 14px 0 5px;
    font-weight: 700;
}

/* Stil pentru varianta DARK MODE */
body.dark-mode .dynamic-title {
    color: #f1f5f9 !important; /* Devine alb-murdar pe fundal închis */
}

/* Ajustare pentru span-ul cu tag-ul căutat */
body.dark-mode .dynamic-title .text-primary {
    color: #63b3ed !important; /* Un albastru mai deschis, lizibil pe negru */
}

/* Fix pentru paragraful de suport SEO */
body.dark-mode .text-muted {
    color: #a0aec0 !important;
}
body.dark-mode .fav-header {
    color: #f1f5f9 !important; /* Titlu alb-gri */
}

body.dark-mode .fav-card {
    background: #1a202c; /* Fundal închis pentru card */
    border-color: rgba(255, 255, 255, .1);
    box-shadow: 0 .25rem .75rem rgba(0, 0, 0, .4);
}

body.dark-mode .fav-quote {
    color: #f8fafc !important; /* Textul citatului devine alb */
}

body.dark-mode .fav-title {
    color: #a0aec0 !important; /* Autorul/Titlul devine gri deschis */
}

body.dark-mode .fav-empty {
    background: #1e293b; /* Fundal pentru stare goală */
    border-color: #4a5568;
    color: #e2e8f0;
}

body.dark-mode .fav-note {
    color: #cbd5e0 !important; /* Nota de sub subsol devine vizibilă */
}

/* Fix pentru link-uri în interiorul cardului dacă există */
body.dark-mode .fav-body a {
    color: #63b3ed;
}
/* --- STILURI PAGINĂ ADĂUGARE (LIGHT MODE) --- */
#page-wrap h1 { color: #374151; font-weight: 700; }
.card { background: #fff; }

/* --- ADAPTARE DARK MODE --- */

/* 1. Titlu și Subtitlu */
body.dark-mode #page-wrap h1 {
    color: #f1f5f9 !important;
}

body.dark-mode #page-wrap .text-muted {
    color: #a0aec0 !important;
}

/* 2. Ghidul rapid (Alert) */
body.dark-mode .alert-secondary {
    background-color: #1e293b !important; /* Gri-albastru închis */
    border-color: #334155 !important;
    color: #e2e8f0 !important;
}

body.dark-mode .alert-secondary i {
    color: #63b3ed; /* Iconița devine albastru deschis */
}

/* 3. Cardul principal */
body.dark-mode .card {
    background-color: #1a202c !important;
    border: 1px solid rgba(255, 255, 255, .1) !important;
    box-shadow: 0 .5rem 1rem rgba(0, 0, 0, .2) !important;
}

/* 4. Elementele din formular (add.php) */
body.dark-mode input, 
body.dark-mode textarea, 
body.dark-mode select {
    background-color: #2d3748 !important; /* Fundal input închis */
    border-color: #4a5568 !important;
    color: #f8fafc !important;
}

body.dark-mode input:focus, 
body.dark-mode textarea:focus {
    background-color: #2d3748 !important;
    border-color: #63b3ed !important;
    box-shadow: 0 0 0 3px rgba(99, 179, 237, 0.2) !important;
}

/* 5. Label-urile din formular */
body.dark-mode label {
    color: #e2e8f0 !important;
}

/* 6. Butonul de trimitere (dacă e cel standard Bootstrap) */
body.dark-mode .btn-primary {
    background-color: #3182ce !important;
    border-color: #3182ce !important;
}

body.dark-mode .btn-primary:hover {
    background-color: #2b6cb0 !important;
}

body.dark-mode h1.display-6 {
    color: #f1f5f9 !important;
}

body.dark-mode .lead.text-muted {
    color: #cbd5e0 !important;
}

/* 2. Cardul Principal */
body.dark-mode .card.border-0.shadow-sm {
    background-color: #1a202c !important; 
    border: 1px solid rgba(255, 255, 255, 0.1) !important;
}

/* 3. Secțiunea din stânga (Siguranță) */
body.dark-mode .card h2.h4,
body.dark-mode .card h4.h3 {
    color: #f8fafc !important;
}

body.dark-mode .list-unstyled.text-muted {
    color: #a0aec0 !important;
}

body.dark-mode .list-unstyled i {
    color: #63b3ed; 
}

body.dark-mode .bg-light {
    background-color: #2d3748 !important;
}

body.dark-mode p.small.text-muted {
    color: #cbd5e0 !important;
}

/* 5. Formularul (Input și Buton) */
body.dark-mode .form-control {
    background-color: #1a202c !important;
    border-color: #4a5568 !important;
    color: #f8fafc !important;
}

body.dark-mode .form-control::placeholder {
    color: #718096;
}

body.dark-mode .form-control:focus {
    border-color: #63b3ed !important;
    box-shadow: 0 0 0 3px rgba(99, 179, 237, 0.2) !important;
}

/* 6. Alerte (Succes/Eroare) */
body.dark-mode .alert-success {
    background-color: rgba(72, 187, 120, 0.1) !important;
    border-color: #48bb78 !important;
    color: #9ae6b4 !important;
}

body.dark-mode .alert-success .text-muted {
    color: #cbd5e0 !important; /* Textul cu "renunță la cheie" */
}

body.dark-mode .alert-danger {
    background-color: rgba(245, 101, 101, 0.1) !important;
    border-color: #f56565 !important;
    color: #feb2b2 !important;
}

body.dark-mode .btn-outline-secondary {
    color: #e2e8f0 !important;
    border-color: #4a5568 !important;
}

body.dark-mode .btn-outline-secondary:hover {
    background-color: #4a5568 !important;
}
body.dark-mode a#theme-toggle, 
body.dark-mode a#theme-toggle span, 
body.dark-mode a#theme-toggle i,
body.dark-mode #theme-text {
    color: #ffffff !important;
    fill: #ffffff !important;
    opacity: 1 !important;
}

body.dark-mode a#theme-toggle {
    background-color: rgba(255, 255, 255, 0.1) !important;
    padding: 8px 15px;
    border-radius: 10px;
}
body.dark-mode .navbar-toggler {
    border-color: rgba(255, 255, 255, 0.5) !important;
}

body.dark-mode .navbar-toggler-icon {
    filter: invert(1) grayscale(1) brightness(2) !important;
}
/* Fundalul paginii când modalul e deschis */
.modal-backdrop.show {
    opacity: 0.8 !important;
}

/* --- LOGICA DE SWITCH PENTRU SVG-URI --- */

/* 1. Mod Luminos: Ascundem al doilea SVG (Soarele) */
#theme-toggle svg:nth-child(2) { 
    display: none !important; 
}

/* 2. Mod Întunecat: Inversăm vizibilitatea */
body.dark-mode #theme-toggle svg:nth-child(1) { 
    display: none !important; 
}

body.dark-mode #theme-toggle svg:nth-child(2) { 
    display: inline-block !important; 
    fill: #ffc107 !important; /* Culoare galbenă pentru soare */
}

/* 3. Stil buton pentru a fi identic cu Search */
.btn-theme-custom {
    width: 44px; /* Puțin mai lat pentru a respira iconița */
    height: 38px;
    background-color: #212529 !important;
    border: 1px solid #343a40 !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-right: 12px !important;
}
.authors-wrap { max-width:1140px; margin:0 auto; padding:0 12px; }
.quotes-grid{ display:grid; grid-template-columns:1fr; gap:20px; }
@media(min-width:768px){ .quotes-grid{ grid-template-columns:repeat(2,1fr);} }
.quote-list-item{ background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:16px; box-shadow:0 .25rem .75rem rgba(0,0,0,.05); overflow:hidden; }
.qli-media img{ width:100%; display:block; }
.qli-body{ padding:12px; }
.share-bar{ display:flex; justify-content:center; gap:14px; padding:8px 0; }
.share-bar a{ width:38px; height:38px; border-radius:50%; border:1px solid rgba(0,0,0,.12); display:flex; align-items:center; justify-content:center; background:#fff; text-decoration:none; transition:transform .15s ease; }
.share-bar a:hover{ transform:translateY(-2px); }
.fav-wrap{max-width:1140px;margin:0 auto;padding:0 12px;}
.fav-header{margin:18px 0 8px;color:#374151;}
.fav-grid{display:grid;grid-template-columns:1fr;gap:20px;}
@media (min-width:768px){ .fav-grid{grid-template-columns:repeat(2,1fr);} }
.fav-card{
  background:#fff;border:1px solid rgba(0,0,0,.06);border-radius:16px;
  box-shadow:0 .25rem .75rem rgba(0,0,0,.06);overflow:hidden;
  display:flex;flex-direction:column;
}
.fav-media img{display:block;width:100%;height:auto;}
.fav-body{padding:12px 14px;}
.fav-quote{
  margin:0 0 .35rem;
  font-size:1rem;line-height:1.55;color:#111;text-align:center;
}
.fav-title{
  font-size:.9rem;color:#6b7280;text-align:center;margin-top:4px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.fav-empty{
  background:#fff;border:1px dashed #e5e7eb;border-radius:12px;
  padding:20px;text-align:center;color:#374151;
}
.fav-note{color:#6b7280;font-size:.9rem;margin:14px 0 20px;}
/* functia de cautare */
.search-wrap { max-width: 1140px; margin: 0 auto; padding: 20px 12px; }
.search-title { color: #fff; text-align: center; margin: 30px 0; font-weight: 600; }
.search-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }


.search-card { background: #1a202c; border-radius: 12px; overflow: hidden; border: 1px solid #2d3748; transition: transform 0.2s; }
.search-media img { width: 100%; aspect-ratio: 16/10; object-fit: cover; display: block; }
.search-body { padding: 15px; line-height: 1.6; }
.search-quote-text { color: #e2e8f0; font-size: 0.95rem; font-style: italic; }
.read-more-inline { color: #cbd5e0; text-decoration: none; font-weight: bold; font-size: 0.85rem; white-space: nowrap; font-style: normal; }
.read-more-inline:hover { color: #fff; text-decoration: underline; }

#loading-sentinel { height: 100px; display: flex; align-items: center; justify-content: center; color: #94a3b8; font-weight: 500; }

@media (max-width: 767px) { 
    .search-grid { grid-template-columns: 1fr; } 
}
@media (max-width: 480px) {
  .recent-posts-list {
    display: flex !important;
    flex-wrap: wrap !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 10px !important;
  }
  .recent-posts-list li {
    flex: 1 1 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
    margin-bottom: 5px;
  }
  .recent-posts-list img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 5px;
  }
}
/* Stil mobil (sub 767px) */
@media (max-width: 767px) {
  .recent-posts-list {
    display: flex !important;
    flex-wrap: wrap !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 10px !important;
  }
  .recent-posts-list li {
    flex: 1 1 calc(50% - 10px) !important;
    max-width: calc(50% - 10px) !important;
  }
  
  /* Ascundem postarea cu numărul 15 pe mobil pentru a avea rânduri complete de câte 2 */
  .recent-posts-list li:nth-child(15) {
    display: none !important;
  }

  .recent-posts-list img {
    width: 100% !important;
    height: auto !important;
    display: block !important;
    border-radius: 5px;
  }
}
.breadcrumb-item + .breadcrumb-item::before {
    content: "›"; /* Un simbol mai fin decât "/" */
    font-size: 1.2rem;
    line-height: 1;
    vertical-align: middle;
}
/*----sfarsit darkmode-----*/

/* -------- Fonts: @font-face (potrivește calea reală) -------- */
@font-face {
  font-family: "Bootstrap Icons";
  src: url("/resurse/css/font/fonts/bootstrap-icons.woff2") format("woff2");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

/* Exemplu Open Sans (dacă servești local) - potrivește calea/variantele */
@font-face {
  font-family: "Open Sans";
  src: url("/resurse/fonts/open-sans-regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Open Sans";
  src: url("/resurse/fonts/open-sans-600.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* ====== Root & global helpers (corect, fără duplicate) ====== */
:root {
  --nav-offset: 72px;
  --fb-pad: 10px;
  --fb-gap: 10px;
  --fb-height: 56px;
  --brand: #5b7cfa;
}

/* Prevent horizontal overflow */
html, body {
  width: 100%;
  overflow-x: hidden !important;
  margin: 0 !important;
  max-width: 100vw !important;
  box-sizing: border-box;
  background: #f8fafc;
  padding-top: var(--nav-offset) !important;
}

/* Navbar / brand */
.navbar.fixed-top { min-height: var(--nav-offset); backdrop-filter: saturate(180%) blur(5px); }
.navbar .navbar-brand img {
  height: 48px;
  width: auto;
  display: block;
  aspect-ratio: 160 / 40;
}

/* simple spacer (if folosești .my-5 pentru offset) păstrează) */
.navbar + .my-5 { margin-top: calc(var(--nav-offset) + 8px); }

/* Generic link reset */
a, a:visited, a:hover, a:focus, a:active {
  color: #1f2937 !important;
  text-decoration: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Headings */
h1, .h1 { text-align: center; }

/* Buttons brand */
.btn-brand {
  background: transparent;
  border: 1px solid #ccc;
  color: #000 !important;
}
.btn-brand:hover {
  background: #f8f9fa;
  color: #0d6efd !important;
}

/* ===== Anti-CLS: main + recent posts ===== */
main.container.my-4 {
  min-height: clamp(220px, 30vh, 800px);
  height: auto !important;
  transition: none !important;
  box-sizing: border-box;
}

/* rezervă loc pentru lista de miniaturi */
.recent-posts-container { min-height: 240px; }

/* imagini: păstrează aspect ratio și împiedică overflow */
.recent-posts-list img,
.recent-posts-list img[loading] {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* ===== Meniul categorii (anti-CLS & responsive grid) ===== */
.meniul {
  margin: .5rem 0 1rem;
}
.meniul > ul {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 12px;
}
.meniul li { margin: 0; padding: 0; }
.meniul a.link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 14px;
  color: #212529;
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.04);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
  min-height: 56px;
  text-decoration: none;
  overflow: hidden;
}
.meniul a.link:hover, .meniul a.link:focus {
  transform: translateY(-2px);
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.08);
  border-color: rgba(13,110,253,.35);
}
.meniul a.link i[class^="bi"] {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(13,110,253,.08);
  color: #0d6efd;
  font-size: 18px;
  line-height: 1;
}

/* text + number in menu — anti-CLS */
.meniul .txt { font-weight: 600; min-width: 0; white-space: normal; overflow-wrap: anywhere; }
.meniul .count-wrap { margin-left: 6px; }
.meniul .count {
  position: relative;
  display: inline-block;
  font-variant-numeric: tabular-nums;
  min-width: 4ch; /* rezervă spațiu pt 4 cifre (ajustează dacă e nevoie) */
  text-align: right;
}
.meniul .count .ghost { visibility: hidden; display: inline-block; font-variant-numeric: inherit; }
.meniul .count .n { position: absolute; left: 0; top: 0; font-variant-numeric: inherit; }

/* Mobile tweaks */
@media (max-width: 360px) {
  .meniul .label { font-size: 0.95em; }
}

/* ===== Recent posts grid (cards) ===== */
.recent-posts-container { width: 100%; margin-top: .5rem; }
.recent-posts-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 16px;
}
.recent-posts-list > li { display: block !important; width: auto !important; }

/* card style kept */
.recent-posts-list a {
  display: block;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 .25rem .75rem rgba(0,0,0,.06);
  transition: transform .15s ease, box-shadow .15s ease;
}
.recent-posts-list a:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(0,0,0,.08); }

/* ===== QOTD (citatul zilei) ===== */
.citatul-zilei-container {
  background: #fff;
  border: 1px solid rgba(0,0,0,.08);
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.05);
  border-radius: 1rem;
  padding: 1.25rem;
}

/* ===== Layout & grid helpers ===== */
#page-wrap {
  max-width: 1140px;
  width: 100%;
  margin: 0 auto;
  padding: 0 12px;
  box-sizing: border-box;
}
#page-wrap, #page-wrap * { box-sizing: border-box; }

/* Masonry-like layout (unchanged) */
@media (min-width: 992px) {
  .masonry { column-count: 3; column-gap: 1rem; }
  .masonry > .masonry-item { break-inside: avoid; }
}
@media (min-width: 1400px) { .masonry { column-count: 4; } }

/* Quote cards */
.card { border-radius: 1rem; }
.quote-card {
  transition: transform .15s ease, box-shadow .15s ease;
  border: 1px solid rgba(0,0,0,.06);
  background: #fff;
}
.quote-card:hover { transform: translateY(-2px); box-shadow: 0 .5rem 1rem rgba(0,0,0,.08); }

/* line-clamp helpers */
.line-clamp-2, .line-clamp-4 { display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; }
.line-clamp-2 { -webkit-line-clamp: 2; }
.line-clamp-4 { -webkit-line-clamp: 4; }

/* quotes grid */
.quotes-grid { display: grid; gap: 20px; }
@media (min-width: 692px) { .quotes-grid { grid-template-columns: repeat(2, minmax(0,1fr)); } }

/* ===== Footer buttons (responsive) ===== */
#footer-buttons {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 16px;
  justify-items: center;
  align-items: center;
  width: 100%;
  max-width: 100vw;
  box-sizing: border-box;
}
#footer-buttons .buton {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  line-height: 1;
  font-weight: 700;
  border-radius: 12px;
  min-height: 52px;
  padding: .55rem 1.1rem;
  color: #0f172a;
  background: #fff;
  border: 1px solid #e5e7eb;
}
#footer-buttons .buton .bi { font-size: 1.25em; transform: translateY(-0.5px); }

/* Mobile: fixed bottom bar */
@media (max-width: 991.98px) {
  #footer-buttons {
    position: fixed !important;
    left: 0; right: 0; bottom: 0;
    margin: 0;
    background: #fff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 -4px 18px rgba(0,0,0,.14);
    border-radius: 0;
    padding: var(--fb-pad);
    padding-bottom: calc(var(--fb-pad) + env(safe-area-inset-bottom));
    z-index: 1200;
  }
  body { padding-bottom: calc(var(--fb-height) + 2*var(--fb-pad) + env(safe-area-inset-bottom)) !important; }
}

/* Desktop: static, centered bar */
@media (min-width: 992px) {
  #footer-buttons {
    position: static !important;
    width: auto; max-width: 1100px !important;
    margin: 28px auto !important;
    display: flex;
    justify-content: space-between !important;
    gap: 20px;
    padding: 12px 24px !important;
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(0,0,0,.10);
  }
  #footer-buttons .buton { min-height: 60px; padding: .6rem 1.2rem; font-size: 1.15rem; }
  body { padding-bottom: 0; }
}

/* ===== Footer modern (unchanged look) ===== */
footer.citatul-footer {
  --bg: #f9f9fb; --fg: #222; --muted: #555; --chip: #fff;
  padding: 36px 16px 20px;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
  border-top: 1px solid #e0e0e5;
  background: var(--bg);
  color: var(--fg);
}

/* small helpers & fixes */
.cf-divider { height: 3px; margin: 20px 0 15px; border-radius: 999px; background: linear-gradient(90deg,#6e7ff5,#7fd4ff,#a56ef5); opacity: .8; }
.cf-links { display: flex; flex-wrap: wrap; gap: 10px 18px; justify-content: center; font-size: 14px; }
.cf-meta { margin-top: 10px; text-align: center; font-size: 13px; color: var(--muted); }

/* Prevent horizontal overflow for cards / grids */
.quotes-grid, .quote-list-item { max-width: 100%; overflow-x: hidden; box-sizing: border-box; }
.quote-list-item { overflow: hidden; position: relative; }

/* Keep image containers full-bleed visually but never exceed viewport */
.quote-list-item .qli-media {
  margin: -12px -12px 8px;
  width: calc(100% + 24px);
  max-width: 100vw;
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 12px 12px 0 0;
}
@media (max-width: 420px) {
  .quote-list-item .qli-media { margin-left: -6px; margin-right: -6px; width: calc(100% + 12px); }
}
.qli-media img { display:block; width:100%; height:auto; max-width:100vw; object-fit:cover; }

/* Accessibility: tabular numbers where used */
.meniul .count, .meniul .count .n, .meniul .count .ghost { font-variant-numeric: tabular-nums; }


/* ---- Container global ---- */
#page-wrap{max-width:1140px;width:100%;margin:0 auto;padding:0 12px}
#page-wrap .h1{font-weight:800;font-size:clamp(1.25rem,1rem + 1.2vw,2rem);line-height:1.2;color:#111827!important;margin:.5rem 0 1rem}
#page-wrap,#page-wrap *{box-sizing:border-box}
#page-wrap center{display:block;text-align:initial}
#page-wrap center>*{display:block;width:100%;margin-left:0;margin-right:0}
#page-wrap>*{float:none!important;clear:both}
#page-wrap img,#page-wrap iframe{max-width:100%;height:auto}

/* ---- Navbar ---- */
.navbar.fixed-top{backdrop-filter:saturate(180%) blur(5px)}
.navbar-light .navbar-toggler-icon{background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%280,0,0,0.7%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e")}
.navbar .navbar-brand img{height:48px;width:auto;display:block}

/* ---- Butoane brand ---- */
.btn-brand{background:var(--brand);border-color:var(--brand);color:#fff}
.btn-brand:hover{background:#4b6df6;border-color:#4b6df6;color:#fff}
.btn-outline-brand{color:var(--brand);border-color:var(--brand)}
.btn-outline-brand:hover{background:var(--brand);color:#fff}

/* ---- Hero ---- */
.hero{background:radial-gradient(1200px 500px at 10% -20%,rgba(91,124,250,.25),transparent),radial-gradient(1200px 500px at 90% -20%,rgba(0,194,168,.25),transparent),linear-gradient(180deg,#fff 0%,#f8fafc 100%)}

/* ---- Carduri citate ---- */
.card{border-radius:1rem}
.quote-card{transition:transform .15s ease,box-shadow .15s ease;border:1px solid rgba(0,0,0,.06);background:#fff}
.quote-card:hover{transform:translateY(-2px);box-shadow:0 .5rem 1rem rgba(0,0,0,.08)}
.quote-mark{font-size:3rem;line-height:1;color:var(--brand);opacity:.35}
.badge-clean{background:rgba(0,0,0,.05)}
.author-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover}

/* Clampează descrieri lungi */
.line-clamp-2,.line-clamp-4{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.line-clamp-2{-webkit-line-clamp:2}
.line-clamp-4{-webkit-line-clamp:4}

/* ---- Masonry-like (coloane CSS) pentru liste de citate ---- */
@media (min-width:992px){.masonry{column-count:3;column-gap:1rem}.masonry>.masonry-item{break-inside:avoid}}
@media (min-width:1400px){.masonry{column-count:4}}

/* ---- Citatul zilei ---- */
.citatul-zilei-container{background:#fff;border:1px solid rgba(0,0,0,.08)!important;box-shadow:0 .5rem 1rem rgba(0,0,0,.05)!important;border-radius:1rem!important;padding:1.25rem!important}

/* ===== CATEGORII — auto-fit grid ===== */
.meniul{margin:.5rem 0 1rem}
.meniul>ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.meniul>ul>li{margin:0;padding:0}
.meniul a.link{display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;color:#212529;box-shadow:0 .25rem .75rem rgba(0,0,0,.04);transition:transform .15s ease,box-shadow .15s ease,border-color .15s ease;min-height:56px;text-decoration:none}
.meniul a.link i[class^="bi"]{flex:0 0 auto;width:36px;height:36px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;background:rgba(13,110,253,.08);color:#0d6efd;font-size:18px;line-height:1}
.meniul a.link .txt{font-weight:600;min-width:0;white-space:normal;overflow-wrap:anywhere}
.meniul a.link:hover,.meniul a.link:focus{transform:translateY(-2px);box-shadow:0 .5rem 1rem rgba(0,0,0,.08);border-color:rgba(13,110,253,.35)}
.meniul a.link::after{content:"›";margin-left:auto;opacity:.45;transition:transform .15s ease,opacity .15s ease}
.meniul a.link:hover::after{transform:translateX(2px);opacity:.7}
.meniul ul,.meniul li a{background:transparent!important}
.meniul a.link,.meniul a.link:visited,.meniul a.link:hover,.meniul a.link:focus{color:#212529!important;background:#fff!important;text-decoration:none!important}
.meniul li a:hover{background:#fff!important;color:#212529!important}
.meniul a.link i[class^="bi"],.meniul a.link:hover i[class^="bi"]{color:#0d6efd!important}

/* ===== ULTIMELE CITATE — grid responsiv ===== */
.recent-posts-container{width:100%;margin-top:.5rem}
.recent-posts-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.recent-posts-list>li{display:block!important;width:auto!important}
.recent-posts-list a{display:block;border-radius:12px;overflow:hidden;background:#fff;border:1px solid rgba(0,0,0,.08);box-shadow:0 .25rem .75rem rgba(0,0,0,.06);transition:transform .15s ease,box-shadow .15s ease;text-decoration:none!important}
.recent-posts-list a:hover{transform:translateY(-2px);box-shadow:0 .5rem 1rem rgba(0,0,0,.08)}
.recent-posts-list img{display:block;width:100%;aspect-ratio:16/9;height:auto;object-fit:cover}
#page-wrap .recent-posts-list li,#page-wrap .recent-posts-list a{border-bottom:none!important}
@media (max-width:575.98px){#page-wrap .recent-posts-list{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px}#page-wrap .recent-posts-list>li{width:auto!important;display:block!important;grid-column:auto!important}#page-wrap .recent-posts-list img{width:100%;height:auto;object-fit:cover}}

/* ---- Breadcrumb clasic ---- */
.breadcrumb{display:table;margin:20px auto;white-space:nowrap}
.breadcrumb-item+.breadcrumb-item::before{content:"›";color:#aaa;margin:0 8px}

/* ---- Pagination discretă ---- */
.pagination a{display:inline-block;padding:.5rem .75rem;border:1px solid #ddd;margin:0 .25rem;border-radius:.5rem;color:#000;text-decoration:none}
.pagination a:hover{background:#f4f4f4}
.pagination .active{background:#e9ecef;border-color:#e9ecef}
.pagination .disabled{pointer-events:none;opacity:.6}

/* ---- Blockquote aspect curat ---- */
blockquote{font-style:italic;color:#555;padding-left:16px;margin:20px 0;line-height:1.6}
blockquote::before{content:''}

/* ---- Tabele responsive simple ---- */
table{width:100%;border-collapse:collapse;margin-bottom:20px}
th,td{padding:10px;text-align:left;border-bottom:1px solid #dee2e6}
th{background:#343a40;color:#fff}
@media (max-width:768px){table{display:block;overflow:auto}}


/* ---- Ascunde meniul vechi ---- */
#myLinks,.topnav,.meniul-vechi{display:none!important}

/* ====== QOTD (citatul zilei) ====== */
.qotd .qotd-box{position:relative;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;padding:20px 22px;box-shadow:0 .25rem .75rem rgba(0,0,0,.05)}
.qotd .qotd-box::before{content:"";position:absolute;inset:0 auto 0 0;width:6px;border-radius:14px 0 0 14px;background:var(--brand,#5b7cfa)}
.qotd .qotd-meta{font-size:.9rem;color:#6c757d;margin-bottom:.35rem}
.qotd .qotd-text{font-family:"Playfair Display",Georgia,"Times New Roman",serif;font-weight:600;font-size:clamp(1.2rem,1rem + 1vw,1.8rem);line-height:1.45;color:#1f2937;margin:0;display:block!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important;-webkit-line-clamp:unset!important;line-clamp:unset!important;-webkit-box-orient:unset!important}
.qotd .qotd-text a,.qotd .qotd-text a:visited,.qotd .qotd-text a:hover,.qotd .qotd-text a:focus{color:inherit!important;text-decoration:none!important;border:0!important;box-shadow:none!important;white-space:inherit!important;overflow:visible!important;text-overflow:clip!important}
@media (max-width:575.98px){.qotd .qotd-box{padding:16px 18px}}



/* Single quote page */
.quote-two-col{display:grid;gap:24px}
@media(min-width:992px){.quote-two-col{grid-template-columns:1fr 1fr;align-items:center;grid-template-areas:"media header" "media body" "media body"}.qt-media{grid-area:media}.qt-header{grid-area:header}.qt-body{grid-area:body}.qt-body .share-bar{justify-content:flex-start}}
@media(max-width:991.98px){.qt-body{display:block}.qt-body .share-bar{justify-content:center}}
.qt-header{margin-bottom:.5rem}
.qt-title{line-height:1.00}
.qt-meta p{margin:.25rem 0 .5rem}
.quote-view img{border:0!important;box-shadow:none!important;outline:none!important}


/* ===== Grid / listă de citate (desktop + mobil) ===== */
.quotes-grid{display:grid;gap:20px}
@media(min-width:692px){.quotes-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}

.quote-list-item{
  display:flex;flex-direction:column;gap:10px;
  padding:12px;background:#fff;
  border:1px solid rgba(0,0,0,.06);
  border-radius:16px;box-shadow:0 .25rem .6rem rgba(0,0,0,.06);
  margin-bottom:1rem;
}

/* imagine: resetare globală (radius pe container, nu pe IMG) */
.qli-media img{
  display:block;width:100%;height:auto;
  border:0!important;box-shadow:none!important;outline:none!important;border-radius:0!important;
}

/* Desktop: imaginea „lipită” de marginile cardului sus, fără bandă albă */
.quote-list-item .qli-media{
  margin:-12px -12px 8px;            /* compensează paddingul cardului */
  border-radius:12px 12px 0 0;       /* colțuri sus ca la card */
  overflow:hidden;
}

/* Text citat din card */
.qli-body{display:flex;flex-direction:column}
.qli-body .quote-quote{
  margin:.35rem 0 .25rem;max-width:unset;text-align:left;
  font-family:"Merriweather",Georgia,"Times New Roman",serif;
  font-weight:600;font-style:italic;
  font-size:clamp(1rem,.95rem + .5vw,1.25rem);
  line-height:1.45;color:#1f2937;
}
/* în listă: centrare și lățime comfort */
.quotes-grid .quote-list-item .qli-body .quote-quote{
  text-align:center;max-width:48ch;margin-left:auto;margin-right:auto;
}




/* ==== Share bar (unic) ==== */
.share-bar{display:flex;align-items:center;flex-wrap:wrap;gap:12px;justify-content:center;margin-inline:auto}
.share-bar .share-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:999px;background:#fff;border:1px solid rgba(0,0,0,.10);box-shadow:0 .25rem .75rem rgba(0,0,0,.06);transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background-color .12s ease;color:#111!important;font-size:20px;line-height:1;cursor:pointer}
.share-bar .share-btn i{font-size:20px;line-height:1}
.share-bar .share-btn:hover{transform:translateY(-1px);box-shadow:0 .5rem 1rem rgba(0,0,0,.10);border-color:rgba(13,110,253,.25)}
.share-bar .whatsapp:hover{background:#25D366!important;border-color:#25D366!important;color:#fff!important}
.share-bar .facebook:hover{background:#1877F2!important;border-color:#1877F2!important;color:#fff!important}
.share-bar .pinterest:hover{background:#E60023!important;border-color:#E60023!important;color:#fff!important}
.share-bar .instagram:hover{background:linear-gradient(45deg,#f09433,#e6683c,#dc2743,#cc2366,#bc1888)!important;border-color:#cc2366!important;color:#fff!important}
.share-bar .sms:hover{background:#212529!important;border-color:#212529!important;color:#fff!important}
.share-bar .copy:hover{background:#0d6efd!important;border-color:#0d6efd!important;color:#fff!important}
.share-bar .share-btn.fav i{color:#e11d48}
.share-bar .share-btn.report i{color:#f59e0b}
.share-bar .share-btn.copy i{color:#475569}
.share-bar .share-btn .btn-label{display:none}
@media (max-width:576px){.share-bar{gap:8px}.share-bar .share-btn{width:40px;height:40px;font-size:18px}.share-bar .share-btn.fav,.share-bar .share-btn.report{width:auto;height:auto;border-radius:12px;padding:9px 12px;gap:8px;justify-content:flex-start}.share-bar .share-btn.fav .btn-label,.share-bar .share-btn.report .btn-label{display:inline;font-weight:700;color:#111}.share-bar .share-btn.fav i,.share-bar .share-btn.report i{font-size:18px}}


/* === Desktop: bara devine STATICĂ, centrată, capsulă === */
@media (min-width: 992px){
  #footer-buttons{
    position: static !important;
    bottom: auto !important;
    left: auto !important;
    right: auto !important;
    transform: none !important;

    /* centrare & dimensiuni */
    width: auto !important;
    max-width: 100% !important;
    margin: 28px auto !important;          /* spațiu față de secțiuni */
    border-radius: 9999px !important;      /* rotund perfect (capsulă) */
    padding: var(--fb-pad, 8px) 14px;

    /* layout frumos pe desktop */
    display: flex !important;
    justify-content: center !important;
    gap: var(--fb-gap, 8px);
    grid-template-columns: unset !important; /* anulăm gridul fix */
    box-shadow: 0 6px 20px rgba(0,0,0,.10);
  }

  /* pe desktop nu mai rezervăm spațiu jos pentru bară */
  body{ padding-bottom: 0 !important; }
}

/* === Mobil/tabletă: rămâne FIXĂ jos, full-bleed (cum vrei) === */
@media (max-width: 991.98px){
  #footer-buttons{
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;
    width: auto !important;
    max-width: none !important;
    border-radius: 0 !important;
    padding-bottom: calc(var(--fb-pad,8px) + env(safe-area-inset-bottom));
  }
  /* rezervăm loc pentru bară pe mobil ca să nu acopere conținutul */
  body{ padding-bottom: calc(var(--fb-height,54px) + 2*var(--fb-pad,8px)) !important; }
}

@media (min-width: 992px){
  #footer-buttons .buton{
    font-size: 1.15rem;      /* text mai mare */
    min-height: 60px;        /* buton mai înalt */
    padding: .6rem 1.2rem;   /* mai mult spațiu în interior */
    border-radius: 14px;     /* colțuri normale, nu rotunde complet */
  }

  #footer-buttons{
    gap: 18px !important;    /* distanță mai mare între butoane */
    border-radius: 14px !important;  /* și cadrul barei la fel */
  }
}
@media (min-width: 992px){
  #footer-buttons .buton {
    font-size: 1.2rem;      /* text + emoji mai mari */
    padding: .7rem 1.5rem;  /* spațiu interior mai generos */
    min-height: 62px;       /* crește înălțimea butonului */
  }

  #footer-buttons {
    gap: 20px;              /* mai mult spațiu între butoane */
  }
}
:root{
  --fb-pad: 10px;         /* padding interior bară */
  --fb-gap: 10px;         /* spațiu între butoane */
  --fb-height: 56px;      /* înălțime minimă buton pe mobil */
}

/:root{
  --fb-pad: 10px;
  --fb-gap: 10px;
  --fb-height: 56px;
}

/* layout comun (3 butoane perfect centrate) */
#footer-buttons{
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  justify-items: center;
  align-items: center;
  gap: 16px;
}

#footer-buttons .buton{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: .6rem;
  line-height: 1;
  font-weight: 700;
  border-radius: 12px;
  min-height: 52px;
  padding: .55rem 1.1rem;
  color: #0f172a;
  background: #fff;               /* ALB pe toate device-urile */
  border: 1px solid #e5e7eb;
}

#footer-buttons .buton .bi{
  font-size: 1.25em;
  line-height: 1;
  vertical-align: middle;
  transform: translateY(-0.5px);
}

/* === MOBIL / TABLETĂ — bară plutitoare, albă === */
@media (max-width: 991.98px){
  #footer-buttons{
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    transform: none !important;

    width: auto;
    max-width: none;
    margin: 0;

    gap: var(--fb-gap);
    background: #fff !important;         /* bară ALBĂ */
    border: 1px solid #e5e7eb;
    box-shadow: 0 -4px 18px rgba(0,0,0,.14);
    border-radius: 0;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;

    padding: var(--fb-pad);
    padding-bottom: calc(var(--fb-pad) + env(safe-area-inset-bottom));
    z-index: 1200;
  }

  #footer-buttons .buton{
    min-height: var(--fb-height);
    font-size: 1.05rem;
    background: #fff;                    /* butoane ALBE pe mobil */
  }

  /* rezervă loc ca bara să nu acopere conținutul */
  body{
    padding-bottom: calc(var(--fb-height) + 2*var(--fb-pad) + env(safe-area-inset-bottom));
  }
}

/* === DESKTOP — bară statică, centrată, colțuri 14px === */
@media (min-width: 992px){
  #footer-buttons{
    position: static !important;
    left: auto !important; right: auto !important; bottom: auto !important; transform: none !important;

    width: auto; max-width: 100%;
    margin: 28px auto;

    display: flex;
    justify-content: center;
    gap: 18px;

    background: #fff;
    border: 1px solid rgba(0,0,0,.06);
    border-radius: 14px;
    box-shadow: 0 6px 20px rgba(0,0,0,.10);
    padding: var(--fb-pad) 14px;
  }

  #footer-buttons .buton{
    font-size: 1.15rem;
    min-height: 60px;
    padding: .6rem 1.2rem;
    border-radius: 14px;
  }

  body{ padding-bottom: 0; }
}

@media (min-width: 992px){
  #footer-buttons{
    width: 100% !important;
    max-width: 1100px !important;     /* ajustează 900–1100 după gust */
    margin: 28px auto !important;
    justify-content: space-between !important;
    gap: 0 !important;               /* nu mai e nevoie de gap când întindem */
    padding: 12px 24px !important;
  }
}


/* ===== Footer modern ===== */
footer.citatul-footer{--bg:#f9f9fb;--fg:#222;--muted:#555;--chip:#fff;--line1:#6e7ff5;--line2:#7fd4ff;--line3:#a56ef5;background:var(--bg);color:var(--fg);padding:36px 16px 20px;font-family:system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;border-top:1px solid #e0e0e5}
.cf-container{max-width:1100px;margin:0 auto}
.cf-top{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px}
.cf-title{font-weight:600;letter-spacing:.2px}
.cf-divider{height:3px;margin:20px 0 15px;border-radius:999px;background:linear-gradient(90deg,var(--line1),var(--line2),var(--line3));opacity:.8}
.cf-links{display:flex;flex-wrap:wrap;gap:10px 18px;align-items:center;justify-content:center;font-size:14px}
.cf-links a{color:var(--fg);text-decoration:none;opacity:.9}
.cf-links a:hover{text-decoration:underline}
.cf-meta{margin-top:10px;text-align:center;font-size:13px;color:var(--muted)}
.cf-meta i b{font-weight:700;color:var(--fg)}
.cf-bottom{margin-top:14px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px;color:var(--muted)}
.cf-chip{background:var(--chip);padding:6px 10px;border-radius:999px;display:inline-flex;align-items:center;gap:6px;border:1px solid #ddd}
.cf-backtotop{text-decoration:none;color:var(--fg);display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid transparent;transition:all .2s ease}
.cf-backtotop:hover{background:var(--chip);border-color:#ddd}
@media (max-width:768px){.cf-top{justify-content:center;text-align:center}.cf-title{flex-basis:100%;margin-bottom:10px}.cf-social{justify-content:center}}



 #cookie-banner { /* fallback if needed */ }
    .fav-btn { cursor:pointer; color:blue; text-decoration:underline; }
    #bot-modal { display:none; position:fixed; inset:0; background:rgba(0,0,0,.6); align-items:center; justify-content:center; }
    #bot-modal .box { background:white; padding:20px; border-radius:8px; max-width:400px; }
    
    /* ---------- Layout single quote — aranjare curată în 2 coloane ---------- */
@media (min-width: 992px) {
  /* transformăm cardul într-un grid clar: media | side */
  main#page-wrap > article.card {
      
    background-color: #fff;  
    display: grid !important;
    grid-template-columns: minmax(460px, 1fr) 340px !important;
    grid-auto-rows: auto !important;
    gap: 28px !important;
    align-items: start !important;
    padding: 20px !important;
    box-sizing: border-box !important;
  }

  /* imaginea: coloana stânga, se păstrează aspect ratio */
  main#page-wrap > article.card > img.card-img-top {
    grid-column: 1 / 2 !important;
    grid-row: 1 / 4 !important;
    width: 100% !important;
    height: auto !important;
    max-height: 760px !important;
    object-fit: cover !important;
    display: block !important;
    border-radius: 12px !important;
    box-shadow: 0 .25rem .6rem rgba(0,0,0,.05) !important;
    margin: 0 !important;
  }

  /* partea dreaptă (header + body) */
  main#page-wrap > article.card > header.qt-top-meta,
  main#page-wrap > article.card > .card-body {
    grid-column: 2 / 3 !important;
    grid-row: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    align-self: start !important;
  }

  /* header: titlu mai compact, ellipsis dacă e lung */
  main#page-wrap > article.card > header.qt-top-meta h3,
  main#page-wrap > article.card > header.qt-top-meta h1,
  main#page-wrap > article.card > header.qt-top-meta .h1 {
    font-size: clamp(1.3rem, 1rem + 1.5vw, 2rem) !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    color: #111827 !important;
    margin: 0 0 8px 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  /* subtitlu / categorie */
  main#page-wrap > article.card > header.qt-top-meta .text-muted,
  main#page-wrap > article.card > header.qt-top-meta .small {
    display: block !important;
    font-size: .875rem !important;
    color: #6b7280 !important;
    margin-bottom: 8px !important;
    white-space: normal !important;
  }

  /* card-body: adaugă padding intern în coloana dreaptă */
  main#page-wrap > article.card > .card-body {
    padding-left: 0 !important;
    padding-top: 6px !important;
  }

  /* blockquote (citat) — mai mic și bine spațiat */
  main#page-wrap > article.card > .card-body blockquote.quote-quote,
  main#page-wrap > article.card > .card-body .quote-quote {
    display: block !important;
    font-size: clamp(1rem, 1rem + .6vw, 1.18rem) !important;
    line-height: 1.45 !important;
    font-weight: 600 !important;
    color: #1f2937 !important;
    margin: 0 0 14px 0 !important;
    max-width: 42ch !important;
    text-align: left !important;   /* dacă vrei centrat: center */
  }

  /* Butoanele auxiliare (Copiază / Favorite / Raportează) — plasează sub social icons, full width în side */
  main#page-wrap > article.card > .card-body .row.g-2 {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    margin-top: 6px !important;
  }

  main#page-wrap > article.card > .card-body .row.g-2 .col-4,
  main#page-wrap > article.card > .card-body .row.g-2 .col-md {
    width: 100% !important;
    display: block !important;
  }

  main#page-wrap > article.card > .card-body .row.g-2 .btn {
    width: 100% !important;
    justify-content: flex-start !important;
    padding: .65rem .9rem !important;
    gap: .8rem !important;
    border-radius: 10px !important;
    font-weight: 700 !important;
    text-align: left !important;
    color: #0f172a !important;
  }

  /* icon din buton la stânga */
  main#page-wrap > article.card > .card-body .row.g-2 .btn .bi {
    font-size: 1.25rem !important;
  }

  /* mic ajutor vizual: separare panou side */
  main#page-wrap > article.card > header.qt-top-meta,
  main#page-wrap > article.card > .card-body {
    background: transparent !important;
  }

  /* înălțime minimă pentru side pentru balans vizual */
  main#page-wrap > article.card > .card-body {
    min-height: 180px !important;
  }
}

/* ---------- Reveniți la variantă mobil (siguranță) ---------- */
@media (max-width: 991.98px) {
  main#page-wrap > article.card {
      background-color: #fff !important;
    display: block !important;
    padding: .5rem !important;
  }

  main#page-wrap > article.card > img.card-img-top {
    max-height: none !important;
    margin-bottom: .75rem !important;
    border-radius: 12px !important;
  }

  main#page-wrap > article.card > .card-body .share-bar {
    position: static !important;
    flex-direction: row !important;
    gap: 8px !important;
    justify-content: center !important;
  }

  main#page-wrap > article.card > .card-body .row.g-2 {
    flex-direction: row !important;
    gap: 8px !important;
  }

  main#page-wrap > article.card > .card-body blockquote.quote-quote {
    text-align: center !important;
    font-size: clamp(1rem, 1rem + .6vw, 1.15rem) !important;
    max-width: 100% !important;
  }
}
/* --- Corecție: aliniere uniformă a butoanelor doar pe mobil --- */
@media (max-width: 991.98px) {
  main#page-wrap > article.card .row.g-2 {
    display: flex !important;
    flex-wrap: nowrap !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    gap: 6px !important;
  }

  main#page-wrap > article.card .row.g-2 .col-4,
  main#page-wrap > article.card .row.g-2 .col-md {
    flex: 1 1 0 !important;
    display: flex !important;
  }

  main#page-wrap > article.card .row.g-2 .btn {
    flex: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 100% !important;
    min-height: 46px !important;
    white-space: nowrap !important;
  }
}



/* Fix overflow for .quotes-grid / quote cards without changing design */
.quotes-grid,
.quote-list-item {
  box-sizing: border-box;
  max-width: 100%;
  overflow-x: hidden; /* sigurăm că nimic nu împinge orizontal */
}

/* Make the media full-bleed visually, but never exceed viewport */
.quote-list-item {
  position: relative; /* context pentru corecții */
  overflow: hidden;   /* taie orice depășire cauzată de negative margins */
}

/* Înlocuim negativul fix cu o variantă responsive (nu schimb vizualul pe desktop) */
.quote-list-item .qli-media{
  /* Păstrăm efectul „lipit”, dar îl reducem pe ecrane foarte înguste */
  margin: -12px -12px 8px;
  width: calc(100% + 24px);
  max-width: 100vw;            /* nu trece niciodată de viewport */
  box-sizing: border-box;
  overflow: hidden;
  border-radius: 12px 12px 0 0;
}

/* Pe ecrane foarte înguste, reducem automat offset-ul negativ ca să nu apară horizontal-scroll */
@media (max-width: 420px) {
  .quote-list-item .qli-media{
    /* folosim o valoare proporțională mai mică în loc de -12px pe lateral */
    margin-left: -6px;
    margin-right: -6px;
    width: calc(100% + 12px);
  }
}

/* Imaginea în interior: niciodată mai lată decât viewportul */
.qli-media img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100vw;
  object-fit: cover;
}

/* Stil general pentru titlu */
.qt-top-meta h1 {
    font-size: 1.5rem; /* dimensiune implicită */
    font-weight: 600;
    color: #555; /* gri moderat */
    margin: 0;
    line-height: 1.2;
}

/* Pe desktop mai mare */
@media (min-width: 992px) {
    .qt-top-meta h1 {
        font-size: 2.5rem; /* titlu mai mare */
    }
}

/* Pe mobil mai mic */
@media (max-width: 576px) {
    .qt-top-meta h1 {
        font-size: 1.2rem; /* titlu mai mic */
    }
}

    .v-inline-wrapper { 
        display: flex; 
        justify-content: center; 
        align-items: center;   
        font-family: Arial, sans-serif;
        flex-wrap: wrap;
        width: 100%;
        text-align: center;
    }
    
    .label-vote { font-size: 15px; font-weight: bold; color: #444; }

    .v-stars { display: flex; flex-direction: row-reverse; gap: 3px; }
    .v-stars span { font-size: 30px; color: #ddd; cursor: pointer; line-height: 1; }
    
    .v-stars.active span:hover, 
    .v-stars.active span:hover ~ span { color: #ffbc00; }
    .v-stars span.on { color: #ffbc00; }
    .v-stars.locked span { cursor: default; }

    .v-msg { font-size: 14px; font-weight: bold; color: #27ae60; min-width: 20px; }
    .v-stats { font-size: 12px; color: #888; }

/* Stilul butonului pentru a fi identic cu Search */
.btn-theme-custom {
    width: 40px;
    height: 38px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: 4px !important;
    background-color: #212529 !important; /* Culoarea butonului de search */
    border: 1px solid #343a40 !important;
}

