/*
 * Tawkit ESP32-C6 + SHTC3 indoor sensor — Google TV icon edition
 * Native sensor integration for Tawkit weather containers.
 */

#v9421763,
#v9423063 {
  overflow: visible !important;
}

.tawkit-native-sensor {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1vw;
  direction: rtl;
  unicode-bidi: isolate;
  box-sizing: border-box;
  color: inherit;
  font-family: var(--fnCLOKEN), "FreeSerifBold", serif;
  font-weight: bold !important;
  text-shadow: inherit;
  white-space: nowrap;
  opacity: 0.96;
}

.tawkit-native-sensor[hidden] {
  display: none !important;
}

.tawkit-native-sensor-values {
  display: inline-flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  gap: 1vw;
  direction: ltr;
  unicode-bidi: isolate;
  font-family: var(--fnCLOKEN), "FreeSerifBold", serif;
  font-weight: bold !important;
}

.tawkit-native-sensor-temperature,
.tawkit-native-sensor-humidity {
  display: inline-block;
  line-height: 1.05;
  white-space: nowrap;
  font-weight: bold !important;
}


/* Each reading keeps its icon immediately before its value. */
.tawkit-native-sensor-reading {
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.22em;
  direction: ltr;
  unicode-bidi: isolate;
  line-height: 1.05;
  white-space: nowrap;
  font-weight: bold !important;
}

.tawkit-native-sensor-value {
  display: inline-block;
  line-height: inherit;
  white-space: nowrap;
}

/*
 * Embedded SVG icons use CSS masks, so they automatically inherit the
 * active Tawkit text color and scale with the reading's font size.
 */
.tawkit-native-sensor-icon {
  display: inline-block;
  flex: 0 0 auto;
  width: 0.72em;
  height: 0.72em;
  background-color: currentColor;
  opacity: 0.92;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  -webkit-mask-size: contain;
  mask-size: contain;
}

/* Thermometer */
.tawkit-native-sensor-icon-temperature {
  width: 0.58em;
  height: 0.84em;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 13.76V5a3 3 0 0 0-6 0v8.76A5 5 0 1 0 15 13.76ZM12 20a3 3 0 0 1-1.5-5.6l.5-.29V5a1 1 0 0 1 2 0v9.11l.5.29A3 3 0 0 1 12 20Zm1-4.83V9h-2v6.17a2 2 0 1 0 2 0Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M15 13.76V5a3 3 0 0 0-6 0v8.76A5 5 0 1 0 15 13.76ZM12 20a3 3 0 0 1-1.5-5.6l.5-.29V5a1 1 0 0 1 2 0v9.11l.5.29A3 3 0 0 1 12 20Zm1-4.83V9h-2v6.17a2 2 0 1 0 2 0Z'/%3E%3C/svg%3E");
}

/* Water droplet */
.tawkit-native-sensor-icon-humidity {
  width: 0.68em;
  height: 0.82em;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2.4 6.72 9.08A7.15 7.15 0 0 0 5 13.72a7 7 0 0 0 14 0 7.15 7.15 0 0 0-1.72-4.64L12 2.4Zm0 16.32a5 5 0 0 1-5-5 5.17 5.17 0 0 1 1.27-3.36L12 5.64l3.73 4.72A5.17 5.17 0 0 1 17 13.72a5 5 0 0 1-5 5Zm-2.4-5a2.4 2.4 0 0 0 2.4 2.4v-1.6a.8.8 0 0 1-.8-.8H9.6Z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2.4 6.72 9.08A7.15 7.15 0 0 0 5 13.72a7 7 0 0 0 14 0 7.15 7.15 0 0 0-1.72-4.64L12 2.4Zm0 16.32a5 5 0 0 1-5-5 5.17 5.17 0 0 1 1.27-3.36L12 5.64l3.73 4.72A5.17 5.17 0 0 1 17 13.72a5 5 0 0 1-5 5Zm-2.4-5a2.4 2.4 0 0 0 2.4 2.4v-1.6a.8.8 0 0 1-.8-.8H9.6Z'/%3E%3C/svg%3E");
}

.tawkit-native-sensor.offline {
  opacity: 0.62;
}

/* Landscape */
#v9421763 .tawkit-native-sensor {
  position: absolute;
  left: -3vw;
  top: 100%;
  width: max-content;
  min-width: 0;
  transform: none;
  justify-content: flex-start;
  white-space: nowrap;
}

#v9421763 .tawkit-native-sensor-values {
  display: inline-flex;
  flex-direction: column;
  flex-wrap: nowrap;
  gap: 0.7em;
  align-items: center;
  justify-content: flex-start;
  white-space: nowrap;
}

#v9421763 .tawkit-native-sensor-reading {
  font-size: clamp(21px, 2.5vw, 35px);
}

/* Portrait */
#v9423063 .tawkit-native-sensor {
  position: absolute;
  left: 0;
  top: 116%;
  width: 88%;
  max-width: 88%;
  min-width: 0;
  transform: none;
  justify-content: flex-start;
  line-height: 1;
  overflow: visible;
}

#v9423063 .tawkit-native-sensor-values {
  display: inline-flex;
  flex-direction: row;
  gap: 0.34em;
  max-width: 100%;
  align-items: flex-start;
  justify-content: flex-start;
  white-space: nowrap;
}

#v9423063 .tawkit-native-sensor-reading {
  font-size: clamp(21px, 2.5vw, 35px);
}

/* Sensor-only mode: hide Tawkit's outdoor icon/temperature/range while
   preserving the original DOM and all outdoor-weather code. */
body.tawkit-outdoor-weather-disabled #v9436263,
body.tawkit-outdoor-weather-disabled #v9436363,
body.tawkit-outdoor-weather-disabled #v9436463,
body.tawkit-outdoor-weather-disabled #v9437763,
body.tawkit-outdoor-weather-disabled #v9437863,
body.tawkit-outdoor-weather-disabled #v9437963 {
  display: none !important;
}

body.tawkit-outdoor-weather-disabled #v9421763,
body.tawkit-outdoor-weather-disabled #v9423063 {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Landscape sensor-only positioning */
body.tawkit-outdoor-weather-disabled #v9421763 .tawkit-native-sensor {
  position: absolute;
  left: 1vw;
  top: 10%;
  width: max-content;
  min-width: 0;
  transform: none;
  justify-content: flex-start;
  white-space: nowrap;
}

/* Portrait sensor-only positioning */
body.tawkit-outdoor-weather-disabled #v9423063 .tawkit-native-sensor {
  position: absolute;
  left: -6vw;
  top: 10%;
  width: max-content;
  min-width: 0;
  transform: none;
  justify-content: flex-start;
  overflow: visible;
}

/* Prevent mobile and TV browsers from enlarging text automatically. */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}