/* ===============================
   HEADER BACKGROUND RESET (NO BLUE)
   =============================== */
header.header,
.container-header,
.container-header .navbar,
.container-header .navbar .container-fluid{
  background: #ffffff !important;
  background-image: none !important;
}

header.header::before,
header.header::after{
  display: none !important;
}





/* === MISGAROT: HERO (Modern) === */
.mis-hero{
  padding: 34px 0 18px;
}

.mis-hero__inner{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 26px;
  align-items:center;
}

.mis-hero__text h1{
  font-size: clamp(28px, 3vw, 46px);
  line-height: 1.15;
  margin: 0 0 10px;
}

.mis-hero__text p{
  margin: 0 0 18px;
  color: rgba(0,0,0,.70);
  font-size: 16px;
}

.mis-hero__actions{
  display:flex;
  gap: 12px;
  flex-wrap: wrap;
}

.mis-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding: 12px 18px;
  border-radius: 12px;
  text-decoration:none !important;
  font-weight: 700;
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
}

.mis-btn--primary{
  background:#121212;
  color:#fff !important;
}

.mis-btn--secondary{
  background:#f4f1ea;
  color:#121212 !important;
  border:1px solid #ddd6c9;
}

.mis-btn:hover{
  transform: translateY(-2px);
  box-shadow: 0 14px 28px rgba(0,0,0,.10);
}

.mis-hero__media{
  display:flex;
  justify-content:center;
  align-items:center;
  padding: 18px;
}

.mis-hero__frame{
  width: min(460px, 100%);
  aspect-ratio: 4/3;
  border-radius: 18px;
  background: linear-gradient(180deg, #f6f2ea, #efe7db);
  border: 10px solid #c9b08a;
  box-shadow: 0 18px 40px rgba(0,0,0,.12);
  position: relative;
}

.mis-hero__frame:before{
  content:"";
  position:absolute;
  inset: 14px;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: inset 0 0 0 2px rgba(0,0,0,.05);
}

/* Responsive */
@media (max-width: 992px){
  .mis-hero__inner{ grid-template-columns: 1fr; }
}






/* === Force top-a modules to stack vertically (HERO then GRID) === */
.container-top-a,
.top-a,
#top-a {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px;
}




/* ===============================
   MISGAROT: HOME 9 TILES (CLEAN)
   =============================== */

.mis-grid{
  background: linear-gradient(180deg,#f2ede4 0%,#e8e0d2 100%);
  padding: 56px 0 64px;
  border-radius: 28px;
  margin: 48px 0;
}

.mis-cards{
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  max-width: 980px;
  margin: 18px auto 0;
  padding: 0 18px;
}

.mis-card{
  background: #fff;
  border: 1px solid rgba(0,0,0,.10);
  border-radius: 18px;
  overflow: hidden;
  text-decoration: none !important;
  color: #121212 !important;
  display: flex;
  flex-direction: column;
  box-shadow: 0 10px 22px rgba(0,0,0,.06);
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}

.mis-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 16px 30px rgba(0,0,0,.10);
  border-color: rgba(201,176,138,.8);
}

/* Placeholder של "תמונה" עד שמעלים תמונות */
.mis-card__ph{
  display: block;
  height: 160px;                 /* גובה ה"תמונה" */
  background:
    linear-gradient(135deg, rgba(201,176,138,.35), rgba(246,242,234,.9)),
    repeating-linear-gradient(45deg, rgba(0,0,0,.04) 0 12px, rgba(255,255,255,.0) 12px 24px);
}

/* כותרת */
.mis-card__title{
  display: block;
  padding: 14px 12px 16px;
  text-align: center;
  font-weight: 800;
  font-size: 1.05rem;
  line-height: 1.25;
}

/* רספונסיביות */
@media (max-width: 992px){
  .mis-cards{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .mis-cards{ grid-template-columns: 1fr; }
}




/* ===== MISGAROT RTL Base (global) ===== */
html, body { direction: rtl; }
body { text-align: right; }

/* תוכן כללי */
.site, .container-component, .com-content, main { text-align: right; }

/* פוטר */
footer, .footer, .container-footer { direction: rtl; text-align: right; }



/* ===== Header menu align right (RTL) ===== */
.container-header,
.container-header .navbar { direction: rtl; }

.container-header .navbar-nav {
  justify-content: flex-start !important; /* ב-RTL זה הצד הימני בפועל */
  margin-right: 0 !important;
  margin-left: auto !important;
}

.container-header .navbar-brand {
  margin-left: 18px !important;
  margin-right: 0 !important;
}

/* Center only this section title */
.misgarot-section-title { text-align: center !important; }



/* ===== MENU SPACING (DESKTOP ONLY) ===== */
@media (min-width: 992px){
  .container-header ul.mod-menu,
  .container-header ul.navbar-nav,
  .container-header .navbar-nav {
    display: flex !important;
    flex-direction: row !important;
    gap: 18px !important;
    align-items: center !important;
  }

  .container-header ul.mod-menu > li,
  .container-header ul.navbar-nav > li,
  .container-header .navbar-nav > li {
    float: none !important;
    margin: 0 !important;
    margin-inline-start: 18px !important;
  }
}





/* ===============================
   MISGAROT – FOOTER (FINAL)
   Full width background + centered content
   =============================== */

/* רקע מלא לפוטר עצמו (האלמנט של ג'ומלה) */
footer.footer,
.container-footer{
  background: #2f2f2f !important;   /* אפור כהה */
  color: #ffffff !important;
  background-image: none !important;
}

/* הרקע ייצמד לקצוות */
.container-footer{
  padding: 0 !important;
}
footer.footer{
  padding: 0 !important;
}

/* שכבת התוכן הפנימית של ג'ומלה – שלא תעשה "קופסה בצד" */
.container-footer .grid-child{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

/* העטיפה שלנו - נותנים לה את הpadding והמרכוז */
.mis-footer{
  width: 100%;
  padding: 28px 0;
}

/* התוכן הממורכז */
.mis-footer__inner{
  max-width: 1100px;
  margin: 0 auto;
  padding: 0 18px;
  direction: rtl;
  text-align: right;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

/* שורות */
.mis-footer__item{
  font-size: 15px;
  line-height: 1.7;
  color: #ffffff !important;
}

.mis-footer__label{
  font-weight: 700;
  margin-left: 6px;
  color: #ffffff !important;
}

.mis-footer__value,
.mis-footer a{
  color: #ffffff !important;
  text-decoration: none;
}

.mis-footer a:hover{
  text-decoration: underline;
  opacity: .9;
}

/* Mobile */
@media (max-width: 600px){
  .mis-footer{
    padding: 22px 0;
  }
  .mis-footer__item{
    font-size: 14px;
  }
}





/* === HARD OVERRIDE: Force footer text + links to white === */
footer.footer,
footer.footer * ,
.container-footer,
.container-footer *{
  color: #ffffff !important;
}

footer.footer a,
footer.footer a:link,
footer.footer a:visited,
footer.footer a:hover,
footer.footer a:active,
.container-footer a,
.container-footer a:link,
.container-footer a:visited,
.container-footer a:hover,
.container-footer a:active{
  color: #ffffff !important;
  text-decoration: none !important;
}

footer.footer a:hover,
.container-footer a:hover{
  text-decoration: underline !important;
  opacity: .9;
}



/* ===============================
   MISGAROT – HERO BACKGROUND (CREAM) + FRAME + SOFT SHADOW
   =============================== */

.mis-hero{
  background: #f6f2ea;                 /* קרם עדין */
  border: 1px solid #e6dccb;           /* מסגרת קרם כהה עדינה */
  border-radius: 22px;                 /* פינות רכות */
  box-shadow: 0 14px 30px rgba(0,0,0,0.05); /* צל רך מאוד */
  padding: 40px 0 34px;                /* יותר אוויר */
}

/* כדי שהתוכן לא יידבק לשוליים */
.mis-hero__inner{
  padding: 0 28px;
}

/* מובייל – קצת פחות ריווח */
@media (max-width: 768px){
  .mis-hero{
    padding: 28px 0 24px;
    border-radius: 18px;
  }
  .mis-hero__inner{
    padding: 0 18px;
  }
}



/* ===============================
   MISGAROT – CATEGORIES GRID
   Warm Stone Gradient Background
   =============================== */

.mis-grid{
  background: linear-gradient(
    180deg,
    #f2ede4 0%,
    #e8e0d2 100%
  );
  padding: 56px 0 64px;
  border-radius: 28px;
  margin: 48px 0;
}

/* מובייל */
@media (max-width: 768px){
  .mis-grid{
    padding: 36px 0 42px;
    border-radius: 22px;
  }
}





/* ===============================
   MISGAROT – MAIN MENU COLOR FIX
   =============================== */

/* צבע טקסט תפריט – כל העמודים */
.container-header .navbar-nav > li > a,
.container-header .mod-menu > li > a {
  color: #222 !important; /* כהה וברור */
}

/* hover */
.container-header .navbar-nav > li > a:hover,
.container-header .mod-menu > li > a:hover {
  color: #000 !important;
}

/* פריט פעיל */
.container-header .navbar-nav > li.active > a,
.container-header .mod-menu > li.active > a {
  color: #000 !important;
  font-weight: 600;
}




/* ===============================
   MISGAROT – MENU STYLE UPGRADE
   Home color + Active underline + subtle hover
   Paste AFTER the previous menu fix block
   =============================== */

/* בסיס: מוסיף קו תחתון אנימטיבי לכל האתר */
.container-header .navbar-nav > li > a,
.container-header .mod-menu > li > a{
  position: relative !important;
  text-decoration: none !important;
  transition: color .18s ease, opacity .18s ease !important;
}

/* הקו עצמו (מוסתר כברירת מחדל) */
.container-header .navbar-nav > li > a::after,
.container-header .mod-menu > li > a::after{
  content: "" !important;
  position: absolute !important;
  left: 0 !important;
  right: 0 !important;
  bottom: -8px !important;
  height: 2px !important;
  border-radius: 2px !important;
  background: currentColor !important;
  transform: scaleX(0) !important;
  transform-origin: center !important;
  opacity: .75 !important;
  transition: transform .18s ease, opacity .18s ease !important;
}

/* HOVER עדין: הקו נפתח */
.container-header .navbar-nav > li > a:hover::after,
.container-header .mod-menu > li > a:hover::after{
  transform: scaleX(1) !important;
  opacity: .9 !important;
}

/* ACTIVE: קו תמיד פתוח */
.container-header .navbar-nav > li.active > a::after,
.container-header .mod-menu > li.active > a::after{
  transform: scaleX(1) !important;
  opacity: 1 !important;
}

/* ACTIVE: קצת יותר מודגש */
.container-header .navbar-nav > li.active > a,
.container-header .mod-menu > li.active > a{
  font-weight: 700 !important;
}

/* ===== HOME ONLY (Itemid-101) צבע שונה + underline בצבע מותאם ===== */
/* אם אצלך דף הבית הוא itemid אחר, תגיד לי ואני אתאים */
body.itemid-101 .container-header .navbar-nav > li > a,
body.itemid-101 .container-header .mod-menu > li > a{
  color: #111 !important;          /* בסיס כהה יותר לדף הבית */
  opacity: .92 !important;
}

/* Hover בדף הבית: עוד טיפונת כהה */
body.itemid-101 .container-header .navbar-nav > li > a:hover,
body.itemid-101 .container-header .mod-menu > li > a:hover{
  opacity: 1 !important;
  color: #000 !important;
}

/* ACTIVE בדף הבית: underline "מותגי" (זהב-חם עדין) */
body.itemid-101 .container-header .navbar-nav > li.active > a,
body.itemid-101 .container-header .mod-menu > li.active > a{
  color: #000 !important;
}

body.itemid-101 .container-header .navbar-nav > li > a::after,
body.itemid-101 .container-header .mod-menu > li > a::after{
  background: #c9b08a !important;  /* צבע הקו בדף הבית */
}







/* ===============================
   MISGAROT / Joomla 5
   FORCE + ULTRA-ROBUST HAMBURGER (ONE BLOCK)
   Paste at VERY END
   =============================== */

/* הכפתור עצמו: קיים, נראה, בגודל נכון */
.container-header .navbar-toggler{
  position: relative !important;
  width: 48px !important;
  height: 48px !important;
  padding: 0 !important;

  border: 1px solid rgba(0,0,0,.25) !important;
  border-radius: 10px !important;

  background-color: #fff !important;
  opacity: 1 !important;
  visibility: visible !important;

  /* מצייר 3 פסים יציבים על הכפתור */
  background-image:
    linear-gradient(#111,#111),
    linear-gradient(#111,#111),
    linear-gradient(#111,#111) !important;

  background-repeat: no-repeat !important;
  background-size:
    22px 2.6px,
    22px 2.6px,
    22px 2.6px !important;

  background-position:
    center 15px,
    center 23px,
    center 31px !important;

  z-index: 9999 !important;
}

/* מבטל כל אייקון מובנה / span שמסתיר */
.container-header .navbar-toggler-icon,
.container-header .navbar-toggler span{
  display: none !important;
  background: none !important;
  background-image: none !important;
  opacity: 0 !important;
}

/* מוודא שאין פסאודו-אלמנטים של התבנית שמפריעים */
.container-header .navbar-toggler::before,
.container-header .navbar-toggler::after{
  content: none !important;
  display: none !important;
}






/* ===============================
   MISGAROT – LOGO MOBILE: STRETCH HEIGHT (INTENTIONAL DISTORT)
   Paste at VERY END
   =============================== */
@media (max-width: 768px){

  /* התמונה עצמה – מתיחה מכוונת */
  .container-header .navbar-brand img{
    width: 100% !important;      /* שומר על רוחב מלא של האזור */
    height: 120px !important;    /* כאן המתיחה לגובה: נסה 120 / 140 / 160 */
    max-width: none !important;
    max-height: none !important;
    object-fit: fill !important; /* גורם לעיוות/מתיחה */
  }

  /* לוודא שהקונטיינר של הלוגו לא מגביל רוחב */
  .container-header .navbar-brand{
    width: 100% !important;
    display: block !important;
  }
}



/* ===============================
   MISGAROT – IMAGE CARDS POLISH
   =============================== */

/* מבנה הקובייה */
.mis-card{
  padding: 14px !important;      /* מרווח פנימי = פספרטו */
  background: #f7f4ee !important;
}

/* התמונה עצמה */
.mis-card__img{
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 14px;
  background: #fff;
  box-shadow:
    inset 0 0 0 6px #ffffff,     /* פספרטו פנימי */
    0 10px 22px rgba(0,0,0,.12); /* עומק */
  transition: transform .35s ease, box-shadow .35s ease;
}

/* כותרת הקובייה */
.mis-card__title{
  display: block;
  margin-top: 14px;
  font-size: 1.05rem;
  font-weight: 700;
  color: #1c1c1c;
}

/* hover – עדין ואלגנטי */
.mis-card:hover .mis-card__img{
  transform: scale(1.03);
  box-shadow:
    inset 0 0 0 6px #ffffff,
    0 18px 34px rgba(0,0,0,.18);
}

/* ביטול קו תחתון */
.mis-card,
.mis-card:hover{
  text-decoration: none !important;
}






/* ===============================
   MISGAROT – HERO SIDE BY SIDE
   Image LEFT | Text RIGHT (RTL)
   =============================== */

.mis-hero__inner{
  display: grid;
  grid-template-columns: 1fr 1fr;
  align-items: center;          /* זה ממרכז אנכית */
  gap: 32px;
  padding: 0 28px;
}

/* טקסט – ימין */
.mis-hero__text{
  text-align: right;
}

/* כותרת */
.mis-hero__text h1{
  font-size: clamp(30px, 3.2vw, 48px);
  line-height: 1.15;
  margin-bottom: 12px;
}

/* שורת היתרונות */
.mis-hero-subtitle{
  font-size: 20px;
  font-weight: 700;
  color: rgba(0,0,0,.75);
  margin: 0;
}

/* מדיה – שמאל */
.mis-hero__media{
  display: flex;
  justify-content: center;
}

/* מובייל */
@media (max-width: 992px){
  .mis-hero__inner{
    grid-template-columns: 1fr;
    text-align: center;
  }

  .mis-hero__text{
    text-align: center;
  }
}





/* Image inside the hero frame */
.mis-hero__frame{
  position: relative;
  overflow: hidden;
}

.mis-hero__img{
  position: absolute;
  inset: 14px;           /* אותו מרווח שהיה לך ב-frame:before */
  width: calc(100% - 28px);
  height: calc(100% - 28px);
  object-fit: cover;
  border-radius: 12px;
  display: block;
}





/* ================================
   ARTICLES PAGE – STRONGER (≈25%)
   Works only when you use the classes below in the Articles page HTML
   ================================ */

/* כותרת עליונה "מאמרים ומדריכים" */
.mis-articles-hero{
  background: linear-gradient(135deg, #f3d6ff, #d9e4ff);
  border: 1px solid rgba(0,0,0,.08);
  border-radius: 18px;
  box-shadow: 0 12px 26px rgba(0,0,0,.08);
  padding: 22px 18px;
  text-align: center;
}

.mis-articles-hero h1{
  margin: 0 0 8px;
  font-size: clamp(26px, 3vw, 40px);
}

.mis-articles-hero p{
  margin: 0;
  opacity: .92;
}

/* רשת הקוביות */
.mis-articles-grid{
  max-width: 980px;
  margin: 18px auto 0;
  padding: 0 14px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px;
}

@media (max-width: 720px){
  .mis-articles-grid{ grid-template-columns: 1fr; }
}

/* ================================
   ARTICLE CARDS – STRONGER COLOR
   ================================ */

.mis-article-card{
  position: relative;
  background: linear-gradient(135deg, #ffffff, #eef3ff);
  border: 1px solid rgba(0,0,0,.09);
  border-radius: 16px;
  box-shadow: 0 12px 24px rgba(0,0,0,.08);
  padding: 14px 14px 12px;
  transition: transform .18s ease, box-shadow .18s ease;
}

.mis-article-card:hover{
  transform: translateY(-3px);
  box-shadow: 0 18px 34px rgba(0,0,0,.11);
}

/* פס צבע עליון (חזק יותר) */
.mis-article-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:6px;
  border-radius: 16px 16px 0 0;
  background: linear-gradient(90deg, #b9c6ff, #ffcdb2);
}

/* כותרת */
.mis-article-card__title{
  margin: 0 0 6px;
  font-size: 18px;
  line-height: 1.25;
}

.mis-article-card__title a{
  color:#1a1a1a;
  text-decoration: none;
}

.mis-article-card__title a:hover{
  text-decoration: underline;
}

/* תקציר קצר - 3 שורות */
.mis-article-card__excerpt{
  margin: 0;
  color: #222;
  opacity: .92;

  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* שורה תחתונה + כפתור */
.mis-article-card__footer{
  margin-top: 10px;
  display: flex;
  align-items: center;
  justify-content: flex-start; /* RTL: יוצא ימין */
}

.mis-article-card__more{
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 7px 12px;
  border-radius: 10px;

  background: #ffffff;
  border: 1px solid rgba(0,0,0,.14);
  color: #222;
  text-decoration: none;
  box-shadow: 0 6px 12px rgba(0,0,0,.06);
}

.mis-article-card__more:hover{
  background: #eef3ff;
}