/* skin.css — גיליון הסגנון של תבנית הבת, במלואו.

   **הקובץ הזה נפרס כמו שהוא אל style.css בשרת, ודורס אותו.**
   לכן הוא חייב להיות שלם. גרסה קודמת שלו הכילה רק את הזנב
   (הצבעים והמותג), והראש — הצהרות @font-face, גוש :root
   והקצאת הגופנים — ישב רק בשרת ומעולם לא נכנס לניהול גרסאות.
   פריסה מחקה אותו, והעברית נפלה לגופן ברירת המחדל של הדפדפן.

   אין כאן קובץ חלקי. אם צריך להוסיף כלל, מוסיפים אותו כאן. */

/*
Theme Name: Magazilla Child
Theme URI: http://cmsmasters.net/magazilla-child/
Author: cmsmasters
Author URI: http://cmsmasters.net/
Description: Magazilla Child Theme
Template: magazilla
Version: 1.0.0
License:
License URI:
Text Domain: magazilla-child
Tags: one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-background, custom-colors, custom-header, custom-menu, editor-style, featured-image-header, featured-images, flexible-header, full-width-template, microformats, post-formats, rtl-language-support, sticky-post, theme-options, threaded-comments, translation-ready
*/@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(fonts/rubik-hebrew.woff2) format('woff2');
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(fonts/rubik-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: 'Rubik';
  font-style: normal;
  font-weight: 300 900;
  font-display: swap;
  src: url(fonts/rubik-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* ═══════════════════════════════════════════════════════════════
   טיפוגרפיה — רייסינג
   ═══════════════════════════════════════════════════════════════
   שני פונטים, שני תפקידים:

   אלמוני צר  — זהות האתר: שם האתר, הניווט, כותרות המדורים.
   רוביק       — התוכן: כותרות כתבות (שחור 900) וגוף הטקסט.

   אלמוני הוא פונט מסחרי ואינו כלול כאן. מחרוזת הפונט מזכירה אותו
   ראשון, ולכן ברגע שקובצי הפונט יותקנו הוא ייכנס לתוקף לבד — בלי
   לגעת בקובץ הזה. עד אז רוביק תופס את מקומו.

   רוביק מוגש מהשרת שלנו ולא מגוגל: בקשה לשרת חיצוני מוסיפה פתיחת
   חיבור נוספת לכל טעינת עמוד, וזמן טעינה באתר שנושא פרסומות הוא
   הכנסה. שלוש קבוצות התווים יחד שוקלות 64KB לכל טווח המשקלים.
   ═══════════════════════════════════════════════════════════════ */

:root {
	--racing-font-brand: "Almoni Tzar ML v5 AAA", "Almoni Tzar", "Rubik", sans-serif;
	--racing-font-text: "Rubik", "Segoe UI", Arial, sans-serif;
	--racing-red: #EA2B1B;
	/* אפור השורה של הבעלים. אדום הוא צבע הממשק שהגולש רואה, ולכן
	   הוא הצבע הלא נכון למה שרק הבעלים רואה. כהה מזה כבר אינו
	   קריא על רקע #0d1014. */
	--rc-owner-grey: #6b7280;
}

body,
.entry-content,
p, li, td, th,
input, textarea, select, button {
	font-family: var(--racing-font-text);
}

/* כותרות: רוביק במשקל שחור. */
h1, h2, h3, h4, h5, h6,
.entry-title, .post-title, .widget-title {
	font-family: var(--racing-font-text);
	font-weight: 900;
}

/* זהות האתר: אלמוני צר. */
.site-title, .site-title a,
.cmsmasters_logo, .logo_text,
#navigation, #navigation a,
.navigation, .navigation a {
	font-family: var(--racing-font-brand);
}

/* מספרים בטבלאות: ספרות ברוחב אחיד, אחרת עמודת הנקודות "רוקדת"
   בין שורה לשורה וקשה להשוות בעין. */
.rc-tbl td, .rc-tbl th, .rc-sc-i b, .rc-yr {
	font-variant-numeric: tabular-nums;
	font-feature-settings: "tnum" 1;
}

/* ═══════════════════════════════════════════════════════════════
   אלמוני צר — פונט הזהות של האתר
   ═══════════════════════════════════════════════════════════════
   פונט מסחרי ברישיון של בעל האתר, מומר מ-OTF ל-WOFF2 ומוגש מהשרת.

   שם המשפחה כאן חייב להיות זהה בדיוק לשם הפנימי שבקובץ הפונט —
   "Almoni Tzar ML v5 AAA" — כי זהו גם השם שבו הוא מוגדר בכרובלוג,
   ואחידות בין שני האתרים היא כל הנקודה.

   שני משקלים בלבד, 500 ו-700. הדפדפן יסנתז ביניהם במידת הצורך;
   טעינת משקלים שאינם בשימוש היא עלות בלי תמורה.
   ═══════════════════════════════════════════════════════════════ */

@font-face {
	font-family: "Almoni Tzar ML v5 AAA";
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url(fonts/almoni-tzar-medium.woff2) format("woff2");
}

@font-face {
	font-family: "Almoni Tzar ML v5 AAA";
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url(fonts/almoni-tzar-bold.woff2) format("woff2");
}

/* ===RACING-SKIN=== */


/* ═══════════════════════════════════════════════════════════════
   צבעי רייסינג
   ═══════════════════════════════════════════════════════════════
   שלושה צבעים, שלושה תפקידים, ואין רביעי:

   אדום  #EA2B1B  — המותג. קישורים, כפתורים, הדגשות ממשק.
   צהוב  #ffd400  — נתון עולמי. אך ורק בטבלאות ובמקטעי הנתונים.
   כחול  #4da3ff  — נתון ישראלי. אותו כלל.

   הפרדת התפקידים היא מה שמאפשר לגולש לדעת במבט אחד אם הטבלה שמולו
   היא מאליפות עולם או מאליפות ישראל, בלי לקרוא את הכותרת. ברגע
   שהאדום ייכנס גם לטבלאות, הסימן הזה מת — ולכן המותג לא נוגע בהן.
   הצבעים עצמם מוגדרים ב-config.py, וזהו המקום היחיד שמתרגם אותם
   ל-CSS.

   התבנית מגיעה עם #e12b2b, שהוא כמעט-אבל-לא האדום שלנו. ההפרש
   בלתי מורגש בעין אך מורגש בהחלט כשמניחים את הלוגו על רקע צבוע.
   ═══════════════════════════════════════════════════════════════ */

a,
.entry-title a:hover,
.post-title a:hover,
.widget-title span,
.cmsmasters_breadcrumbs a:hover {
	color: var(--racing-red);
}

a:hover {
	color: #b81f11;
}

button,
input[type="submit"],
.button,
.cmsmasters_button,
.more-link {
	background-color: var(--racing-red);
	border-color: var(--racing-red);
	color: #fff;
}

button:hover,
input[type="submit"]:hover,
.button:hover,
.cmsmasters_button:hover,
.more-link:hover {
	background-color: #b81f11;
	border-color: #b81f11;
}

/* פס הדגשה תחת הפריט הפעיל בניווט. */
#navigation > li.current-menu-item > a,
#navigation > li.current-menu-ancestor > a,
.navigation > li.current-menu-item > a {
	box-shadow: inset 0 -3px 0 var(--racing-red);
}

::selection {
	background: var(--racing-red);
	color: #fff;
}

/* מקטעי הנתונים שומרים על הצבע הגיאוגרפי שלהם. הכלל הזה קיים כדי
   שכלל מותג רחב שייכתב כאן בעתיד לא יבלע אותם בטעות. */
.rc a {
	color: inherit;
}

/* ---------------------------------------------- ניווט ומוטו */
/* גודל הגופן של הניווט אינו כאן. הוא הוגדר באפשרויות התבנית,
   שמהן נוצר גיליון הסגנון — ודריסה כאן הייתה בעלות שנייה על
   אותה הגדרה, בדיוק המצב ששני סקריפטים סתרו בו זה את זה קודם. */

/* המוטו צמוד ללוגו, ולא שורה נפרדת מתחתיו. */
.logo_subtitle,
.cmsmasters_logo_subtitle {
	font-family: var(--racing-font-brand);
	font-size: 15px;
	font-weight: 700;
	letter-spacing: 2.5px;
	color: var(--racing-red);
}

/* ------------------------------------ כותרת העמוד בדף הבית */
/* "דף הבית" ככותרת ראשית מעל רצועות החדשות אינו מידע: הגולש יודע
   היכן הוא, והשורה דוחקת את הידיעה הראשונה מתחת לקפל. בשאר
   העמודים הכותרת נשארת — שם היא כן אומרת משהו. */
.home .headline_outer {
	display: none;
}

/* ------------------------------------------------ המוטו ליד הלוגו */
/* שתי סיבות שבגללן זה לא הופיע קודם, ושתיהן שקטות:

   1. התבנית מציירת תת-כותרת רק כשסוג הלוגו הוא "טקסט". הלוגו כאן
      תמונה, ולכן magazilla_logo_subtitle נשמר במסד ואינו מגיע
      לעמוד — נראה תקין בממשק הניהול, לא קיים בחוץ.

   2. הניסיון הראשון השתמש ב-.logo_wrap::after, אבל לתבנית יש
      .header_mid .logo_wrap:after {content:''} — מוט מרכוז אנכי
      בספציפיות גבוהה יותר, שדרס את הטקסט בשקט. ::before פנוי.

   המיקום: הלוגו צמוד לימין ותופס את מלוא גובה ההדר, ולכן המוטו
   אינו יכול לשבת מתחתיו. right:100% מוציא אותו אל מחוץ לקופסת
   הלוגו, לצדה השמאלי, במרכז הגובה — כלומר צמוד ללוגו.

   התווים כבריחות יוניקוד כדי שלא יהיה תלוי בפירוש הקידוד. */
.header_mid .logo_wrap::before {
	content: "\05E2 \05D1 \05E8 . \05D4 \05D5 \05D5 \05D4 . \05E2 \05E7 \05E3 .";
	position: absolute;
	top: 50%;
	right: 100%;
	left: auto;
	transform: translateY(-50%);
	margin-right: 22px;
	white-space: nowrap;
	direction: rtl;
	font-family: var(--racing-font-brand);
	/* 20px ולא 17px: הגדלה של 15% לבקשת הבעלים. */
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 3px;
	/* לבן ולא אדום: המוטו יושב על רקע כהה צמוד ללוגו הלבן, והאדום
	   שם הופך אותו לאלמנט נפרד במקום להמשך של הלוגו. */
	color: #ffffff;
}

/* בנייד המוטו יורד מתחת ללוגו במקום להיעלם.

   **לא בתוך קופסת הלוגו.** הניסיון הראשון הושיב אותו על
   .logo_wrap עם bottom, אבל לקופסה הזו גובה קבוע מהתבנית והריפוד
   אינו מגדיל אותה — התוצאה הייתה טקסט לבן על אותיות הלוגו הלבנות.

   .header_mid::after הוא אלמנט בלוק שיושב אחרי שורת ההדר כולה,
   ולכן הוא שורה משל עצמו מתחת ללוגו ולא שכבה מעליו. */
@media (max-width: 1024px) {
	.header_mid .logo_wrap::before {
		display: none;
	}

	.header_mid::after {
		content: "\05E2 \05D1 \05E8 . \05D4 \05D5 \05D5 \05D4 . \05E2 \05E7 \05E3 .";
		display: block;
		padding: 0 0 10px;
		text-align: center;
		direction: rtl;
		font-family: var(--racing-font-brand);
		/* 23px: גדול ב-15% מ-20 של המסך הרחב. בנייד המוטו הוא שורה
		   משל עצמו ולא נספח ללוגו, ולכן הוא סובל יותר משקל. */
		font-size: 23px;
		font-weight: 700;
		letter-spacing: 2px;
		color: #ffffff;
	}
}

.bot_nav .rc-nav-search {
	display: flex;
	align-items: center;
}

.bot_nav .rc-nav-search form {
	position: relative;
	margin: 0;
}

.bot_nav .rc-nav-search input[type="search"] {
	background-color: #2b3038;
	border: 1px solid #3d4552;
	border-radius: 6px;
	color: #e8edf3;
	font-size: 14px;
	height: 34px;
	width: 200px;
	padding: 0 12px 0 34px;
	box-sizing: border-box;
	-webkit-appearance: none;
	appearance: none;
}

.bot_nav .rc-nav-search input[type="search"]::placeholder {
	color: #949eac;
	opacity: 1;
}

.bot_nav .rc-nav-search input[type="search"]:focus {
	background-color: #343a44;
	border-color: var(--racing-red);
	outline: none;
}

/* כפתור השליחה הוא המגדלת, והוא יושב בתוך השדה בקצה השמאלי. */
.bot_nav .rc-nav-search button {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 32px;
	background: none;
	border: 0;
	padding: 0;
	cursor: pointer;
	color: #949eac;
	font-family: "fontello";
}

.bot_nav .rc-nav-search button::before {
	content: "\e8a4";
	font-size: 14px;
}

.bot_nav .rc-nav-search button:hover {
	color: var(--racing-red);
}

@media (max-width: 1024px) {
	.bot_nav .rc-nav-search {
		display: none;
	}

	.header_bot .bot_search_but_wrap {
		display: block;
	}
}

/* ------------------------------------------- שורת הנתונים של ידיעה */
/* מקטע המחבר יורד: הוא מייצר קישור ריק.
   באתר אין קרדיט מחבר על ידיעה, ולכן get_the_author_meta מחזיר
   מחרוזת ריקה והתבנית מדפיסה <span> עם <a> בלי טקסט. המפריד של
   התבנית יושב על :before של כל span שאינו האחרון, ולכן מקטע ריק
   לא נשאר שקוף — הוא משאיר נקודת הפרדה תלויה באוויר.

   המילה "by" עצמה מוסרת ב-functions.php, בכל מקום שבו התבנית
   מציגה אותה. כאן מוסר מה שנשאר.

   אם יתווסף קרדיט מחבר לידיעות, הכלל הזה הוא מה שצריך להסיר. */
.cmsmasters_archive_item_info .cmsmasters_archive_item_user_name {
	display: none;
}

/* ------------------------------------------ שורת העבודה של הבעלים */
/* נראית רק למי שרשאי לערוך את הפריט (ראו racing_editor_bar
   ב-functions.php). מכוונת לא להיראות כמו תוכן: מסגרת מקווקוות,
   גופן קטן, וצבע שקט. מי שרואה אותה יודע מה היא, וגולש לעולם
   אינו רואה אותה. */
.rc-editbar {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 14px;
	align-items: center;
	margin: 0 0 22px;
	padding: 7px 12px;
	border: 1px dashed var(--rc-owner-grey);
	border-radius: 4px;
	font-size: 13px;
	line-height: 1.6;
	color: var(--rc-owner-grey);
}

/* שני הקישורים באפור, לא באדום. אדום הוא צבע הקישורים שהגולש
   רואה, ולכן צבע הכתובת המקוצרת חייב להיאמר כאן במפורש: בלעדיו
   היא יורשת את כלל הקישורים של התבנית ומופיעה אדומה, בדיוק מה
   שהשורה הזו אמורה לא להיות. הפסאודו-מחלקות נוספות כדי לגבור
   על אותו כלל בלי להסתמך על סדר טעינה. */
.rc-editbar a,
.rc-editbar a:link,
.rc-editbar a:visited,
.rc-editbar a:hover,
.rc-editbar a:focus {
	text-decoration: none;
	color: var(--rc-owner-grey);
}

.rc-editbar-edit {
	font-weight: 700;
	color: var(--rc-owner-grey);
}

/* הכתובת עצמה היא הטקסט, ולכן היא לטינית ומוצגת משמאל לימין גם
   בתוך שורה עברית. bdi מבודד בלי תגית נוספת ב-DOM. */
.rc-editbar-short {
	direction: ltr;
	unicode-bidi: isolate;
	font-family: monospace;
	opacity: .75;
}

.rc-editbar-short:hover {
	opacity: 1;
}

/* אישור העתקה. נכתב על ידי הלחיצה עצמה, ולכן אין צורך בסקריפט. */
.rc-editbar-short[data-copied]::after {
	content: " הועתק";
	direction: rtl;
	font-family: inherit;
	color: var(--rc-owner-grey);
}

/* קישור הדילוג. מוסתר לעין, קיים למקלדת, ונראה ברגע שהוא בפוקוס. */
.rc-skip{position:absolute;width:1px;height:1px;overflow:hidden;
  clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.rc-skip:focus{position:fixed;top:12px;right:12px;z-index:100000;
  width:auto;height:auto;clip:auto;clip-path:none;
  padding:12px 20px;border-radius:6px;
  background:#0d1014;color:#fff;border:2px solid var(--racing-red);
  font-size:16px;text-decoration:none}


/* ── ניווט בין פוסטים ───────────────────────────────────────────
   התווית ("פוסט הבא") והכותרת הן שני span סמוכים בסימון של הערכה.
   במקור הכותרת הייתה h4, כלומר בלוק בשורה משלו. המרתה ל-span
   נעשתה כדי לתקן דילוג בסדר הכותרות (h1 ואחריו h4), אבל span הוא
   inline — ולכן הכותרת נצמדה לתווית ונקראה כמשפט אחד:
   "פוסט הבאMX2 טריומף זכתה...".

   כאן חוזרת פריסת הבלוק בלי הכותרת: הסמנטיקה נשארת span, התצוגה
   חוזרת לשתי שורות. */
.post_nav_cont [class*="cmsmasters-icon-custom-arrow"] { display: block; }

.post_nav_cont .post_nav_title {
	display: block;
	margin-top: .4em;
	line-height: 1.5;
}

/* ── קרדיט בתחתית ───────────────────────────────────────────────
   שורת הזכויות ישבה באותה שורה עם תפריט הפוטר ונדחקה לקצה. היא
   שייכת מתחת לקישורים ובמרכז: זו חתימת האתר, לא עוד פריט תפריט. */
.footer_copyright.copyright {
	display: block;
	float: none;
	clear: both;
	width: 100%;
	text-align: center;
	margin-top: 1.2em;
	padding-top: 1.2em;
	border-top: 1px solid rgba(255, 255, 255, .08);
}

footer .bottom_inner > div:has(nav) { float: none; width: 100%; }