.diatt-popup[hidden] { display: none !important; }
.diatt-popup { position: fixed; inset: 0; z-index: 999999; display: flex; align-items: center; justify-content: center; padding: 24px; }
.diatt-popup__backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .66); }
.diatt-popup__dialog { position: relative; display: grid; grid-template-columns: minmax(0, 600px) 200px; grid-template-rows: minmax(0, 1fr) 44px; width: min(800px, calc(100vw - 48px)); max-height: calc(100vh - 48px); overflow: hidden; background: #222; box-shadow: 0 18px 60px rgba(0, 0, 0, .38); }
.diatt-popup__main { min-width: 0; overflow: auto; background: #fff; }
.diatt-popup__panel,
.diatt-popup__panel picture,
.diatt-popup__panel img { display: block; width: 100%; }
.diatt-popup__panel[hidden] { display: none !important; }
.diatt-popup__panel img { height: auto; }
.diatt-popup__side { overflow: auto; background: #333; }
.diatt-popup__tabs { display: flex; flex-direction: column; }
.diatt-popup__tab { min-height: 54px; margin: 0; padding: 10px 14px; border: 0; border-bottom: 1px solid rgba(255, 255, 255, .12); border-radius: 0; background: #aaa; color: #fff; font: inherit; font-weight: 700; line-height: 1.35; cursor: pointer; }
.diatt-popup__tab[aria-selected="true"] { background: #52afe0; }
.diatt-popup__tab[hidden] { display: none !important; }
.diatt-popup__footer { grid-column: 1 / -1; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; background: #050505; color: #fff; font-size: 14px; }
.diatt-popup__today { display: flex; align-items: center; gap: 7px; cursor: pointer; }
.diatt-popup__today input { width: 18px; height: 18px; margin: 0; }
.diatt-popup__close { align-self: stretch; padding: 0 4px; border: 0; background: transparent; color: #fff; font: inherit; font-weight: 700; cursor: pointer; }

@media (max-width: 767px) {
  .diatt-popup { align-items: center; padding: 14px; }
  .diatt-popup__dialog { display: flex; flex-direction: column; width: min(500px, calc(100vw - 28px)); max-height: calc(100vh - 28px); }
  .diatt-popup__main { order: 2; }
  .diatt-popup__side { order: 1; flex: 0 0 auto; overflow-x: auto; }
  .diatt-popup__tabs { flex-direction: row; }
  .diatt-popup__tab { flex: 0 0 auto; min-height: 44px; padding: 8px 13px; border-right: 1px solid rgba(255, 255, 255, .14); border-bottom: 0; font-size: 13px; }
  .diatt-popup__footer { order: 3; flex: 0 0 44px; width: 100%; box-sizing: border-box; }
  .diatt-popup__panel img { max-height: calc(100vh - 116px); object-fit: contain; background: #fff; }
}