/* =============================================================================
   IMS Weather Forecast — עיצוב
   גרסה 1.1.0

   פלטת צבעים:
     #421A64  — טקסט ואייקונים
     #B8BAFF  — רקע כותרת עליונה
     #E2E3FF  — רקע גוף הכרטיס

   כל הclasses מתחילים ב- ims-weather-
   ניתן לדרוס כל כלל בהתאמה אישית של Elementor או בקובץ CSS של האתר.
   ============================================================================= */

/* ── Card ─────────────────────────────────────────────────────────────────── */

.ims-weather-card {
	width: 100%;
	border-radius: 14px;
	overflow: hidden;
	font-family: inherit;
	direction: rtl;
	box-sizing: border-box;
}

/* ── Header ───────────────────────────────────────────────────────────────── */

.ims-weather-header {
	background: #B8BAFF;
	color: #421A64;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 18px 24px;
	text-align: center;
}

.ims-weather-header-icon {
	display: flex;
	align-items: center;
	flex-shrink: 0;
}

.ims-weather-sun-svg {
	width: 22px;
	height: 22px;
	display: block;
}

.ims-weather-title {
	margin: 0;
	font-size: 1.1rem;
	font-weight: 700;
	color: #421A64;
	letter-spacing: 0.01em;
}

/* ── Days — 2-column grid ─────────────────────────────────────────────────── */

.ims-weather-days {
	background: #E2E3FF;
	display: grid;
	grid-template-columns: 1fr 1fr;
	padding: 8px 12px 4px;
	gap: 0;
}

.ims-weather-day {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 7px;
	padding: 20px 10px 18px;
	text-align: center;
}

/* ── Day name ─────────────────────────────────────────────────────────────── */

.ims-weather-day-name {
	font-size: 0.8rem;
	font-weight: 700;
	color: #421A64;
	letter-spacing: 0.05em;
}

/* ── Weather icon ─────────────────────────────────────────────────────────── */

.ims-weather-icon {
	font-size: 2.2rem;
	line-height: 1.15;
	/*
	 * להחלפת emoji באייקון מותאם:
	 * הוסיפי לאתר:
	 *   .ims-weather-icon { font-size: 0; }
	 *   .ims-weather-code-1250::before { content: url('...'); }
	 */
}

/* ── Description (מוסתר כברירת מחדל; להסרה: הגדירי display:flex) ─────────── */

.ims-weather-desc {
	display: none;
	font-size: 0.7rem;
	color: #421A64;
	opacity: 0.7;
	line-height: 1.3;
	align-items: center;
	justify-content: center;
}

/* ── Temperatures ─────────────────────────────────────────────────────────── */

.ims-weather-temps {
	font-size: 0.9rem;
	white-space: nowrap;
	color: #421A64;
}

.ims-weather-temp-max {
	color: #421A64;
	font-weight: 700;
}

.ims-weather-temp-divider {
	color: #421A64;
	opacity: 0.35;
	font-weight: 400;
	margin: 0 2px;
}

.ims-weather-temp-min {
	color: #421A64;
	opacity: 0.55;
	font-weight: 400;
}

/* ── Footer ───────────────────────────────────────────────────────────────── */

.ims-weather-footer {
	background: #E2E3FF;
	text-align: center;
	padding: 0 20px 14px;
}

.ims-weather-updated {
	font-size: 0.65rem;
	color: #421A64;
	opacity: 0.4;
	letter-spacing: 0.01em;
}

/* ── Unavailable state ────────────────────────────────────────────────────── */

.ims-weather-unavailable {
	background: #E2E3FF;
}

.ims-weather-message {
	color: #421A64;
	opacity: 0.65;
	font-size: 0.9rem;
	margin: 0;
	padding: 28px 24px;
	line-height: 1.5;
	text-align: center;
}

/* ── Responsive ───────────────────────────────────────────────────────────── */

/* מסכים צרים מאוד — עמודה אחת */
@media (max-width: 260px) {
	.ims-weather-days {
		grid-template-columns: 1fr;
	}
}


/* טאבלט - כשהכרטיס צר, להציג יום מתחת ליום */
@media (min-width: 768px) and (max-width: 1024px) {

  .ims-weather-days {
    grid-template-columns: 1fr !important;
    padding: 8px 12px 6px;
  }

  .ims-weather-day {
    width: 100%;
    padding: 16px 8px 14px;
    gap: 6px;
    box-sizing: border-box;
  }

  .ims-weather-icon {
    font-size: 2rem;
  }

  .ims-weather-temps {
    font-size: 0.85rem;
    white-space: nowrap;
  }

  .ims-weather-header {
    padding: 14px 12px;
  }

  .ims-weather-title {
    font-size: 0.95rem;
    line-height: 1.35;
  }
}
