#mwx-site .mwl-weather { background: white; border: 1px solid var(--line); border-radius: 13px; padding: 32px; margin-bottom: 32px; }
#mwx-site .mwl-weather-controls { display: grid; grid-template-columns: .85fr 1.5fr; gap: 22px; align-items: end; }
#mwx-site .mwl-weather-controls label, #mwx-site .mwl-zone-control label, #mwx-site .mwl-date-picker label, #mwx-site .mwl-personal label { display: block; font-size: 12px; margin-bottom: 9px; color: #526d4e; }
#mwx-site .mwl-weather-controls form > div { display: flex; gap: 12px; }
#mwx-site .mwl-weather input, #mwx-site .mwl-weather select, #mwx-site .mwl-today input, #mwx-site .mwl-today select { width: 100%; min-width: 0; font: inherit; font-size: 13px; color: #34583e; background: #fcfdf8; border: 1px solid #d8e1d0; border-radius: 7px; min-height: 48px; padding: 11px 13px; }
#mwx-site .mwl-weather button:disabled { opacity: .5; }
#mwx-site .mwl-weather-status { font-size: 12px; color: #62775b; margin-top: 20px; min-height: 24px; }
#mwx-site .mwl-weather-main { display: flex; justify-content: space-between; align-items: center; gap: 25px; background: #ecf2e3; border: 1px solid #d5e0ca; border-radius: 12px; padding: 30px; margin-top: 24px; }
#mwx-site .mwl-weather-main h2 { font-size: 33px; margin-top: 8px; }
#mwx-site .mwl-weather-condition { display: block; color: #4f7449; font-size: 15px; margin-top: 12px; }
#mwx-site .mwl-weather-at { font-size: 11px; color: #65765e; margin-top: 9px; }
#mwx-site .mwl-weather-temperature { font-size: 94px; line-height: 1.4; color: #285b3a; font-weight: 500; }
#mwx-site .mwl-weather-metrics { display: grid; grid-template-columns: 1fr 1fr 1.4fr; gap: 15px; margin: 22px 0 30px; }
#mwx-site .mwl-weather-metrics > div { padding: 20px; border: 1px solid #e2e9da; background: #f8faf3; border-radius: 9px; }
#mwx-site .mwl-weather-metrics strong { display: block; font-size: 26px; line-height: 1.9; color: #3d6540; font-weight: 500; }
#mwx-site .mwl-weather-metrics > div:last-child strong { font-size: 17px; }
#mwx-site .mwl-weather-metrics span { font-size: 11px; color: #66785e; }
#mwx-site .mwl-days-title { font-size: 21px; margin-bottom: 20px; }
#mwx-site .mwl-weather-days { display: grid; grid-template-columns: repeat(3, 1fr); gap: 15px; }
#mwx-site .mwl-weather-days article { border: 1px solid #dfe8d6; border-radius: 10px; padding: 23px; }
#mwx-site .mwl-weather-days h3 { font-size: 13px; color: #61745a; }
#mwx-site .mwl-weather-days strong { display: block; font-size: 27px; color: #315e3c; margin-top: 15px; font-weight: 500; }
#mwx-site .mwl-weather-days p, #mwx-site .mwl-weather-cache { font-size: 11px; color: #63785c; margin-top: 12px; }
#mwx-site .mwl-weather-cache { margin-top: 23px; }
#mwx-site .mwl-source-note { border: 1px solid #dfe7d6; background: #f1f5e9; border-radius: 12px; padding: 28px; margin-bottom: 60px; }
#mwx-site .mwl-source-note h2 { font-size: 22px; margin-bottom: 14px; }
#mwx-site .mwl-source-note p { font-size: 13px; color: #53694c; line-height: 2.1; margin-top: 13px; }
#mwx-site .mwl-source-note a { color: #285f3d; text-decoration: underline; }
#mwx-site .mwl-date-cards { display: grid; grid-template-columns: 1.2fr 1.2fr 1fr; gap: 18px; margin-bottom: 22px; }
#mwx-site .mwl-date-cards > div { padding: 25px; background: white; border: 1px solid #dce5d5; border-radius: 11px; }
#mwx-site .mwl-date-cards span { color: #627859; font-size: 11px; }
#mwx-site .mwl-date-cards strong { display: block; font-size: 19px; line-height: 1.9; color: #355e3b; margin-top: 15px; }
#mwx-site .mwl-date-cards > div:last-child { background: #edf3e3; }
#mwx-site .mwl-date-cards > div:last-child strong { font-size: 26px; font-weight: 500; }
#mwx-site .mwl-zone-control { display: flex; align-items: center; flex-wrap: wrap; gap: 15px; margin-bottom: 28px; }
#mwx-site .mwl-zone-control label { margin-bottom: 0; }
#mwx-site .mwl-zone-control select { width: 210px; }
#mwx-site .mwl-zone-control p { font-size: 11px; color: #6b765a; }
#mwx-site .mwl-calendar-layout { display: grid; grid-template-columns: 1.1fr 1fr; gap: 25px; margin-bottom: 35px; }
#mwx-site .mwl-calendar, #mwx-site .mwl-day-agenda { background: white; padding: 27px; border: 1px solid #dde6d4; border-radius: 12px; min-width: 0; }
#mwx-site .mwl-calendar header { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 23px; }
#mwx-site .mwl-calendar header h2 { font-size: 22px; }
#mwx-site .mwl-calendar header button { border: 1px solid #d5e0cb; border-radius: 7px; width: 37px; height: 37px; background: #f4f8ee; color: #416c42; }
#mwx-site .mwl-calendar-week, #mwx-site .mwl-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 7px; }
#mwx-site .mwl-calendar-week span { text-align: center; font-size: 10px; color: #5f7355; padding-bottom: 12px; }
#mwx-site .mwl-calendar-grid button { position: relative; border: 1px solid #e3eadd; border-radius: 7px; background: #fafcf6; height: 46px; font: inherit; font-size: 13px; color: #4a6541; }
#mwx-site .mwl-calendar-grid button[aria-pressed="true"] { color: white; background: #285f3e; border-color: #285f3e; }
#mwx-site .mwl-has-event::after { content: ''; position: absolute; bottom: 5px; left: 50%; width: 4px; height: 4px; border-radius: 50%; background: #a47c40; transform: translateX(-50%); }
#mwx-site .mwl-is-today { outline: 2px solid #a7bf96; outline-offset: 1px; }
#mwx-site .mwl-date-picker { border-top: 1px solid #e1e8d8; padding-top: 20px; margin-top: 23px; }
#mwx-site .mwl-today input[type="date"] { direction: ltr; }
#mwx-site .mwl-day-agenda h2 { font-size: 23px; line-height: 1.8; margin-top: 10px; }
#mwx-site .mwl-agenda-hijri { font-size: 13px; color: #62775a; margin: 10px 0 25px; }
#mwx-site .mwl-agenda-items article { background: #f2f7e9; border: 1px solid #dbe7cc; padding: 20px; border-radius: 9px; margin-top: 13px; }
#mwx-site .mwl-agenda-items h3 { font-size: 18px; margin-bottom: 12px; }
#mwx-site .mwl-agenda-items a, #mwx-site .mwl-agenda-items span, #mwx-site .mwl-agenda-items > p { font-size: 12px; color: #5a7350; }
#mwx-site .mwl-events-explanation { border-top: 1px solid #e0e8d6; margin-top: 25px; padding-top: 15px; font-size: 11px; color: #69775c; line-height: 2; }
#mwx-site .mwl-personal, #mwx-site .mwl-observances { padding: 30px; background: white; border: 1px solid #dfe7d7; border-radius: 12px; margin-bottom: 35px; }
#mwx-site .mwl-personal h2, #mwx-site .mwl-observances h2 { font-size: 24px; margin-bottom: 12px; }
#mwx-site .mwl-personal p { font-size: 12px; color: #64785a; }
#mwx-site .mwl-personal form { display: grid; grid-template-columns: 1.4fr 1fr auto; gap: 17px; align-items: end; margin-top: 25px; }
#mwx-site .mwl-personal-status { margin-top: 15px; min-height: 24px; }
#mwx-site .mwl-personal-list article { display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 17px; padding: 17px 0; border-top: 1px solid #e4eadb; margin-top: 15px; }
#mwx-site .mwl-personal-list strong { font-size: 15px; overflow-wrap: anywhere; }
#mwx-site .mwl-personal-list time { font-size: 11px; color: #64755a; }
#mwx-site .mwl-personal-list button { border: 1px solid #e6d9ca; background: #fbf6ee; color: #865335; border-radius: 6px; padding: 7px 12px; font-size: 11px; }
#mwx-site .mwl-export-events { margin-top: 23px; }
#mwx-site .mwl-observances > input { max-width: 480px; margin: 10px 0 23px; }
#mwx-site .mwl-observance-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
#mwx-site .mwl-observance-list article { border: 1px solid #dce7d2; padding: 20px; background: #f9fcf4; border-radius: 9px; }
#mwx-site .mwl-observance-list span { font-size: 11px; color: #5d7850; }
#mwx-site .mwl-observance-list h3 { font-size: 16px; margin: 12px 0 15px; line-height: 1.8; }
#mwx-site .mwl-observance-list a { font-size: 11px; color: #326439; }
#mwx-site .mwl-source-note-inline { font-size: 11px; line-height: 2; color: #627657; margin-top: 25px; }
#mwx-site .mwl-today { margin-bottom: 60px; }
#mwx-site .mwx-about-offers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 17px; margin-bottom: 45px; }
#mwx-site .mwx-about-offers a { display: block; padding: 25px; background: white; border: 1px solid var(--line); border-radius: 12px; }
#mwx-site .mwx-about-offers h2 { font-size: 20px; margin: 14px 0 9px; }
#mwx-site .mwx-about-offers p { font-size: 13px; color: #65765f; line-height: 2; }
#mwx-site .mwx-about-story { max-width: 940px; border: 1px solid #dce5d3; border-radius: 12px; padding: 36px; background: white; margin: 0 auto 60px; }
#mwx-site .mwx-desk-layout { display: grid; grid-template-columns: minmax(0,1fr) 270px; gap: 35px; margin-bottom: 60px; }
#mwx-site .mwx-desk-panel { min-width: 0; background: white; border: 1px solid #dde6d4; border-radius: 13px; padding: 35px; }
#mwx-site .mwx-desk-panel > .mwx-desk-intro { font-size: 13px; color: #65775e; margin-bottom: 25px; }
#mwx-site .mwx-desk-aside { background: #eef3e6; border: 1px solid #dce6d1; border-radius: 12px; padding: 26px; align-self: start; }
#mwx-site .mwx-desk-aside h2 { font-size: 21px; margin-bottom: 18px; }
#mwx-site .mwx-desk-aside ol { padding-inline-start: 20px; color: #57724e; font-size: 13px; line-height: 2.1; }
#mwx-site .mwx-desk-aside li { margin-bottom: 15px; }
#mwx-site .mwx-faq-item { border: 1px solid #dde6d4; background: #f9fcf4; border-radius: 9px; padding: 17px 20px; margin-bottom: 13px; }
#mwx-site .mwx-faq-item summary { cursor: pointer; font-size: 16px; font-weight: 700; color: #36583a; }
#mwx-site .mwx-faq-item p { font-size: 14px; margin-top: 16px; margin-bottom: 0; }
#mwx-site .mwx-live-links { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 0 0 45px; }
#mwx-site .mwx-live-links > a { display: flex; align-items: center; justify-content: space-between; gap: 20px; border: 1px solid #dce5d3; background: #edf3e4; border-radius: 12px; padding: 27px; }
#mwx-site .mwx-live-links h2 { font-size: 23px; margin-bottom: 8px; }
#mwx-site .mwx-live-links p { font-size: 12px; color: #61775b; }
@media (max-width: 900px) { #mwx-site .mwx-desk-layout { grid-template-columns: minmax(0,1fr) 230px; gap: 23px; } #mwx-site .mwx-desk-panel { padding: 27px; } #mwx-site .mwl-weather-metrics, #mwx-site .mwx-about-offers { grid-template-columns: 1fr 1fr; } #mwx-site .mwl-weather-metrics > div:last-child { grid-column: 1/-1; } }
@media (max-width: 780px) { #mwx-site .mwl-calendar-layout, #mwx-site .mwx-desk-layout { grid-template-columns: 1fr; } #mwx-site .mwx-desk-aside { order: -1; padding: 23px; } #mwx-site .mwx-desk-aside ol { display: flex; gap: 28px; flex-wrap: wrap; margin-bottom: 0; } #mwx-site .mwx-desk-aside li { flex: 1; min-width: 120px; } #mwx-site .mwl-date-cards { grid-template-columns: 1fr; gap: 12px; } #mwx-site .mwl-personal form { grid-template-columns: 1fr 1fr; } #mwx-site .mwl-personal form button { justify-self: start; } #mwx-site .mwl-observance-list { grid-template-columns: 1fr 1fr; } #mwx-site .mwl-weather-controls { grid-template-columns: 1fr; } }
@media (max-width: 460px) { #mwx-site .mwl-weather, #mwx-site .mwx-desk-panel, #mwx-site .mwx-about-story { padding: 22px 18px; } #mwx-site .mwl-weather-main { padding: 24px 19px; gap: 15px; } #mwx-site .mwl-weather-main h2 { font-size: 26px; } #mwx-site .mwl-weather-temperature { font-size: 65px; } #mwx-site .mwl-weather-days, #mwx-site .mwx-about-offers, #mwx-site .mwx-live-links { grid-template-columns: 1fr; } #mwx-site .mwl-weather-metrics > div { padding: 16px; } #mwx-site .mwl-calendar, #mwx-site .mwl-day-agenda, #mwx-site .mwl-personal, #mwx-site .mwl-observances { padding: 23px 17px; } #mwx-site .mwl-calendar-grid, #mwx-site .mwl-calendar-week { gap: 5px; } #mwx-site .mwl-calendar-grid button { height: 38px; } #mwx-site .mwl-calendar-week span { font-size: 8px; } #mwx-site .mwl-personal form, #mwx-site .mwl-observance-list { grid-template-columns: 1fr; } #mwx-site .mwl-personal-list article { grid-template-columns: 1fr auto; gap: 10px; } #mwx-site .mwl-personal-list time { grid-column: 1; grid-row: 2; } #mwx-site .mwl-personal-list button { grid-row: 1 / span 2; grid-column: 2; } #mwx-site .mwx-desk-aside h2 { font-size: 18px; } #mwx-site .mwx-desk-aside ol { font-size: 11px; gap: 20px; } #mwx-site .mwl-zone-control select { width: 100%; } }

#mwx-site .mwl-tabs { display:flex; gap:10px; margin:8px 0 20px; }
#mwx-site .mwl-tabs a { border:1px solid #d5e1cb; border-radius:7px; padding:9px 16px; font-size:12px; color:#3e6b3e; }
#mwx-site .mwl-tabs a[aria-current="page"] { background:#285f3e; color:white; border-color:#285f3e; }
