/* =========================================================
   VRELE PRIČE — svetla, topla, čitljiva tema
   Inspiracija: ljubavno pismo / pečat od voska (a ne neki drugi sajt)
   ========================================================= */

:root{
    --vp-paper:     #FAF5F1;   /* toplo bela pozadina - papir */
    --vp-paper-alt: #FFFFFF;   /* pozadina kartica */
    --vp-ink:       #2A2130;   /* tekst - toplo crna */
    --vp-ink-soft:  #6E6470;   /* sekundarni tekst, meta podaci */
    --vp-plum:      #6E2F52;   /* naslovi, primarna boja */
    --vp-rose:      #C15D74;   /* akcenat - dugmici, hover, linkovi */
    --vp-gold:      #B08A44;   /* koristi se RETKO - sitni detalji, pecat */
    --vp-border:    #E7DCE0;   /* linije, ivice kartica */
    --vp-shadow:    rgba(110,47,82,.12);
}

/* Font: Fraunces za naslove (karakteran, topao serif), sistemski sans za tekst (brzo) */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600;9..144,700&display=swap');

/* ---------- Osnova ---------- */
body,
#soledad_wrapper{
    background-color: var(--vp-paper) !important;
    color: var(--vp-ink);
}

body, p, .entry-content, .item-content{
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: var(--vp-ink);
}

h1, h2, h3,
.penci-block-title, .archive-title, .entry-title, .item-title{
    font-family: 'Fraunces', Georgia, serif;
    font-weight: 600;
    color: var(--vp-plum);
    letter-spacing: 0;
}

.item-title{ font-size: 18px !important; line-height: 1.35 !important; font-weight: 600 !important; }
.entry-title, h1.entry-title{ font-size: 32px !important; line-height: 1.3 !important; }
.penci-block-title{ font-size: 21px !important; }

a{ transition: color .2s ease; }
a:hover{ color: var(--vp-rose) !important; }

/* ---------- Header ---------- */
.penci-header-wrap{
    background-color: var(--vp-paper-alt);
    border-bottom: 1px solid var(--vp-border);
}
#navigation{
    background-color: var(--vp-paper-alt);
    border-top: 1px solid var(--vp-border);
    border-bottom: 1px solid var(--vp-border);
}
#navigation ul.menu > li > a{
    color: var(--vp-plum);
    font-weight: 600;
    font-size: 14px;
}
#navigation ul.menu > li > a:hover,
#navigation ul.menu > li.current-menu-item > a{
    color: var(--vp-rose);
}

/* ---------- Slider na naslovnoj ---------- */
.penci-fslider, .tp-slider-wrap{
    border-radius: 8px;
    overflow: hidden;
}
.penci-fslider .slide-caption,
.penci-fslider .cover-title{
    background: linear-gradient(0deg, rgba(42,33,48,.85) 0%, rgba(42,33,48,0) 100%);
}
.penci-fslider .slide-title,
.penci-fslider .cover-title a{
    color: #fff;
    font-family: 'Fraunces', Georgia, serif;
    font-size: 24px;
}

/* ---------- "Pečat od voska" na kategoriji - potpisni element teme ---------- */
.item .cat, .thumbnail .cat{
    position: relative;
    display: inline-block;
    background-color: var(--vp-plum);
    color: #fff !important;
    padding: 4px 12px 4px 22px;
    border-radius: 20px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.item .cat::before, .thumbnail .cat::before{
    content: "";
    position: absolute;
    left: 6px;
    top: 50%;
    width: 8px;
    height: 8px;
    background-color: var(--vp-gold);
    border-radius: 50%;
    transform: translateY(-50%);
}
.item .cat a{ color: #fff !important; }

/* ---------- Kartice priča ---------- */
.grid-style .item,
.list-style .item,
.item.hentry{
    background-color: var(--vp-paper-alt);
    border: 1px solid var(--vp-border);
    border-radius: 10px;
    overflow: hidden;
    transition: transform .25s ease, box-shadow .25s ease;
}
.grid-style .item:hover,
.list-style .item:hover,
.item.hentry:hover{
    transform: translateY(-4px);
    box-shadow: 0 12px 24px var(--vp-shadow);
}

.item .thumbnail{ overflow: hidden; position: relative; }
.item .thumbnail img{ transition: transform .4s ease; }
.item:hover .thumbnail img{ transform: scale(1.04); }

.item-content .item-title a{ color: var(--vp-plum); }
.item:hover .item-content .item-title a{ color: var(--vp-rose); }

.item .item-metadata, .item .item-metadata a{
    color: var(--vp-ink-soft) !important;
    font-size: 13px;
}

/* ---------- Tekst priče (single post) ---------- */
.entry-content, .single-content{
    color: var(--vp-ink);
    font-size: 18px;
    line-height: 1.85;
}
.entry-content p{ margin-bottom: 1.2em; }

/* Prvo slovo prve reci u tekstu price - diskretan "iluminovani inicijal" */
.entry-content > p:first-of-type::first-letter{
    font-family: 'Fraunces', Georgia, serif;
    font-size: 3.2em;
    line-height: .8;
    float: left;
    padding: 4px 8px 0 0;
    color: var(--vp-plum);
    font-weight: 700;
}

/* ---------- Dugmici ---------- */
.penci-readmore-btn, .load_more_button, button, input[type="submit"]{
    background-color: var(--vp-plum) !important;
    color: #fff !important;
    border: none !important;
    border-radius: 6px;
    transition: background-color .2s ease;
}
.penci-readmore-btn:hover, .load_more_button:hover,
button:hover, input[type="submit"]:hover{
    background-color: var(--vp-rose) !important;
}

/* ---------- Footer ---------- */
#footer, .footer-widgets{
    background-color: #F1E7E4;
    border-top: 1px solid var(--vp-border);
    color: var(--vp-ink-soft);
}

/* ---------- Responzivnost ---------- */
@media (max-width: 768px){
    .grid-style .item:hover, .list-style .item:hover, .item.hentry:hover{ transform: none; }
    .entry-title, h1.entry-title{ font-size: 24px !important; }
    .entry-content, .single-content{ font-size: 16px; }
    .entry-content > p:first-of-type::first-letter{ font-size: 2.4em; }
}

/* ---------- Pristupačnost - vidljiv fokus na tastaturi ---------- */
a:focus-visible, button:focus-visible, input:focus-visible{
    outline: 2px solid var(--vp-rose);
    outline-offset: 2px;
}

/* Poštovanje "reduced motion" podešavanja korisnika */
@media (prefers-reduced-motion: reduce){
    *{ transition: none !important; animation: none !important; }
}
