/*
  Theme Name: REHub child — GeekLife
  Theme URI: https://www.geeklife.cz/
  Description: Custom child theme for GeekLife.cz over REHub parent.
  Author: Zdeněk Dvořák
  Author URI: https://www.geeklife.cz/
  Version: 1.0.0
  Template: rehub-theme
  Text Domain: rehub-geeklife
*/

/* === GeekLife brand palette ===
   Single source of truth pro brand barvy. Aliasované do REHub CSS variables,
   takže přebijí hodnoty z Theme Options (inc/customization.php:687).
*/
:root,
body {
    --geeklife-primary: #8dc322;
    --geeklife-secondary: #c3228d;

    /* REHub overrides */
    --rehub-main-color: var(--geeklife-primary);
    --rehub-sec-color: var(--geeklife-secondary);
    --rehub-main-btn-bg: var(--geeklife-primary);
    --rehub-link-color: var(--geeklife-primary);
}

/* === Hero (single-default-readopt) === */
#rh_post_layout_inimage a.rh-cat-label-title,
#rh_post_layout_inimage .rh-cat-label-title {
    background-color: var(--geeklife-secondary);
}

/* === Body texture + REHub overrides sladěné s brand paletou === */
/* Subtle dot-grid texture jako body pozadí. SVG inline data URI: 32×32 tile,
   tečka 1px, fill-opacity 0.045 — okem stěží postřehnutelné, ale dává „papírový" feel. */
body {
    background-color: #fff;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='32' height='32' viewBox='0 0 32 32'%3E%3Ccircle cx='1' cy='1' r='1' fill='%23000000' fill-opacity='0.045'/%3E%3C/svg%3E");
}

/* Hlavní nav — světlý variant (white_style): jemně off-white (#fafafa)
   pro vizuální oddělení od bílého content area pod menu (na desktopu).
   Tmavý variant (dark_style): secondary růžová (slazeno s topbar) */
.main-nav.white_style { background: #fafafa; }
.main-nav.dark_style { background: var(--geeklife-secondary); }
.main-nav.dark_style nav.top_menu > ul > li {
    border-right: 1px solid rgba(0, 0, 0, 0.15);
}
nav.top_menu > ul > li > a:hover,
nav.top_menu > ul > li.current-menu-item a,
.search-header-contents { border-top-color: transparent !important; }

/* Deal Score widget — pozadí světle zelená tint, label primary zelená */
.dealScore .thumbscount { background: rgba(141, 195, 34, 0.12); }
.dealScore .label { background: var(--geeklife-primary); }

/* Sale badge — primary zelená */
.grid_onsale,
.overlay_post_formats.sale_format { background: var(--geeklife-primary); }

/* Homepage / archive main wrapper — REHub default vytváří „boxed layout" feel:
   `body:not(.noinnerpadding) .rh-post-wrapper { border: 1px solid #e3e3e3; box-shadow: 0 2px 2px #ECECEC; padding: 25px }`
   (parent style.css). User chce kompletně plochou stránku bez rámečku okolo content area. */
.rh-post-wrapper {
    border: none !important;
    box-shadow: none !important;
    background: transparent !important;
}

/* === Footer container — full secondary růžová ===
   Brand-konzistentní (secondary = #c3228d). Widgety uvnitř dostanou primary tint
   cards (jako .geeklife-author-box) — vysoký kontrast s pink footerem.
*/
.footer-bottom.dark_style,
#theme_footer.dark_style {
    background: var(--geeklife-secondary) !important;
    color: #fff;
}
/* Breathing room nahoře/dole kolem widget gridu (parent `.footer-bottom` nemá padding) */
.footer-bottom.dark_style {
    padding: 35px 0 30px;
}
/* Bottom bar (copyright text) — parent dává `.font80` (80%, ~12-13px) = málo čitelné.
   Bump na 95% + lehce vyšší line-height pro dlouhý odstavec. */
#theme_footer .f_text {
    font-size: 95%;
    line-height: 1.65;
}
.footer-bottom.dark_style a,
#theme_footer.dark_style a {
    color: #fff;
    text-decoration: underline;
}
.footer-bottom.dark_style a:hover,
#theme_footer.dark_style a:hover {
    color: #ffe8f4;
}

/* === Sidebar widget skin — sjednoceno s .geeklife-author-box ===
   Exclude:
   - `.FixedWidget__fixed_widget` (sticky Patria reklama)
   - `.widget_custom_html` (Custom HTML widget — typicky reklamní bannery,
     mají vlastní visuální identitu, lepší ať splynou s pozadím webu)
*/
.sidebar .widget:not(.FixedWidget__fixed_widget):not(.widget_custom_html) {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 18px 16px !important;
    margin-bottom: 18px;
}

/* Custom HTML widget — bíle pozadí, žádný border (typicky reklamní banner) */
.sidebar .widget.widget_custom_html {
    background: #fff !important;
    border: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin-bottom: 18px;
}

/* === Footer widget cards — subtle dark magenta box na pink footer pozadí ===
   rgba(0,0,0,0.15) na magenta wrapperu = jemně tmavší magenta odstín.
   Žádný border, žádný rounding. Texty/nadpisy bílé, linky bílé s podtržením. */
.footer-bottom .footer_widget {
    background: rgba(0, 0, 0, 0.15);
    border: none;
    border-radius: 0;
    padding: 22px 22px;
    margin-bottom: 0;
}
/* Texty uvnitř widgetu — bílé na magenta boxu */
.footer-bottom.dark_style .footer_widget,
.footer-bottom.dark_style .footer_widget *:not(a) {
    color: #ffffff !important;
    opacity: 1 !important;
    font-style: normal !important;
}
/* Linky — bílé bez podtržení, hover = slide-in primary green underline zleva.
   Background-image trick je bulletproof i pro multi-line linky (kdyby zalomily). */
.footer-bottom.dark_style .footer_widget a {
    color: #ffffff !important;
    text-decoration: none;
    font-weight: 500;
    background-image: linear-gradient(to right, var(--geeklife-primary), var(--geeklife-primary));
    background-position: 0 100%;
    background-size: 0 2px;
    background-repeat: no-repeat;
    transition: background-size 0.25s ease;
    padding-bottom: 2px;
}
.footer-bottom.dark_style .footer_widget a:hover {
    color: #ffffff !important;
    text-decoration: none;
    background-size: 100% 2px;
}
/* Heading widgetu — bílý, serif, s primary green accent line pod nadpisem (3px × 40px) */
.footer-bottom.dark_style .footer_widget .title,
.footer-bottom.dark_style .footer_widget h2,
.footer-bottom.dark_style .footer_widget h3,
.footer-bottom.dark_style .footer_widget h4,
.footer-bottom.dark_style .footer_widget h5 {
    color: #ffffff !important;
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif !important;
    font-weight: 700 !important;
    font-size: 17px !important;
    margin: 0 0 18px !important;
    padding-bottom: 10px !important;
    line-height: 1.3 !important;
    opacity: 1 !important;
    text-transform: none !important;
    font-style: normal !important;
    position: relative;
}
/* Accent line — !important + display:block override parent rule
   `.footer_widget .widget .title:after { display: none }` (rehub-theme/style.css:571). */
.footer-bottom.dark_style .footer_widget .widget .title::after,
.footer-bottom.dark_style .footer_widget .widget h2::after,
.footer-bottom.dark_style .footer_widget .widget h3::after,
.footer-bottom.dark_style .footer_widget .widget h4::after,
.footer-bottom.dark_style .footer_widget .widget h5::after {
    content: '' !important;
    display: block !important;
    position: absolute !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 40px !important;
    height: 3px !important;
    background: var(--geeklife-primary) !important;
    border: none !important;
}
/* Cleanup list — bez bullets, kompaktní */
.footer-bottom.dark_style .footer_widget ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}
.footer-bottom.dark_style .footer_widget ul li {
    padding: 4px 0 !important;
    margin: 0 !important;
    line-height: 1.5;
}
.footer-bottom.dark_style .footer_widget ul li::before {
    content: '' !important;
    display: none !important;
}

/* === Sidebar widget „Další nové články" (rehub_posts_widget) ===
   Item-specific styling — generic widget skin výše už zařídí background/border.
*/

/* Defenzivně: žádné italic v widgetu (parent může dávat italic na linky) */
.posts_widget,
.posts_widget * {
    font-style: normal !important;
}

/* Widget title */
.posts_widget > .title {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif;
    font-size: 18px;
    font-weight: 700;
    color: #1a1a1a;
    margin-bottom: 12px;
}

/* Item container — tenčí divider */
.posts_widget .border-grey-bottom {
    border-bottom-color: #ececec;
}

/* Thumbnail — 4:3 aspect ratio, border-radius, soft shadow + hover */
.posts_widget figure.floatleft {
    width: 100px;
    margin-right: 0;
    border-radius: 4px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.3s ease;
    background: #f5f5f5;
}
.posts_widget figure.floatleft img {
    display: block !important;
    width: 100% !important;
    height: 75px !important;
    max-height: 75px !important;
    object-fit: cover !important;
    transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}

@media (hover: hover) and (min-width: 768px) {
    .posts_widget .border-grey-bottom:hover figure.floatleft {
        box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
    }
    .posts_widget .border-grey-bottom:hover figure.floatleft img {
        transform: scale(1.05);
    }
}

@media (prefers-reduced-motion: reduce) {
    .posts_widget figure.floatleft,
    .posts_widget figure.floatleft img {
        transition: none;
    }
    .posts_widget .border-grey-bottom:hover figure.floatleft img {
        transform: none;
    }
}

/* Title článku — serif, čitelný, hover primary, truncate na 2 řádky */
.posts_widget .detail > div:first-child {
    font-size: 14px !important;
    line-height: 1.35 !important;
    margin-bottom: 8px !important;
}
.posts_widget .detail > div:first-child a {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif;
    font-weight: 700;
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.2s ease;
    /* Line-clamp na 2 řádky — třetí řádek se ořízne s ellipsis */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.posts_widget .detail > div:first-child a:hover {
    color: var(--geeklife-primary);
}

/* Category badge — secondary bg, sentence case (ne uppercase, ne italic), drobný */
.posts_widget .cat_link_meta {
    display: inline-block;
    margin-right: 8px;
}
.posts_widget .cat_link_meta a.cat {
    display: inline-block;
    background-color: var(--geeklife-secondary);
    color: #fff !important;
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif;
    font-size: 11px;
    font-weight: 600;
    text-transform: none;
    font-style: normal !important;
    letter-spacing: 0;
    padding: 3px 8px;
    border-radius: 3px;
    line-height: 1.3;
    text-decoration: none;
    transition: background-color 0.2s ease;
}
.posts_widget .cat_link_meta a.cat:hover {
    background-color: var(--geeklife-primary);
}

/* Comment count — skryto úplně. Komentáře jsou hardcoded v parent widget kódu
   (rh_post_header_meta v rehub-theme/functions.php:1071), bez filter hooku.
   `display: none` je funkčně ekvivalentní — uživatel je neuvidí. */
.posts_widget .comm_count_meta {
    display: none;
}

/* Meta line spacing */
.posts_widget .post-meta {
    margin-top: 4px;
    line-height: 1.4;
}

/* === Geekl plugin: skrýt `geekl-fixni-sidebar-bar-2` ===
   Plugin Geekl konfiguruje stejnou Patria reklamu pro 2 placementy:
   (a) sidebar widget (sticky díky Q2W3 Fixed Widget — žádaný)
   (b) `geekl-fixni-sidebar-bar-2` — body-level element bez fixed positioning,
       padal do default flow na konec stránky (uživatel hlásil „propisuje se na
       konec"). Pokus o fixed pozici vpravo dole vedl k duplicate banneru vedle
       sidebar widgetu. Skrýváme úplně — sticky Q2W3 verze v sidebaru stačí. */
body > .geekl-fixni-sidebar-bar-2 {
    display: none !important;
}

/* === Comments — branded redesign (form + jednotlivé příspěvky) ===
   Konzistentní s patičkou: 3px primary green left accent na všech kartách,
   source-serif-pro normal-case headings (override parent uppercase), magenta
   submit s green hover, focus state v primary green glow ring.

   Parent baseline: rehub-theme/css/comments.css + rehub-theme/functions.php:1403
   (rehub_framework_comments callback rendující `.commbox`). */

/* A) Section heading "Diskuze a zkušenosti" — serif, normal case, green accent line */
#comments .title_comments {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif !important;
    font-size: 22px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    padding-bottom: 14px !important;
    margin-bottom: 28px !important;
    position: relative;
}
#comments .title_comments::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 50px;
    height: 3px;
    background: var(--geeklife-primary);
}

/* B) Existující příspěvky — white card, 3px primary green left accent */
.commentlist { margin: 0 0 35px 0; }
.commentlist li.comment { margin: 0 0 18px 0; }
.commentlist .commbox {
    background: #ffffff;
    border: 1px solid #ededed;
    border-left: 3px solid var(--geeklife-primary);
    border-radius: 4px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
}

/* C) Comment header — jméno serif normal-case, time šedá */
.commentlist .commbox .comment-author {
    border-bottom: 1px solid #f0f0f0 !important;
    padding: 16px 20px !important;
}
.commentlist .comment-author .fn {
    text-transform: none !important;
    font-family: source-serif-pro, Georgia, serif;
    font-size: 16px !important;
    font-weight: 700 !important;
    color: #1a1a1a;
}
.commentlist .comment-author .fn a {
    color: #1a1a1a;
    text-decoration: none;
}
.commentlist .comment-author .fn a:hover {
    color: var(--geeklife-primary);
}
.commentlist .comment-author .time {
    font-size: 12px;
    color: #999;
}
.commentlist .comment-author .time a {
    color: #999;
    text-decoration: none;
}
.commentlist .comment-author .time a:hover {
    color: var(--geeklife-primary);
}

/* D) Reply link — primary green, hover magenta s underline */
.comment-reply-link,
.comment-reply-login {
    font-size: 13px !important;
    color: var(--geeklife-primary) !important;
    text-decoration: none;
    font-weight: 600;
}
.comment-reply-link:hover,
.comment-reply-login:hover {
    color: var(--geeklife-secondary) !important;
    text-decoration: underline;
}
.comment-edit-link {
    color: #999;
    font-size: 11px;
}

/* E) Comment content — větší font, lepší line-height, primary green linky */
.commentlist .comment-content {
    padding: 18px 20px !important;
}
.commentlist .comment-content p {
    font-size: 15px !important;
    line-height: 1.65 !important;
    color: #2a2a2a !important;
    margin: 0 0 12px 0 !important;
}
.commentlist .comment-content p:last-child {
    margin-bottom: 0 !important;
}
.commentlist .comment-content a {
    color: var(--geeklife-primary);
    text-decoration: underline;
}
.commentlist .comment-content a:hover {
    color: var(--geeklife-secondary);
}

/* F) Children — vertikální linka místo FA arrow, magenta accent na nested boxech */
.commentlist ul.children {
    margin-left: 30px !important;
    padding-left: 24px !important;
    border-left: 2px solid #ececec;
    margin-top: 18px !important;
}
.commentlist ul.children .commbox:before {
    display: none !important;
}
.commentlist ul.children .commbox {
    border-left-color: var(--geeklife-secondary);
}

/* G) Form box — branded card */
.comment-respond {
    background: #ffffff !important;
    border-left: 3px solid var(--geeklife-primary) !important;
    border-radius: 4px;
    padding: 28px 32px !important;
    margin-bottom: 30px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08) !important;
}
.comment-respond h3,
#reply-title.comment-reply-title {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    color: #1a1a1a !important;
    text-transform: none !important;
    letter-spacing: normal !important;
    margin: 0 0 18px 0 !important;
    padding-bottom: 0 !important;
}

/* H) Form inputs + textarea — clean, focus state v primary green glow */
#commentform input[type="text"],
#commentform input[type="email"],
#commentform input[type="url"],
#commentform textarea {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
    padding: 10px 14px !important;
    font-size: 15px;
    line-height: 1.5;
    color: #1a1a1a;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease;
    width: 100%;
    box-sizing: border-box;
    height: auto !important;
}
#commentform input[type="text"]:focus,
#commentform input[type="email"]:focus,
#commentform input[type="url"]:focus,
#commentform textarea:focus {
    border-color: var(--geeklife-primary);
    box-shadow: 0 0 0 3px rgba(141, 195, 34, 0.15);
    outline: none;
    background: #ffffff;
}
#commentform textarea {
    min-height: 120px;
    resize: vertical;
}
/* Skrýt parent FA ikony před name/email/url inputy (parent kresli šedý čtvereček s ikonou přes ::after) */
.comment-respond .usr_re input,
.comment-respond .email_re input,
.comment-respond .site_re input {
    padding-left: 14px !important;
}
.comment-respond .usr_re:after,
.comment-respond .email_re:after,
.comment-respond .site_re:after {
    display: none !important;
}

/* I) Submit button — magenta secondary, hover primary green s liftem */
#commentform #submit,
#commentform input[type="submit"].submit {
    background: var(--geeklife-secondary) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 4px;
    padding: 12px 28px !important;
    font-size: 15px !important;
    font-weight: 600;
    letter-spacing: 0.3px;
    cursor: pointer;
    transition: background 0.2s ease, transform 0.1s ease;
    display: inline-block !important;
}
#commentform #submit:hover,
#commentform input[type="submit"].submit:hover {
    background: var(--geeklife-primary) !important;
    transform: translateY(-1px);
}
#commentform #submit:active,
#commentform input[type="submit"].submit:active {
    transform: translateY(0);
}

/* === Geekl plugin promo boxy — recurring CTA bloky v článcích ===
   Plugin "geekl" injectuje různé CTA bloky. Box styling aplikujeme PŘÍMO na `<p>`,
   protože outer wrapper může obalovat víc elementů (např. „Více na téma" tagy).

   Dva visuální typy:
   - SOCKY PROMO (RSS/X/FB subscribe) — magenta tint + 4px magenta left accent.
   - OBSAH (content tipy / partner linky) — pale green tint jako author box,
     subtle, žádný left accent. */

/* Socky promo — RSS/X/FB subscribe CTA */
.geekl-socky-promo p {
    background: rgba(195, 34, 141, 0.04);
    border: 1px solid rgba(195, 34, 141, 0.15);
    border-left: 4px solid var(--geeklife-secondary);
    border-radius: 4px;
    padding: 18px 24px;
    margin: 30px 0;
    font-size: 16px;
    line-height: 1.65;
    color: #1a1a1a;
}

/* Obsah promo — content tipy / partner linky. Stejný visual jako `.geeklife-author-box` v levé liště. */
.geekl-obsah_17 p {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 16px 20px;
    margin: 30px 0;
    font-size: 16px;
    line-height: 1.65;
    color: #1a1a1a;
}

/* Linky — sdílené pro oba typy. Primary green default, hover magenta + tlustší underline. */
.geekl-socky-promo a,
.geekl-obsah_17 a {
    color: var(--geeklife-primary);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}
.geekl-socky-promo a:hover,
.geekl-obsah_17 a:hover {
    color: var(--geeklife-secondary);
    text-decoration-thickness: 2px;
}

/* === Article rating widget (Rate My Post plugin, .rmp-* selectors) ===
   "Pomohl vám článek?" star-rating CTA. Star states:
   - bez highlight modifikátoru (`.rmp-icon--star` only) = unrated/zero → šedá #ccc
   - `.rmp-icon--full-highlight` = filled → primary green
   - `.rmp-icon--half-highlight` = half → gradient 50% green + 50% gray
     (plugin používá `linear-gradient` + `-webkit-background-clip:text` trick;
      přepisujeme barvy gradientu z plugin defaultů #ff912c → primary green). */

.rmp-rating-widget .rmp-icon {
    font-size: 28px !important;
    line-height: 1 !important;
}
/* Empty / unrated stars — light gray */
.rmp-rating-widget .rmp-icon--star {
    color: #ccc !important;
}
/* Full-filled stars — primary green. `background: none` + `-webkit-text-fill-color: initial`
   resetují plugin gradient pro případ, že parent rule by nasadil gradient styling. */
.rmp-rating-widget .rmp-icon--full-highlight,
.rmp-rating-widget .rmp-icon--full-highlight::before {
    color: var(--geeklife-primary) !important;
    background: none !important;
    -webkit-text-fill-color: initial !important;
}
/* Half-filled — green left 50%, gray right 50% (override plugin orange gradient). */
.rmp-rating-widget .rmp-icon--half-highlight,
.rmp-rating-widget .rmp-icon--half-highlight::before {
    background: linear-gradient(90deg, var(--geeklife-primary) 50%, #ccc 50%) !important;
    -webkit-text-fill-color: transparent !important;
    -webkit-background-clip: text !important;
    background-clip: text !important;
    color: transparent !important;
}
/* Hover preview — plugin přidává `.rmp-icon--hovered` přes JS na stars 1..N
   při hover over star N (před kliknutím). Plugin default color: #ffcc36 (žlutá).
   Override na primary green pro vizuální preview brand-aligned ratingu. */
@media (hover: hover) {
    .rmp-rating-widget .rmp-icon--hovered,
    .rmp-rating-widget .rmp-icon--hovered::before {
        color: var(--geeklife-primary) !important;
    }
}

/* === Ultimate Blocks Review (`.ub_review_block`) hvězdy ===
   Aplikováno stejné brand schéma jako Rate My Post stars:
   empty = šedá `#ccc`, filled = primary green. Plugin používá SVG masku pro
   půl-hvězdy (mask reveal procento z `path.star`), takže stačí přepsat barvy.
   Pokrývá oba wrappery: `.ub_review_stars` (per-criterion) i `.ub_review_average_stars` (Summary 4.7). */
.ub_review_block .ub_review_stars svg path,
.ub_review_block .ub_review_average_stars svg path {
    fill: #ccc !important;
    stroke: #ccc !important;
}
.ub_review_block .ub_review_stars svg path.star,
.ub_review_block .ub_review_average_stars svg path.star {
    fill: var(--geeklife-primary) !important;
    stroke: var(--geeklife-primary) !important;
}
.rmp-rating-widget__icons-list__icon {
    width: auto !important;
    height: auto !important;
}

/* === Homepage featured grid (`.col-feat-grid` text-in-thumb) ===
   Hero karty s background image + text overlay. Aplikujeme stejný visual treatment
   jako single-post hero (single-default-readopt.php inline <style>):
   - radial vignette (corner darkening pro hloubku)
   - vertical gradient (top + bottom shading kvůli text readability)
   - 4px bottom strip primary→secondary
   Plus category label (`.rh-label-string`) přepneme z parent #111 (černá) na secondary magenta. */

.col-feat-grid {
    position: relative;
}
.col-feat-grid::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background:
        radial-gradient(ellipse at center, transparent 55%, rgba(0, 0, 0, 0.25) 100%),
        linear-gradient(to bottom, rgba(0, 0, 0, 0.45) 0%, rgba(0, 0, 0, 0.05) 25%, rgba(0, 0, 0, 0.1) 60%, rgba(0, 0, 0, 0.7) 100%);
    pointer-events: none;
    z-index: 1;
}
.col-feat-grid::after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 4px;
    background: linear-gradient(90deg, var(--geeklife-primary), var(--geeklife-secondary));
    pointer-events: none;
    z-index: 3;
}
.col-feat-grid > * {
    position: relative;
    z-index: 2;
}
/* Category label — secondary magenta místo parent default #111 */
.col-feat-grid .rh-label-string {
    background-color: var(--geeklife-secondary) !important;
    transition: background-color 0.2s ease;
}

/* Editorial typography — h2 ze sans bold na source-serif-pro (magazínový feel) */
.col-feat-grid .text_in_thumb h2 {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif !important;
    font-weight: 700;
    letter-spacing: 0.1px;
}
.col-feat-grid .text_in_thumb h2 a {
    color: #ffffff;
    text-decoration: none;
    /* Slide-in underline trick (background-image), aktivuje se na hover karty */
    background-image: linear-gradient(to right, #ffffff, #ffffff);
    background-position: 0 100%;
    background-size: 0 1px;
    background-repeat: no-repeat;
    transition: background-size 0.35s ease;
    padding-bottom: 1px;
}

/* Hover microstory — content jemně vystoupí, title underline slide-in,
   category label přepne magenta → primary green. */
.col-feat-grid .feat-grid-overlay {
    transition: transform 0.4s ease;
}
.col-feat-grid:hover .feat-grid-overlay {
    transform: translateY(-4px);
}
.col-feat-grid:hover .text_in_thumb h2 a {
    background-size: 100% 1px;
}
.col-feat-grid:hover .rh-label-string {
    background-color: var(--geeklife-primary) !important;
}

/* Skrýt datum publikace + počet komentářů ve featured gridu — clean editorial look. */
.col-feat-grid .text_in_thumb .post-meta {
    display: none;
}

/* === Card-style listing pro `.col_item.column_grid` ===
   Markup z parentu (rehub-theme/inc/parts/column_grid.php) — image v figure +
   title v `.content_constructor h2`. Stejný markup používá:
   - related articles na single posts (`.related_articles` wrapper)
   - homepage Elementor columngrid_loop widget (`.elementor-widget-columngrid_loop`)
   Tady definujeme card-level styling globálně, aby fungovalo na obou kontextech.
   (Wrapper-level pro related_articles — gradient strip, heading — je v article.css.) */

.related_articles .col_item.column_grid,
.elementor-widget-columngrid_loop .col_item.column_grid {
    background: #ffffff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.related_articles .col_item.column_grid:hover,
.elementor-widget-columngrid_loop .col_item.column_grid:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

/* Image — flush top edge, zoom 1.05 na card hover */
.related_articles .col_item figure,
.elementor-widget-columngrid_loop .col_item figure {
    margin: 0 !important;
    overflow: hidden;
    border-top-left-radius: 6px;
    border-top-right-radius: 6px;
}
.related_articles .col_item figure a,
.elementor-widget-columngrid_loop .col_item figure a {
    display: block;
    overflow: hidden;
}
.related_articles .col_item figure img,
.elementor-widget-columngrid_loop .col_item figure img {
    display: block;
    width: 100%;
    height: auto;
    transition: transform 0.4s ease;
}
.related_articles .col_item.column_grid:hover figure img,
.elementor-widget-columngrid_loop .col_item.column_grid:hover figure img {
    transform: scale(1.05);
}

/* Title + content area */
.related_articles .col_item .content_constructor,
.elementor-widget-columngrid_loop .col_item .content_constructor {
    padding: 16px 18px 18px;
}
.related_articles .col_item .content_constructor h2,
.elementor-widget-columngrid_loop .col_item .content_constructor h2 {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1.35 !important;
    margin: 0 !important;
}
.related_articles .col_item .content_constructor h2 a,
.elementor-widget-columngrid_loop .col_item .content_constructor h2 a {
    color: #1a1a1a;
    text-decoration: none;
    transition: color 0.2s ease;
}
.related_articles .col_item.column_grid:hover .content_constructor h2 a,
.elementor-widget-columngrid_loop .col_item.column_grid:hover .content_constructor h2 a {
    color: var(--geeklife-primary);
}

@media (max-width: 767px) {
    .related_articles .col_item .content_constructor,
    .elementor-widget-columngrid_loop .col_item .content_constructor { padding: 12px 14px 14px; }
    .related_articles .col_item .content_constructor h2,
    .elementor-widget-columngrid_loop .col_item .content_constructor h2 { font-size: 15px !important; }
}

/* === Elementor text-editor blockquote — homepage "🚀 Oblíbená témata" boxy ===
   Repeating widget napříč homepage kategorie sekcemi (5+ instancí, každý s vlastním
   Elementor element ID — c884b62, 0dde5eb, 6ebf75a, a754d16, 491b48a, …).
   Generální selektor `.elementor-widget-text-editor blockquote` pokrývá všechny.

   Riziko: pokud někde jinde v Elementoru bude `<blockquote>` který NEMÁ být tento
   visual, scopovat víc. Article body blockquotes jsou už styled separately přes
   `.geeklife-article .post-inner-wrapper blockquote` (article.css). */
.elementor-widget-text-editor blockquote {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-left: none;
    border-radius: 6px;
    padding: 16px 20px;
    margin: 0;
    font-size: 16px;
    line-height: 1.65;
    font-style: normal;
    color: #1a1a1a;
}
.elementor-widget-text-editor blockquote::before {
    content: none;
}
.elementor-widget-text-editor blockquote p {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}
.elementor-widget-text-editor blockquote a {
    color: var(--geeklife-primary);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}
.elementor-widget-text-editor blockquote a:hover {
    color: var(--geeklife-secondary);
    text-decoration-thickness: 2px;
}

/* === Homepage "Oblíbené návody 🧠" — 3 sloupce s <ul> linky → bublin cards ===
   Section ID `b508505` (Elementor), 3× `.elementor-widget-text-editor` s <ul>.
   Stylujeme každý sloupec jako Tip GeekLife box (pale green bublina). */
.elementor-element-b508505 .elementor-widget-text-editor .elementor-widget-container {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 18px 22px;
    height: 100%;
}
.elementor-element-b508505 .elementor-widget-text-editor ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.elementor-element-b508505 .elementor-widget-text-editor li {
    padding: 5px 0;
    line-height: 1.5;
}
.elementor-element-b508505 .elementor-widget-text-editor li a {
    color: var(--geeklife-primary);
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}
.elementor-element-b508505 .elementor-widget-text-editor li a:hover {
    color: var(--geeklife-secondary);
    text-decoration: underline;
}

/* === Homepage "Ponoř se hlouběji" — rehub wpsm_tax_archive widget ===
   Renderuje `.col_wrap_fifth` grid s `.col_item.rh-cartbox.woocatbox` kategorie kartami.
   User: zaoblit hranaté karty. Přidávám border-radius + lehce softer shadow. */
.elementor-widget-wpsm_tax_archive .col_item.rh-cartbox,
.elementor-widget-wpsm_tax_archive .col_item.woocatbox {
    border-radius: 8px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.elementor-widget-wpsm_tax_archive .col_item.rh-cartbox:hover,
.elementor-widget-wpsm_tax_archive .col_item.woocatbox:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.08);
}
.elementor-widget-wpsm_tax_archive .col_item h5 a {
    color: #1a1a1a;
    transition: color 0.2s ease;
}
.elementor-widget-wpsm_tax_archive .col_item:hover h5 a {
    color: var(--geeklife-primary);
}

/* === Homepage sidebar — intro "Na GeekLife.cz máme rádi..." text widget ===
   Specific Elementor text-editor widget v sidebaru s ✔️ paragraphy.
   Stylováno jako pale green bublin (Tip GeekLife look). Selektor scopován na
   element ID — pokud user duplikuje, doplnit do listu. */
.elementor-element-d77ccab .elementor-widget-container {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 18px 22px;
}
.elementor-element-d77ccab p {
    margin: 0 0 10px;
    font-size: 15px;
    line-height: 1.55;
    color: #2a2a2a;
}
.elementor-element-d77ccab p:last-of-type {
    margin-bottom: 0;
}
.elementor-element-d77ccab a {
    color: var(--geeklife-primary);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}
.elementor-element-d77ccab a:hover {
    color: var(--geeklife-secondary);
    text-decoration-thickness: 2px;
}

/* === Homepage sidebar — Recenze uživatelů (Elementor testimonial widget) ===
   Markup:
   <div.elementor-testimonial-wrapper>
     <div.elementor-testimonial-content>Quote</div>
     <div.elementor-testimonial-meta>
       <div.elementor-testimonial-image><img/></div>
       <div.elementor-testimonial-details>
         <div.elementor-testimonial-name>Name</div>
         <div.elementor-testimonial-job>Role</div>
   White card + 3px primary green left accent + quote glyph. */
.elementor-widget-testimonial .elementor-testimonial-wrapper {
    background: #ffffff;
    border-left: 3px solid var(--geeklife-primary);
    border-radius: 6px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.05);
    padding: 20px 22px 18px 60px;
    position: relative;
    margin-bottom: 18px;
}
/* Decorative quote glyph vlevo nahoře */
.elementor-widget-testimonial .elementor-testimonial-wrapper::before {
    content: '\201E';
    position: absolute;
    left: 18px;
    top: 14px;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 60px;
    line-height: 0.85;
    color: var(--geeklife-primary);
    opacity: 0.35;
    pointer-events: none;
}
.elementor-widget-testimonial .elementor-testimonial-content {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif;
    font-size: 14px;
    line-height: 1.5;
    font-style: italic;
    color: #2c2c2c;
    margin-bottom: 12px;
}
.elementor-widget-testimonial .elementor-testimonial-meta {
    display: flex;
    align-items: center;
    gap: 12px;
}
.elementor-widget-testimonial .elementor-testimonial-meta-inner {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
}
.elementor-widget-testimonial .elementor-testimonial-image {
    flex-shrink: 0;
}
.elementor-widget-testimonial .elementor-testimonial-image img {
    width: 42px !important;
    height: 42px !important;
    border-radius: 50%;
    object-fit: cover;
    display: block;
}
.elementor-widget-testimonial .elementor-testimonial-name {
    font-family: source-serif-pro, Georgia, serif;
    font-size: 15px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.2;
}
.elementor-widget-testimonial .elementor-testimonial-job {
    font-size: 12px;
    color: #999;
    margin-top: 2px;
}

/* Fallback styling pro starou strukturu Google oblíbené patternu (v1) — kvůli
   WP page cache může být na nějakou dobu po update v2 servírovaná stará HTML.
   Tady drží SVG na rozumné velikosti místo intrinsic huge default. */
.geeklife-google-fav-btn-wrap {
    text-align: center;
    margin: 24px 0;
}
.geeklife-google-fav-btn-wrap a {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    color: var(--geeklife-primary);
    text-decoration: none;
    font-weight: 600;
}
.geeklife-google-fav-btn-wrap svg {
    width: 28px;
    height: 28px;
    flex-shrink: 0;
}

/* === Google Preferred Sources card („Google oblíbené" Synced Pattern) ===
   Stejný visual styl jako `.geeklife-author-box` (article.css) — pale primary
   green tint, jemný green border, rounded 6px. Layout: Google logo vlevo,
   intro text + link sentence vpravo. */
.geeklife-google-fav-card {
    display: flex;
    align-items: center;
    gap: 14px;
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 16px 18px;
    margin: 24px 0;
}
.geeklife-google-fav-card__icon {
    flex-shrink: 0;
    line-height: 0;
}
.geeklife-google-fav-card__icon svg {
    width: 28px;
    height: 28px;
    display: block;
}
.geeklife-google-fav-card__text {
    font-size: 15px;
    line-height: 1.55;
    color: #1a1a1a;
}
.geeklife-google-fav-card__text a {
    color: var(--geeklife-primary);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}
.geeklife-google-fav-card__text a:hover {
    color: var(--geeklife-secondary);
    text-decoration-thickness: 2px;
}

/* === Archive header (kategorie / tag) — widget-style card ===
   Parent renderuje:
   - <div.wpsm-cat-title><div.font140.fontbold.rehub-main-font>Title</div></div>
   - <article.top_rating_text.post.mb15>Description</article>
   Obalíme nadpis jako widget card (zelený tint, border, radius) a popisek
   vizuálně přilepíme jako součást téhož boxu. */

.main-side > .wpsm-cat-title {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 18px 20px 16px;
    margin-bottom: 0;
}
.main-side > .wpsm-cat-title + .top_rating_text {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-top: none;
    border-radius: 0 0 6px 6px;
    padding: 10px 20px 18px;
    margin-bottom: 25px;
}
.main-side > .wpsm-cat-title:has(+ .top_rating_text) {
    border-bottom: none;
    border-radius: 6px 6px 0 0;
    margin-bottom: 0;
    padding-bottom: 12px;
}
.main-side > .wpsm-cat-title .font140 {
    font-family: source-serif-pro, Georgia, "Times New Roman", Times, serif;
    font-size: 22px;
    font-weight: 700;
    color: #1a1a1a;
    line-height: 1.3;
    padding-bottom: 10px;
    position: relative;
}
.main-side > .wpsm-cat-title .font140::after {
    content: '';
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: var(--geeklife-primary);
}
.main-side > .top_rating_text {
    font-size: 15px;
    line-height: 1.6;
    color: #2a2a2a;
}
.main-side > .top_rating_text p {
    margin: 0;
}


.main-side > .cat_seo_description {
    background: rgba(141, 195, 34, 0.05);
    border: 1px solid rgba(141, 195, 34, 0.12);
    border-radius: 6px;
    padding: 18px 20px;
    font-size: 15px;
    line-height: 1.6;
    color: #2a2a2a;
}
.main-side > .cat_seo_description p {
    margin: 0 0 10px;
}
.main-side > .cat_seo_description p:last-child {
    margin-bottom: 0;
}
.main-side > .cat_seo_description a {
    color: var(--geeklife-primary);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 3px;
    transition: color 0.2s ease;
}
.main-side > .cat_seo_description a:hover {
    color: var(--geeklife-secondary);
    text-decoration-thickness: 2px;
}

/* === Magazinenews listing === */

/* Perex — max 2 řádky s ellipsis */
.magazinenews-desc > p.greycolor {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

/* Thumbnail upgrade */
.geeklife-magazinenews-figure {
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
    transition: box-shadow 0.3s ease;
    background: #f5f5f5;
    margin: 0;
}
.geeklife-magazinenews-figure img {
    display: block !important;
    width: 100% !important;
    height: 160px !important;
    object-fit: cover !important;
    transition: transform 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
}
.magazinenews:hover .geeklife-magazinenews-figure {
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.14);
}
@media (hover: hover) and (min-width: 768px) {
    .magazinenews:hover .geeklife-magazinenews-figure img {
        transform: scale(1.05);
    }
}
@media (prefers-reduced-motion: reduce) {
    .geeklife-magazinenews-figure,
    .geeklife-magazinenews-figure img {
        transition: none;
    }
    .magazinenews:hover .geeklife-magazinenews-figure img {
        transform: none;
    }
}
