/*
 Theme Name:   GeneratePress Child
 Template:     generatepress
 Version:      0.1
*/

/* ===============================
   GLOBAL COLORS
================================ */
:root {
    --ithy-gold: #CC9900;
    --ithy-teal: #3D867E;
    --ithy-teal-light: #E4F0EE;
    --ithy-body-bg: #E0DED9;
}

/* ===============================
   BASE RESET
================================ */
body,
.site,
#page,
.site-content {
    background-color: var(--ithy-body-bg) !important;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #111;
}

/* ===============================
   ITHY HOMEPAGE – BASE LAYOUT
================================ */

.ithy-homepage-wrapper {
    background: var(--ithy-body-bg);
}

/* Centered main container */
.ithy-container {
    max-width: 960px;
    margin: 0 auto;
    padding: 0 22px;
}

/* Generic section spacing */
.ithy-section {
    padding: 65px 0;
}

/* Optional alt background section */
.ithy-section.alt {
    background: #DCDAD4;
    border-radius: 14px;
}

/* Center section headings & intro texts on homepage */
.ithy-homepage-wrapper .ithy-section > .ithy-container {
    text-align: center;
}

/* Optional intro paragraph inside sections */
.ithy-homepage-wrapper .section-intro {
    max-width: 680px;
    margin: 0 auto 25px;
    font-size: 1rem;
    color: #444;
}

/* ===============================
   HERO
================================ */

.ithy-hero {
    text-align: center;
    padding: 80px 20px 70px;
    background: #DCDAD4;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.ithy-hero h1 {
    font-size: 2.2rem;
    color: #1a1c1f;
    margin-bottom: 15px;
}

.ithy-sub {
    font-size: 1.1rem;
    color: #444;
    max-width: 680px;
    margin: 0 auto 25px;
}

/* ===============================
   BUTTONS
================================ */

.ithy-btn {
    padding: 12px 24px;
    border-radius: 8px;
    font-weight: 600;
    text-decoration: none;
    margin: 5px;
    display: inline-block;
}

.ithy-btn.primary {
    background: var(--ithy-teal);
    color: #fff;
}

.ithy-btn.danger {
    background: #b42323;
    color: #fff;
}

.ithy-btn.small {
    padding: 8px 16px;
}

/* ===============================
   GRID & CARDS
================================ */

/* Responsive grid */
.ithy-homepage-wrapper .ithy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
    gap: 28px;
    justify-items: center; /* visually center items */
}

/* Card look */
.ithy-homepage-wrapper .ithy-card {
    background: #F2F2F0;
    padding: 22px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    text-decoration: none;
    color: #111;
    transition: 0.25s ease;
    width: 100%;
    max-width: 340px; /* keep cards visually centered, not full-width */
    text-align: left; /* content inside card stays readable */
}

.ithy-homepage-wrapper .ithy-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 14px rgba(0,0,0,0.10);
}

.ithy-homepage-wrapper .ithy-card h3 {
    color: var(--ithy-teal);
    margin-bottom: 10px;
}

.ithy-homepage-wrapper .ithy-card.article img {
    width: 100%;
    border-radius: 10px;
    margin-bottom: 12px;
}

/* ===============================
   EXPERT BOX
================================ */

.ithy-expert-box {
    display: flex;
    flex-wrap: wrap;
    gap: 25px;
    background: #F2F2F0;
    padding: 22px;
    border-radius: 14px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.06);
    justify-content: center;   /* center layout when wrapping */
    text-align: center;        /* mobile default */
}

.ithy-expert-box img {
    width: 160px;
    max-width: 100%;
    min-width: 120px;
    height: auto;
    border-radius: 10px;
    object-fit: cover;
}

.expert-info {
    flex-grow: 1;
    max-width: calc(100% - 185px);
    text-align: left;          /* desktop text alignment */
}

.expert-info h3 {
    color: var(--ithy-teal);
    margin-bottom: 10px;
}

/* ===============================
   EXPERT BOX – MOBILE
================================ */

@media (max-width: 600px) {
    .ithy-expert-box {
        flex-direction: column;
        text-align: center;
    }

    .ithy-expert-box img {
        width: 60%;
        max-width: 200px;
        margin-bottom: 15px;
    }

    .expert-info {
        max-width: 100%;
        text-align: center;
    }
}

/* ===============================
   AUTHOR MAIL BADGE (if reused)
================================ */

.ithy-author-mail {
    background: var(--ithy-teal);
    color: #fff;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 0.8rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    height: 26px;
}

.ithy-author-mail .mail-icon {
    font-size: 14px;
    margin-top: 0;
}


/* ===============================
   ARTICLE PAGE
================================ */
.single .site-content {
    display: flex;
    justify-content: center;
}
.single .inside-article {
    max-width: 100%;
    background: #DCDAD4;
    border-radius: 10px;
    box-shadow: 0 3px 12px rgba(0,0,0,0.06);
    overflow: hidden;
}
.single .entry-content {
    padding: 32px 26px 40px;
}

/* ===============================
   Empfehlungen Box
================================ */
.ithy-recommend-box {
    margin-top: 60px;
    background: #E0DED9;
    padding: 40px 20px 50px;
    border-radius: 12px;
}

.ithy-rec-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: var(--ithy-gold);
    margin-bottom: 35px;
    border-left: 4px solid var(--ithy-gold);
    padding-left: 14px;
}

.ithy-recommend-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.ithy-recommend-item {
    background: var(--ithy-gold);
    padding: 18px 22px;
    border-radius: 18px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    text-decoration: none;
    color: #fff;
    font-size: 1.05rem;
    font-weight: 500;
    transition: 0.25s ease;
}
.ithy-recommend-item:hover {
    background: #b98a00;
    transform: translateY(-3px);
}
.ithy-recommend-item .rec-arrow {
    font-size: 1.4rem;
    font-weight: 700;
}

/* Mobile */
@media (max-width: 768px) {
    .ithy-recommend-item { font-size: 1rem; padding: 16px 18px; }
    .ithy-rec-title { font-size: 1.4rem; }
}

/* ===============================
   AUTHOR BOX
================================ */
.ithy-author-box {
    background: #DCDAD4;
    padding: 45px 25px;
    border-radius: 14px;
    margin-top: 70px;
    box-shadow: 0 3px 12px rgba(0,0,0,0.08);
}

.ithy-author-wrapper {
    display: flex;
    gap: 28px;
    align-items: flex-start;
}

.ithy-author-photo img {
    width: 160px;
    height: 160px;
    border-radius: 12px;
    object-fit: cover;
}

.ithy-author-name {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--ithy-teal);
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
}

.ithy-author-role {
    font-size: 1rem;
    color: #444;
    margin-bottom: 18px;
}

.ithy-author-bio {
    font-size: 1rem;
    line-height: 1.75;
    margin-bottom: 20px;
}

.ithy-author-reviewed {
    margin-top: 8px;
    background: var(--ithy-teal-light);
    padding: 14px 16px;
    border-radius: 10px;
    font-size: 0.98rem;
    line-height: 1.55;
    color: #1a1c1f;
}
.ithy-author-reviewed strong {
    color: var(--ithy-gold);
}

/* Mobile Fix */
@media (max-width: 768px) {
    .ithy-author-wrapper { flex-direction: column; text-align: center; }
    .ithy-author-photo img { width: 140px; height: 140px; margin-bottom: 15px; }
    .ithy-author-name { justify-content: center; }
    .ithy-author-reviewed { text-align: center; }
}

/* Center text perfectly inside the email button */
.ithy-author-mail {
    background: var(--ithy-teal);
    color: #fff;
    border-radius: 6px;
    padding: 6px 10px;
    font-size: 0.8rem;
    line-height: 1;
    display: inline-flex;
    align-items: center;  /* 🔥 أهم سطر */
    justify-content: center;
    text-decoration: none;
    height: 26px;          /* يخليها مش متمددة */
}

/* Fix icon alignment */
.ithy-author-mail .mail-icon {
    font-size: 14px;
    margin-top: 0;         /* كانت عاملة نزلة لتحت */
}

/* ===============================
   HEADINGS
================================ */
.entry-content h2 {
    color: var(--ithy-gold);
    margin-top: 40px;
    margin-bottom: 12px;
    padding-left: 18px;
    position: relative;
}
.entry-content h3 {
    color: var(--ithy-teal);
    margin-top: 24px;
    margin-bottom: 10px;
    padding-left: 18px;
    position: relative;
}

.entry-content h2::before,
.entry-content h3::before {
    content: "";
    position: absolute;
    left: 0;
    width: 4px;
    height: 80%;
    top: 4px;
    background: var(--ithy-gold);
    border-radius: 8px;
}

/* Paragraphs */
.entry-content p {
    line-height: 1.75;
    margin-bottom: 16px;
}

/* ===============================
   LISTS
================================ */
.entry-content ul {
    background: #CFD4CF;
    padding: 28px 34px !important;
    border-left: 5px solid var(--ithy-teal);
    border-radius: 14px;
    margin: 30px 0 !important;
    list-style: none;
}
.entry-content ul li {
    padding-left: 28px;
    margin-bottom: 16px;
    position: relative;
    font-size: 1.07rem;
}
.entry-content ul li::before {
    content: "";
    width: 11px;
    height: 11px;
    background: var(--ithy-teal);
    position: absolute;
    left: 0;
    top: 8px;
    border-radius: 3px;
}

/* =====================================
   FAQ – Final Clean Version (Your Colors)
===================================== */

.tox-faq {
    margin-top: 30px;
}

/* FAQ item container */
.tox-faq-item {
    margin-bottom: 22px;
}

/* Question bar */
.tox-faq-question {
    width: 100%;
    background: linear-gradient(90deg, #3E857C, #2F6F68);
    color: #fff;
    font-weight: 700;
    font-size: 18px;
    padding: 16px 22px;
    border-radius: 10px;
    border: none;
    text-align: left;
    cursor: pointer;
    display: flex;
    align-items: center;
    gap: 12px;
}

/* Icon before question */
.tox-faq-question::before {
    content: "?";
    background: #D7E5E1;
    color: #3E857C;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 900;
    font-size: 16px;
}

/* Open state */
.tox-faq-question.open {
    background: linear-gradient(90deg, #356F66, #2A5D57);
}

/* Answer box */
.tox-faq-answer {
    display: none;
    background: #CFD4CF;
    padding: 18px 22px;
    font-size: 16px;
    color: #222;
    border-radius: 10px;
    border: 1px solid #b9c0ba;
    margin-top: 8px;
    line-height: 1.6;
}


/* ===============================
   HOME OVERRIDES
================================ */
body.home div#page .site-content,
body.home div#page .inside-article {
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    border:none !important;
    box-shadow:none !important;
}
body.home .entry-content {
    padding:0 !important;
    margin:0 !important;
}

/* ===============================
   ARTICLE HEADER
================================ */
.article-title-background {
    position: relative;
    padding: 70px 20px 50px;
    background-size: cover !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    min-height: 320px;
}

.article-title-background::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(26, 28, 31, 0.65) 0%,
        rgba(26, 28, 31, 0.9) 70%
    );
}

.article-title-container {
    position: relative;
    max-width: 760px;
    margin: 0 auto;
    color: #fff;
}

.article-title-container h1 {
    font-size: 2.1rem;
    margin-bottom: 14px;
    font-weight: 700;
}

.article-title-container h3.article-subtitle {
    font-size: 1.05rem;
    margin-bottom: 25px;
    opacity: 0.9;
}

/* Remove default header */
.single .inside-article .entry-header {
    display: none !important;
}

.article-hero-img {
    display: none !important;
}

.single .inside-article {
    margin-top: -30px;
}

.article-subtitle {
    color: #ffffff !important;
}

/* ===============================
  Tables
================================ */

.table-scroll-wrapper {
    display: block;
}

.compact-table-mobile {
    display: none;
}

/* Mobile: أخفي الجدول واظهر النسخة الجديدة */
@media (max-width: 768px) {
    .table-scroll-wrapper {
        display: none !important;
    }
    .compact-table-mobile {
        display: block !important;
    }

    .compact-table-mobile .row-card {
        background: #BECCC6;
        border-radius: 10px;
        padding: 15px;
        margin-bottom: 15px;
        border: 1px solid #A3BDB6;
    }

    .compact-table-mobile .row-title {
        background: #7CA79F;
        color: #fff;
        padding: 12px;
        font-weight: bold;
        border-radius: 8px;
        cursor: pointer;
    }

    .compact-table-mobile .row-content {
        display: none;
        padding-top: 10px;
    }

    .compact-table-mobile .row-card.active .row-content {
        display: block;
    }

    .compact-table-mobile .cell {
        background: #d8e3df;
        padding: 10px;
        border-radius: 6px;
        margin-bottom: 8px;
    }
}
/* Arrow icon (CSS-only) */
.compact-table-mobile .row-arrow {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-right: 2px solid #fff;
    border-bottom: 2px solid #fff;
    transform: rotate(45deg);
    transition: transform 0.25s ease-in-out;
    float: right;
    margin-top: 4px;
}

/* Rotate arrow on open */
.compact-table-mobile .row-card.active .row-arrow {
    transform: rotate(-135deg);
}

/* Smooth slide animation */
.compact-table-mobile .row-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
}

.compact-table-mobile .row-card.active .row-content {
    max-height: 9999px; /* يفتح لأي طول بدون قص */
}


/* ===============================
   TOC FIXES
================================ */
#ithy-toc {
    background: transparent !important;   /* شفاف */
    padding: 0 !important;                /* بدون صندوق */
    margin: 20px 0;
    border-radius: 0 !important;          /* بدون كورنرز */
    box-shadow: none !important;          /* بدون ظل */
}

/* عنوان TOC */
#ithy-toc .toc-title {
    font-weight: 700;
    font-size: 1.05rem;
    cursor: pointer;
    color: #fff;                 /* نفس لون الهيدر */
    display: flex;
    align-items: center;
    margin-bottom: 8px;          /* مسافة بسيطة */
}

/* السهم */
#ithy-toc .toc-title::after {
    content: "▼";
    margin-left: 10px;
    transition: transform 0.3s ease;
}

#ithy-toc.collapsed .toc-title::after {
    transform: rotate(-90deg);
}

/* قائمة الروابط */
#ithy-toc .toc-list {
    list-style: none;
    margin: 0;
    padding-left: 0;
}

#ithy-toc.collapsed .toc-list {
    display: none;
}

/* العناصر */
#ithy-toc .toc-list li a {
    font-size: 1.05rem;
    color: #fff;
    opacity: .9;
    text-decoration: none;
    display: block;
    padding: 6px 0;
}

#ithy-toc .toc-list li a:hover {
    color: var(--ithy-gold);
}
#ithy-toc.collapsed .toc-list {
    display: none;
}
#ithy-toc .toc-list {
    display: block;
}

/* ===============================
   CHART & MINDMAP FIXES (Responsive)
================================ */

/* 1. تنسيق الحاوية المرنة للمخططات */
.tox-chart-block {
    width: 100%;
    margin: 25px 0;
    
    /* مفتاح الحل: الحاوية المرنة */
    position: relative;
    height: 0; 
    padding-bottom: 80%; /* نسبة الارتفاع إلى العرض: 80% للعرض (1:1.25) */
    max-width: 100%; 
    box-sizing: border-box;
}

/* جعل الـ Canvas يملأ الحاوية المرنة تمامًا */
.tox-chart-block canvas.tox-chart {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

@media (max-width: 768px) {
    /* زيادة ارتفاع المخطط على الموبايل ليظهر أكبر وأوضح (نسبة 1:1) */
    .tox-chart-block {
        padding-bottom: 100%;
    }
}


/* 2. تنسيق الخريطة الذهنية (Mindmap) */
.tox-mindmap {
    font-family: monospace;
    white-space: pre;
    overflow-x: auto;
    width: 100%;
    padding: 10px;
    border: 1px solid #eee;
    box-sizing: border-box;
    font-size: 0.85rem;   /* حجم عادي خارج الزووم */
    line-height: 1.5;
}

.tox-mindmap-title {
    font-size: 1.4em;
    margin-bottom: 10px;
}

.tox-map-caption {
    font-size: 0.9em;
    color: #666;
    margin-top: 10px;
}

/* ===============================
   INTERNAL LINKS
================================ */
.ithy-internal-link {
    color: var(--ithy-teal) !important;
    font-weight: 600;
    text-decoration: none;
    border-bottom: 1px solid var(--ithy-teal);
}
.ithy-internal-link:hover {
    color: var(--ithy-gold) !important;
    border-color: var(--ithy-gold);
}

/* ===================================
   KONTAKTFORMULAR STYLES (Ohne Plugin)
====================================== */

.ithy-kontaktformular-wrapper label {
    display: block;
    margin-bottom: 5px;
    font-weight: bold;
    color: #333;
}

.ithy-kontaktformular-wrapper input[type="text"],
.ithy-kontaktformular-wrapper input[type="email"],
.ithy-kontaktformular-wrapper textarea {
    width: 100%;
    padding: 10px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
    font-size: 16px; /* Wichtig für Mobile-Usability */
}

.ithy-kontaktformular-wrapper textarea {
    resize: vertical;
}

.ithy-kontaktformular-wrapper button {
    background-color: var(--ithy-teal, #388278);
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    font-size: 18px;
    transition: background-color 0.3s;
}

.ithy-kontaktformular-wrapper button:hover {
    background-color: #2b615b; /* Dunklerer Teal-Ton beim Hover */
}

/* Nachrichten-Styles */
.kontakt-success-message {
    padding: 15px;
    background-color: #d4edda; /* Grüner Hintergrund */
    color: #155724; /* Dunkelgrüner Text */
    border: 1px solid #c3e6cb;
    border-radius: 5px;
    margin-bottom: 20px;
}

.kontakt-error-message {
    padding: 15px;
    background-color: #f8d7da; /* Roter Hintergrund */
    color: #721c24; /* Dunkelroter Text */
    border: 1px solid #f5c6cb;
    border-radius: 5px;
    margin-bottom: 20px;
}
/* ===============================
   INLINE ZOOM FOR CHARTS & MINDMAPS (MOBILE)
================================ */

/* Zoom button */
.tox-zoom-btn {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--ithy-gold, #CC9900);
  background: transparent;
  color: #fff;
  font-size: 0.85rem;
  cursor: pointer;
  margin: 4px 0 10px;
}

/* Hide zoom button on large screens */
@media (min-width: 901px) {
  .tox-zoom-btn {
    display: none;
  }
}

/* Normal wrappers */
.tox-mindmap-wrapper,
.tox-chart-wrapper {
  position: relative;
  width: 100%;
  margin-bottom: 20px;
}

/* Mobile zoom mode */
@media (max-width: 900px) {

  /* فل سكرين للـ Wrapper في وضع الزووم */
  .tox-mindmap-wrapper.tox-zoom-inline,
  .tox-chart-wrapper.tox-zoom-inline {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: #050506;
    padding: 10px;
    overflow: auto;
  }

  /* Chart: bigger height when zoomed */
  .tox-chart-wrapper.tox-zoom-inline .tox-chart-block {
    padding-bottom: 140%;
  }

  .tox-chart-wrapper.tox-zoom-inline canvas.tox-chart {
    width: 100% !important;
    height: 100% !important;
  }

  /* Mindmap: bigger font & wider content, no rotate */
  .tox-mindmap-wrapper.tox-zoom-inline .tox-mindmap {
    font-size: 1.25rem;
    line-height: 1.8;
    border: none;
    background: transparent;
    color: #fff;
    min-width: 900px; /* تخليها أعرض من الشاشة في Portrait */
  }

  /* Hide title & caption in zoom mode */
  .tox-mindmap-wrapper.tox-zoom-inline .tox-mindmap-title,
  .tox-mindmap-wrapper.tox-zoom-inline .tox-map-caption {
    display: none;
  }

  /* Zoom button sticky as "close" */
  .tox-mindmap-wrapper.tox-zoom-inline .tox-zoom-btn,
  .tox-chart-wrapper.tox-zoom-inline .tox-zoom-btn {
    position: sticky;
    top: 0;
    left: 0;
    z-index: 10000;
    background: var(--ithy-gold, #CC9900);
    border-color: var(--ithy-gold, #CC9900);
    color: #111;
  }

  /* Hint يظهر بس في وضع الزووم على الموبايل */
  .tox-mindmap-wrapper.tox-zoom-inline .tox-zoom-hint {
    display: block;
    text-align: center;
  }
}

/* Hint text (default: hidden) */
.tox-zoom-hint {
  display: none;
  font-size: 0.8rem;
  color: #ddd;
  margin: 4px 0 8px;
}
/* Fix huge gap between author box and recommendations */
.single-buch .author-box,
.single-buch .buch-author-box {
  /* Reduce bottom margin under the author box */
  margin-bottom: 20px !important;
}

/* If there's a spacer directly after the author box, kill it */
.single-buch .author-box + .wp-block-spacer,
.single-buch .buch-author-box + .wp-block-spacer {
  display: none;
}
/* ===============================
   CATEGORY PAGES
================================ */

/* Wrapper background */
.ithy-category-wrapper {
    background: var(--ithy-body-bg);
}

/* Hero area */
.ithy-category-hero {
    padding: 60px 0 40px;
    background: #DCDAD4;
    border-bottom: 1px solid rgba(0,0,0,0.08);
}

.ithy-category-hero .ithy-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

/* Category image */
.ithy-cat-image {
    margin-bottom: 20px;
}
.ithy-cat-image img {
    max-width: 220px;
    height: auto;
    border-radius: 12px;
    object-fit: cover;
    box-shadow: 0 3px 10px rgba(0,0,0,0.12);
}

/* Category title + description */
.ithy-cat-title {
    font-size: 2rem;
    font-weight: 700;
    color: #1a1c1f;
    margin-bottom: 12px;
}

.ithy-cat-desc {
    max-width: 680px;
    margin: 0 auto;
    font-size: 1rem;
    color: #444;
    line-height: 1.7;
}

/* ===============================
   CATEGORY GRID & CARDS
   (reuse homepage look)
================================ */

.ithy-category-wrapper .ithy-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(260px,1fr));
    gap: 28px;
    justify-items: center;
}

/* Generic card for category subcategories & posts */
.ithy-category-wrapper .ithy-card {
    background: #F2F2F0;
    padding: 22px;
    border-radius: 12px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.06);
    text-decoration: none;
    color: #111;
    transition: 0.25s ease;
    width: 100%;
    max-width: 340px;
    text-align: left;
}

.ithy-category-wrapper .ithy-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 6px 14px rgba(0,0,0,0.10);
}

/* Card image */
.ithy-category-wrapper .ithy-card img {
    width: 100%;
    height: auto;
    border-radius: 10px;
    margin-bottom: 12px;
    object-fit: cover;
}

/* Card titles & text */
.ithy-category-wrapper .ithy-card h3 {
    color: var(--ithy-teal);
    margin-bottom: 8px;
    font-size: 1.1rem;
}

.ithy-category-wrapper .ithy-card p {
    font-size: 0.95rem;
    color: #333;
    line-height: 1.6;
    margin-bottom: 0;
}

/* Section titles inside category pages */
.ithy-category-wrapper .ithy-sec-title {
    font-size: 1.6rem;
    font-weight: 700;
    color: #1a1c1f;
    text-align: left;
    margin-bottom: 24px;
}

/* Mobile tweaks */
@media (max-width: 768px) {
    .ithy-cat-title {
        font-size: 1.6rem;
    }
    .ithy-category-hero {
        padding: 40px 0 30px;
    }
}
/* ===============================
   BEZIEHUNGSRETTER COLOR THEME
   (override toxische.de colors)
================================ */

/* New global color palette for beziehungsretter.net */
:root {
    --ithy-gold: #C94B5B;        /* Primary accent – warm berry/red */
    --ithy-teal: #325E72;        /* Secondary – deep slate blue */
    --ithy-teal-light: #F9E8EC;  /* Soft light rose for highlight boxes */
    --ithy-body-bg: #F5F2F0;     /* Overall page background – warm neutral */
}

/* Base background */
body,
.site,
#page,
.site-content {
    background-color: var(--ithy-body-bg) !important;
}

/* Sections & hero on all pages */
.ithy-section.alt,
.ithy-hero,
.ithy-category-hero,
.single .inside-article,
.ithy-author-box,
.ithy-recommend-box {
    background: #F0EBE7;
}

/* Homepage wrapper and category wrapper */
.ithy-homepage-wrapper,
.ithy-category-wrapper {
    background: var(--ithy-body-bg);
}

/* Cards (homepage, category grids, article cards) */
.ithy-homepage-wrapper .ithy-card,
.ithy-category-wrapper .ithy-card,
.ithy-recommend-item {
    background: #FFFFFF;
    box-shadow: 0 2px 8px rgba(0,0,0,0.05);
}

/* Recommendation items accent */
.ithy-recommend-item {
    background: var(--ithy-gold);
}
.ithy-recommend-item:hover {
    background: #A53C4C;
}

/* Card titles & headings – use new accent colors */
.ithy-homepage-wrapper .ithy-card h3,
.ithy-category-wrapper .ithy-card h3,
.ithy-author-name,
.entry-content h3 {
    color: var(--ithy-teal);
}

.entry-content h2,
.ithy-rec-title {
    color: var(--ithy-gold);
}

/* Heading left bar */
.entry-content h2::before,
.entry-content h3::before {
    background: var(--ithy-gold);
}

/* Lists inside article content */
.entry-content ul {
    background: #F3EDEF;
    border-left: 5px solid var(--ithy-teal);
}
.entry-content ul li::before {
    background: var(--ithy-teal);
}

/* Author reviewed box */
.ithy-author-reviewed {
    background: var(--ithy-teal-light);
}
.ithy-author-reviewed strong {
    color: var(--ithy-gold);
}

/* Buttons */
.ithy-btn.primary,
.ithy-author-mail,
.ithy-kontaktformular-wrapper button {
    background: var(--ithy-teal);
    color: #fff;
}

.ithy-btn.danger {
    background: #B23A48;
    color: #fff;
}

/* Internal links highlight */
.ithy-internal-link {
    color: var(--ithy-teal) !important;
    border-bottom: 1px solid var(--ithy-teal);
}
.ithy-internal-link:hover {
    color: var(--ithy-gold) !important;
    border-color: var(--ithy-gold);
}

/* FAQ block – adapt to new palette */
.tox-faq-question {
    background: linear-gradient(90deg, #C94B5B, #93405A);
}
.tox-faq-question::before {
    background: #F9E8EC;
    color: #C94B5B;
}
.tox-faq-question.open {
    background: linear-gradient(90deg, #A53C4C, #7A334A);
}
.tox-faq-answer {
    background: #F3EDEF;
    border-color: #E0D3D8;
}

/* Table mobile cards – adapt neutral tones */
.compact-table-mobile .row-card {
    background: #F0EBE7;
    border-color: #DDCED0;
}
.compact-table-mobile .row-title {
    background: var(--ithy-teal);
}
.compact-table-mobile .cell {
    background: #F7F1F3;
}

/* Category hero image slight shadow */
.ithy-cat-image img {
    box-shadow: 0 3px 10px rgba(0,0,0,0.10);
}

/* Article hero overlay stays dark – works with any brand */
.article-title-background::before {
    background: linear-gradient(
        180deg,
        rgba(15, 18, 22, 0.7) 0%,
        rgba(5, 8, 12, 0.92) 70%
    );
}