/*
 Theme Name: Strefa Kolorówki
 Theme URI: https://strefakolorowki.pl
 Description: Minimalistyczny motyw beauty blog oparty na Zeen
 Author: KS MEDIA
 Author URI: https://strefakolorowki.pl
 Template: zeen
 Version: 1.0.0
 Text Domain: zeen-child-kolorowki
*/

/* ===== BEAUTY BLOG OVERRIDES ===== */

/* Soft, feminine color palette */
:root {
    --sk-primary: #c87d8a;
    --sk-primary-hover: #b5697a;
    --sk-accent: #e8c4c8;
    --sk-bg: #fefbfb;
    --sk-text: #3d3035;
    --sk-text-light: #7a6b71;
    --sk-border: #f0e4e6;
}

/* Base typography - elegant serif headers, clean sans body */
body {
    background-color: var(--sk-bg) !important;
    color: var(--sk-text) !important;
}

h1, h2, h3, h4, h5, h6,
.tipi-title,
.entry-title,
.post-title {
    font-family: 'Playfair Display', 'Georgia', serif !important;
    font-weight: 600 !important;
    color: var(--sk-text) !important;
}

/* Links & accents in muted rose */
a:hover,
.tipi-accent,
.cat-tag a,
.meta-category a {
    color: var(--sk-primary) !important;
}

/* Navigation - clean, minimal */
.tipi-header,
.main-nav-sub-wrap {
    border-bottom: 1px solid var(--sk-border) !important;
    box-shadow: none !important;
}

.main-menu > li > a {
    font-weight: 400 !important;
    letter-spacing: 0.5px !important;
    text-transform: none !important;
    font-size: 14px !important;
}

/* Category badges - soft rose */
.cat-tag a,
.meta-category a {
    background-color: var(--sk-primary) !important;
    color: #fff !important;
    border-radius: 3px !important;
    font-size: 11px !important;
    letter-spacing: 0.8px !important;
    text-transform: uppercase !important;
}

/* Post cards - clean with subtle shadows */
.tipi-card {
    border-radius: 8px !important;
    overflow: hidden !important;
    box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important;
    transition: box-shadow 0.3s ease !important;
}

.tipi-card:hover {
    box-shadow: 0 4px 20px rgba(0,0,0,0.10) !important;
}

/* Image borders - softer */
.tipi-img-ratio {
    border-radius: 6px !important;
    overflow: hidden !important;
}

/* Footer - minimal */
.footer-lower-inner {
    border-top: 1px solid var(--sk-border) !important;
}

/* Buttons - rose tinted */
.tipi-button,
input[type="submit"],
button[type="submit"] {
    background-color: var(--sk-primary) !important;
    border-color: var(--sk-primary) !important;
    border-radius: 25px !important;
}

.tipi-button:hover,
input[type="submit"]:hover {
    background-color: var(--sk-primary-hover) !important;
}

/* Blockquotes - elegant */
blockquote {
    border-left: 3px solid var(--sk-accent) !important;
    font-style: italic !important;
    color: var(--sk-text-light) !important;
}

/* Sidebar widgets - cleaner */
.widget-title {
    font-family: 'Playfair Display', 'Georgia', serif !important;
    font-size: 16px !important;
    border-bottom: 2px solid var(--sk-accent) !important;
    padding-bottom: 8px !important;
}

/* Category/archive page header - pudrowy róż
   Uses body prefix for max specificity to beat Zeen inline styles */
body .standard-archive .page-header,
body .standard-archive .page-header .tipi-row-inner-style,
body .standard-archive .page-header .block-title-wrap-style,
body.archive .page-header,
body.archive .page-header .tipi-row-inner-style,
body.category .page-header,
body.category .page-header .tipi-row-inner-style,
.content-bg,
.standard-archive .page-header,
.page-header-skin-0,
.page-header-skin-0 .tipi-row-inner-style {
    background-color: #f5dde1 !important;
    background: #f5dde1 !important;
}
body .page-header *,
body .page-header .page-title,
body .page-header .block-title,
body .page-header .sorter,
body .page-header .current-sorter-txt,
body .page-header a {
    color: #3d3035 !important;
}

/* Main content background stays white */
body .content-bg {
    background: #fff !important;
}
body .standard-archive .page-header {
    background: #f5dde1 !important;
}

/* Mega menu dropdown - pudrowy róż */
.mm-skin-2 .menu-wrap,
.mm-skin-2 .mm-11,
.drop .menu {
    background-color: #f5dde1 !important;
}
.mm-skin-2 .menu-wrap *,
.mm-skin-2 .mm-11 * {
    color: var(--sk-text) !important;
}

/* Navigation bottom border - rose instead of black */
.main-navigation-border {
    border-bottom: 2px solid var(--sk-accent) !important;
    border-top: none !important;
}

/* Remove excessive Zeen elements for clean blog feel */
.trending-posts,
.tipi-ticker,
.social-count {
    display: none !important;
}

/* Smooth scroll feel */
html {
    scroll-behavior: smooth;
}

/* ===== UNIFORM THUMBNAIL SIZE ===== */
/* Force all .mask containers to same 3:2 aspect ratio */
.preview-classic .mask,
.block .mask,
.mm-11 .mask {
    aspect-ratio: 3 / 2 !important;
    max-height: none !important;
    overflow: hidden !important;
    display: block !important;
}
.preview-classic .mask img,
.block .mask img,
.mm-11 .mask img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    object-position: center !important;
}
/* Kill Zeen's shape-based sizing — all same ratio */
.preview__img-shape-p .mask,
.preview__img-shape-s .mask,
.preview__img-shape-l .mask {
    aspect-ratio: 3 / 2 !important;
    max-height: none !important;
}

/* ===== REPLACE MASONRY WITH CSS GRID ===== */
/* Convert masonry columns to a proper grid so rows align */
.block-masonry .block-masonry-3 {
    display: grid !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 30px !important;
}
.block-masonry .block-masonry-3 > .masonry__col {
    width: 100% !important;
    display: contents !important;
}
/* Each article card: stretch to fill grid cell, uniform spacing */
.block-masonry .block-masonry-3 .masonry-child {
    display: flex !important;
    flex-direction: column !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}
.block-masonry .block-masonry-3 .masonry-child .preview-mini-wrap {
    display: flex !important;
    flex-direction: column !important;
    height: 100% !important;
}
.block-masonry .block-masonry-3 .masonry-child .meta {
    flex: 1 !important;
}
/* Reset any separation-border spacing on articles */
.block-masonry .block-masonry-3 .separation-border {
    border: none !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
}
/* Hide masonry vertical separators (grid handles spacing) */
.block-masonry .separation-border-v {
    display: none !important;
}
/* Mobile: single column */
@media (max-width: 767px) {
    .block-masonry .block-masonry-3 {
        grid-template-columns: 1fr !important;
    }
}