/*
Theme Name: ניהול מוניטין באינטרנט
Author: ליגה קידום אתרים
Author URI: https://www.ligaseo.co.il
Description: תבנית מותאמת אישית לניהול מוניטין
Version: 1.0
Text Domain: internet-foxes
*/

/* ==========================================================================
   הגדרות בסיס (Base Styles)
   ========================================================================== */
body { 
    font-family: 'Rubik', sans-serif !important; 
    background-color: #f8f9ff; 
    min-height: max(884px, 100dvh);
}

.material-symbols-outlined { 
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24; 
    display: inline-block;
    vertical-align: middle;
}

/* ==========================================================================
   קלאסים שימושיים לעיצוב (Utility Classes)
   ========================================================================== */
.glass-card { 
    background: rgba(255, 255, 255, 0.8); 
    backdrop-filter: blur(20px); 
    border: 1px solid rgba(186, 198, 224, 0.3); 
}

.pulse-node { 
    position: relative; 
}

.pulse-node::after { 
    content: ''; 
    position: absolute; 
    width: 8px; 
    height: 8px; 
    background: #0058be; 
    border-radius: 50%; 
    left: -4px; 
    top: 8px; 
    box-shadow: 0 0 10px #0058be; 
}

/* ==========================================================================
   עיצוב אזור התוכן הפנימי של הפוסטים (article-content)
   ========================================================================== */

/* עיצוב כותרות פנימיות */
.article-content h2 { 
    font-family: 'Rubik', sans-serif; 
    font-size: 32px; 
    font-weight: 600; 
    margin-top: 48px; 
    margin-bottom: 16px; 
    color: #0F172A; 
}

.article-content h3 { 
    font-family: 'Rubik', sans-serif; 
    font-size: 24px; 
    font-weight: 600; 
    margin-top: 32px; 
    margin-bottom: 16px; 
    color: #0F172A; 
}

/* עיצוב פסקאות */
.article-content p { 
    font-family: 'Rubik', sans-serif; 
    font-size: 18px; 
    line-height: 1.8; 
    margin-bottom: 24px; 
    color: #45464d; 
}

/* עיצוב רשימות */
.article-content ul, 
.article-content ol {
    margin-bottom: 24px;
    padding-inline-start: 24px;
    color: #45464d;
    font-size: 18px;
    line-height: 1.8;
}

/* עיצוב קישורים בתוך הטקסט - צבע כתום בולט בהתאם לדרישה */
.article-content p a, 
.article-content li a { 
    color: #FF9F1C; 
    font-weight: 600; 
    text-decoration: underline; 
    transition: color 0.3s ease; 
}

.article-content p a:hover, 
.article-content li a:hover { 
    color: #e68a00; 
}

/* ==========================================================================
   עיצוב בלוק שאלות ותשובות (Gutenberg Details Block / FAQ)
   ========================================================================== */
.article-content details { 
    background-color: #ffffff; 
    border: 1px solid #c6c6cd; 
    border-radius: 0.5rem; 
    overflow: hidden; 
    margin-bottom: 1rem; 
}

.article-content summary { 
    display: flex; 
    justify-content: space-between; 
    align-items: center; 
    padding: 1.5rem; 
    cursor: pointer; 
    font-size: 1.125rem; /* 18px */
    font-weight: 600; 
    list-style: none; 
    color: #0F172A; 
}

/* הסתרת החץ הרגיל של הדפדפן */
.article-content summary::-webkit-details-marker { 
    display: none; 
}

/* הוספת אייקון מותאם אישית לחץ (מבוסס על Material Symbols) */
.article-content summary::after {
    content: "\e313"; /* קוד האייקון של expand_more */
    font-family: 'Material Symbols Outlined';
    font-size: 24px;
    transition: transform 0.3s ease;
}

/* היפוך החץ כאשר השאלה פתוחה */
.article-content details[open] summary::after {
    transform: rotate(180deg);
}

.article-content details[open] summary { 
    border-bottom: 1px solid #e0e3e5; 
}

/* התוכן בתוך התשובה */
.article-content details .wp-block-details__content,
.article-content details > p { 
    padding: 1.5rem; 
    color: #45464d; 
    font-size: 16px; 
    margin: 0; 
}

/* תאימות לגוטנברג במקרה של פסקה ישירה בתוך אקורדיון */
.article-content details .wp-block-details__content p:last-child {
    margin-bottom: 0;
}
/* ==========================================================================
   תיקון כותרות בעמודי פוסטים (דריסת האיפוס של Tailwind)
   ========================================================================== */
.article-content h1, 
.article-content h2, 
.article-content h3, 
.article-content h4, 
.article-content h5, 
.article-content h6 {
    font-family: 'Rubik', sans-serif !important;
    color: #0F172A !important;
    font-weight: 600 !important;
    line-height: 1.3 !important;
    display: block !important;
}

.article-content h2 { 
    font-size: 32px !important; 
    margin-top: 48px !important; 
    margin-bottom: 16px !important; 
}

.article-content h3 { 
    font-size: 24px !important; 
    margin-top: 32px !important; 
    margin-bottom: 16px !important; 
}

.article-content h4 { 
    font-size: 20px !important; 
    margin-top: 24px !important; 
    margin-bottom: 12px !important; 
}

/* ==========================================================================
   תיקון עיצוב לטופס יצירת קשר בסיידבר הכהה (מתאים ל-Contact Form 7 / WPForms)
   ========================================================================== */
/* עיצוב שדות הטקסט והאימייל של התוסף */
aside .bg-primary form input[type="text"],
aside .bg-primary form input[type="email"],
aside .bg-primary form input[type="tel"],
aside .bg-primary form textarea {
    width: 100% !important;
    background-color: rgba(255, 255, 255, 0.1) !important;
    border: 1px solid transparent !important;
    border-radius: 0.5rem !important;
    color: #ffffff !important;
    padding: 0.75rem 1rem !important;
    margin-bottom: 1rem !important;
    font-family: 'Rubik', sans-serif !important;
    box-sizing: border-box !important;
}

/* צבע פלייסחולדר (Placeholder) לשדות */
aside .bg-primary form input::placeholder,
aside .bg-primary form textarea::placeholder {
    color: #94a3b8 !important; /* צבע אפור עדין שמתאים לרקע כהה */
}

/* מסגרת כחולה כשלוחצים על שדה */
aside .bg-primary form input:focus,
aside .bg-primary form textarea:focus {
    outline: none !important;
    box-shadow: 0 0 0 2px #36b5fd !important;
}

/* עיצוב כפתור השליחה של התוסף */
aside .bg-primary form input[type="submit"],
aside .bg-primary form button {
    width: 100% !important;
    background-color: #36b5fd !important; /* צבע התכלת מהעיצוב המקורי */
    color: #004465 !important;
    padding: 0.75rem !important;
    border-radius: 0.5rem !important;
    font-weight: 600 !important;
    cursor: pointer !important;
    border: none !important;
    transition: opacity 0.2s !important;
    margin-top: 0.5rem !important;
    font-family: 'Rubik', sans-serif !important;
}

aside .bg-primary form input[type="submit"]:hover,
aside .bg-primary form button:hover {
    opacity: 0.9 !important;
}

/* עיצוב התוויות (Labels) של התוסף, אם קיימות */
aside .bg-primary form label {
    display: block !important;
    font-size: 0.75rem !important;
    color: #7c839b !important;
    margin-bottom: 0.25rem !important;
    font-weight: 600 !important;
}

/* הסתרת הודעות שגיאה שמקלקלות את העיצוב, עד שהן מופיעות ממש */
aside .bg-primary form .wpcf7-not-valid-tip {
    font-size: 12px !important;
    color: #ffb86b !important;
    margin-top: -10px !important;
    margin-bottom: 10px !important;
}
/* ==========================================================================
   תיקון יישור לימין (RTL) ותצוגת מאמרים בעמודי פוסט
   ========================================================================== */
.article-content {
    text-align: right;
    direction: rtl;
}

.article-content p {
    text-align: right;
    margin-bottom: 24px;
}

/* וידוא תצוגת כותרות שוב ליתר ביטחון */
.article-content h2, 
.article-content h3, 
.article-content h4 {
    display: block !important;
    text-align: right !important;
}

/* ==========================================================================
   תיקון הפריסות השבורות בעמוד הבית (front-page.php)
   ========================================================================== */

/* תיקון אזור "הלקוחות שלנו אומרים" (Testimonials) */
section.bg-primary-container {
    background-color: #131b2e !important; /* צבע כהה לרקע */
    color: #fefcff !important;
}

section.bg-primary-container .grid.md\:grid-cols-2 {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 48px !important;
}

/* התאמה למובייל לאזור ההמלצות */
@media (max-width: 768px) {
    section.bg-primary-container .grid.md\:grid-cols-2 {
        grid-template-columns: 1fr !important;
    }
}

/* צבע רקע לכלי המספרים בעמוד הבית */
.bg-white\/5 {
    background-color: rgba(255, 255, 255, 0.05) !important;
}

/* ==========================================================================
   תיקון הטופס בתחתית עמוד הבית (בואו נגן על השם שלכם)
   ========================================================================== */
.glass-card form.grid {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 24px !important;
}

@media (max-width: 768px) {
    .glass-card form.grid {
        grid-template-columns: 1fr !important;
    }
}

/* סידור פנים הטופס כך שלא יהיה מבולגן */
.glass-card form input[type="text"],
.glass-card form input[type="email"],
.glass-card form input[type="tel"],
.glass-card form textarea {
    width: 100% !important;
    padding: 12px 16px !important;
    background-color: #f8f9ff !important;
    border: 1px solid #c6c6cd !important;
    border-radius: 8px !important;
    margin-bottom: 16px !important;
}

.glass-card form label {
    display: block !important;
    text-align: right !important;
    margin-bottom: 8px !important;
}

/* כפתור השליחה של הטופס בעמוד הבית */
.glass-card form button,
.glass-card form input[type="submit"] {
    width: 100% !important;
    background-color: #0058be !important;
    color: #ffffff !important;
    padding: 16px !important;
    border-radius: 8px !important;
    border: none !important;
    cursor: pointer !important;
}