﻿@import "Variables.css";
[draggable=true] {
  touch-action: none;
}

.relative {
  position: relative;
}

@media (min-width: 769px) {
  .mobile-version {
    display: none;
  }
}

.desktop-version {
  display: none;
}
@media (min-width: 768px) {
  .desktop-version {
    display: block;
  }
}

button[role=radio] {
  display: flex;
  padding: var(--spacing-2, 8px) var(--spacing-2, 8px) var(--spacing-2, 8px) var(--spacing-2, 8px);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: var(--spacing-0, 0px);
  flex: 1 0 0;
  border-radius: var(--radius-sm, 4px);
  background: var(--color-background-chip-gray-normal, #F7F7F8);
}

button[role=radio][aria-checked=true] {
  border: 1px solid var(--color-border-checkbox-checked, #97A5DD);
  background: var(--color-background-chip-white, #FFF);
}

#print-component {
  display: none;
  width: 100%;
}

#print-component * {
  display: none;
}

.modal-alert {
  text-align: center;
}
.modal-alert .text-container {
  width: 100%;
  display: flex;
  flex-direction: column;
  gap: var(--primitives-spacing-2);
  padding: 0 var(--primitives-spacing-8) var(--primitives-spacing-6) var(--primitives-spacing-8);
  color: var(--tokens-color-text-secondary, #666);
  font-family: var(--text-xl-leading-8-font-bold-font-family);
  font-style: var(--text-xl-leading-8-font-bold-font-style);
}
.modal-alert h1 {
  font-size: var(--text-xl-leading-8-font-bold-font-size);
  font-weight: var(--text-xl-leading-8-font-bold-font-weight);
  line-height: var(--text-xl-leading-8-font-bold-line-height);
}
.modal-alert p {
  font-size: var(--text-base-leading-7-font-normal-font-size);
  font-weight: var(--text-base-leading-7-font-normal-font-weight);
  line-height: var(--text-base-leading-7-font-normal-line-height);
}
.modal-alert .buttons-footer {
  display: flex;
  justify-content: center;
  gap: var(--primitives-spacing-4);
  min-width: max-content;
}

@media print {
  main {
    overflow: initial !important;
    display: table !important;
  }
  .page .sidebar, .topbar, main > * {
    display: none !important;
  }
  table {
    break-inside: auto;
  }
  thead {
    display: table-header-group !important;
  }
  tr {
    break-inside: avoid;
    break-after: auto;
  }
}
