/* ========================================
   MODULE- Weather
======================================== */
/* Weather Widget */
.weatherWidget {padding:5px 15px; min-width:200px;}
.weatherLoading {display:flex; align-items:center; gap:8px; color:var(--ui-color-gray-500); font-size:12px;}
.weatherLoading i {font-size:16px;}

.weatherContent {display:flex; align-items:center; justify-content:flex-end; gap:10px;}
.weatherMain {display:flex; align-items:center; gap:6px;}
.weatherIcon {font-size:22px; color:var(--ui-color-warning);}
.weatherIcon.bx-sun {color:var(--ui-color-warning);}
.weatherIcon.bx-cloud-sun {color:var(--ui-color-gray-500);}
.weatherIcon.bx-cloud {color:var(--ui-color-gray-400);}
.weatherIcon.bx-cloud-rain {color:var(--ui-color-info);}
.weatherIcon.bx-cloud-snow {color:var(--ui-color-lightblue);}
.weatherIcon.bx-cloud-lightning {color:var(--ui-color-purple);}

.weatherTemp {display:flex; align-items:center; gap:4px;}
.weatherTemp .greetingText {font-size:12px;}
.tempValue {font-size:18px; font-weight:700; color:var(--ui-color-gray-900); line-height:1;}
.tempLocation {font-size:12px; color:var(--ui-color-gray-600); margin-top:2px;}

.weatherDetails {display:flex; align-items:center; gap:12px; padding-left:10px; border-left:1px solid var(--ui-color-gray-200);}
.weatherDetail {display:flex; align-items:center; gap:4px; font-size:12px; color:var(--ui-color-gray-600);}
.weatherDetail i {font-size:14px;}
.weatherDesc {font-weight:600; color:var(--ui-color-gray-700);}

.weatherError {padding:10px; color:var(--ui-color-gray-500); font-size:12px;}

@keyframes spin {from {transform:rotate(0deg);} to {transform:rotate(360deg);}}
.bx-spin {animation:spin 1s linear infinite;}

@media (max-width: 1200px) {
    .weatherWidget {display:none;}
}