.tc-post-weather { margin: 10px 0 0; }
.tc-post-weather__button { display: inline-flex; align-items: center; gap: 7px; min-height: 36px; margin: 0; padding: 7px 11px; border: 1px solid #eee1dc; border-radius: 8px; background: #fffaf8; color: #5e504b; font: 600 12px/1 inherit; cursor: pointer; transition: background .18s ease, border-color .18s ease, color .18s ease; }
.tc-post-weather__button:hover { border-color: #ffb1a7; background: #fff2ef; color: #d94030; }
.tc-post-weather__button small { margin-left: 1px; color: #9a8780; font-size: 11px; font-weight: 500; margin-top: 1px; }
.tc-post-weather__icon { flex: 0 0 auto; }
.tc-weather-modal[hidden] { display: none; }
.tc-weather-modal { position: fixed; z-index: 100000; inset: 0; display: grid; place-items: center; padding: 20px 16px; font-family: inherit; }
.tc-weather-modal__backdrop { position: absolute; inset: 0; background: rgba(31, 24, 21, .48); }
.tc-weather-modal__dialog { position: relative; width: min(100%, 450px); overflow: hidden; border-radius: 16px; background: #fff; box-shadow: 0 20px 60px rgba(32, 22, 18, .25); }
.tc-weather-modal__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding: 16px 20px 13px; border-bottom: 1px solid #f0e7e3; }
.tc-weather-modal__city { margin: 0; color: #342d2a; font-size: 15.5px; font-weight: 700; }
.tc-weather-modal__when { margin: 3px 0 0; color: #9b8e88; font-size: 12px; }
.tc-weather-modal__close { display: grid; width: 26px; height: 26px; place-items: center; padding: 0; border: 0; border-radius: 7px; background: transparent; color: #978a84; cursor: pointer; }
.tc-weather-modal__close:hover { background: #fff0ed; color: #e44836; }
.tc-weather-modal__message { margin: 0; padding: 34px 20px; color: #776b65; font-size: 14px; text-align: center; }
.tc-weather-current { display: flex; align-items: center; gap: 16px; padding: 20px; }
.tc-weather-current__icon { flex: 0 0 auto; color: #ff4b39; }
.tc-weather-current__main { display: grid; min-width: 0; gap: 5px; }
.tc-weather-current__main strong { color: #342d2a; font-size: 38px; line-height: 1; }
.tc-weather-current__main span { color: #786c66; font-size: 13px; }
.tc-weather-current__meta { display: grid; margin-left: auto; color: #786c66; font-size: 12px; line-height: 1.75; text-align: right; }
.tc-weather-days { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 4px; padding: 0 12px 16px; }
.tc-weather-days__item { display: grid; justify-items: center; gap: 6px; padding: 10px 3px; border-radius: 10px; color: #5d514b; }
.tc-weather-days__item.is-today { background: #fff4f1; }
.tc-weather-days__item small { color: #998b85; font-size: 11px; }
.tc-weather-days__item span { color: #50443f; font-size: 12px; }
.tc-weather-days__item i { color: #9d9089; font-style: normal; }
.tc-weather-modal__foot { padding: 12px 20px; border-top: 1px solid #f0e7e3; color: #9b8e88; font-size: 11.5px; text-align: center; }
.tc-weather-modal__foot a { color: inherit; text-decoration: underline; }
.tc-weather-modal__foot a:hover { color: #e44836; }
.tc-weather-is-open { overflow: hidden; }
@media (max-width: 575px) { .tc-weather-modal { padding: 16px; } .tc-weather-current { gap: 13px; padding: 17px; } .tc-weather-current__main strong { font-size: 34px; } .tc-weather-days { gap: 2px; padding: 0 8px 14px; } .tc-weather-days__item { padding: 8px 2px; } .tc-weather-days__item small { font-size: 10px; } .tc-weather-days__item span { font-size: 11px; } }
