@govbr-ds/core/dist/components/modal/modal.css

Padrão Digital de Governo

.br-modal {
  --modal-size: var(--modal-medium);
  --modal-xsmall: 220px;
  --modal-small: 300px;
  --modal-medium: 500px;
  --modal-large: 640px;
  --modal-auto: auto;
  background: var(--background);
  box-shadow: var(--surface-shadow-sm);
  display: flex;
  flex-direction: column;
  max-width: var(--modal-size);
  z-index: var(--z-index-layer-4);
}
.br-modal-header {
  font-size: var(--font-size-scale-up-01);
  font-weight: var(--font-weight-bold);
  padding: var(--spacing-scale-2x) var(--spacing-scale-2x) 0;
  position: relative;
}
.br-modal-header .close {
  position: absolute;
  right: var(--spacing-scale-base);
  top: var(--spacing-scale-base);
}
.br-modal .modal-title {
  font-size: var(--font-size-scale-up-01);
  font-weight: var(--font-weight-bold);
  margin-right: 40px;
  max-height: calc(var(--font-size-scale-up-01) * 3);
  overflow: hidden;
  text-overflow: ellipsis;
}
.br-modal-body {
  flex: 1;
  margin: var(--spacing-scale-3x) 0 var(--spacing-scale-2x);
  overflow: auto;
  padding: 0 var(--spacing-scale-2x);
  width: auto;
}
.br-modal-body::-webkit-scrollbar {
  height: var(--spacing-scale-base);
  width: var(--spacing-scale-base);
}
.br-modal-body::-webkit-scrollbar-track {
  background: var(--gray-10);
}
.br-modal-body::-webkit-scrollbar-thumb {
  background: var(--gray-30);
}
.br-modal-body:hover::-webkit-scrollbar-thumb {
  background: var(--gray-40);
}
.br-modal-body > *:last-child {
  margin-bottom: 0;
}
.br-modal-footer {
  display: flex;
  flex-wrap: wrap;
  padding: var(--spacing-scale-2x);
}
.br-modal.is-xsmall, .br-modal.xsmall {
  --modal-size: var(--modal-xsmall);
}
.br-modal.is-small, .br-modal.small {
  --modal-size: var(--modal-small);
}
.br-modal.is-medium, .br-modal.medium {
  --modal-size: var(--modal-medium);
}
.br-modal.is-large, .br-modal.large {
  --modal-size: var(--modal-large);
}
.br-modal.is-auto, .br-modal.auto {
  --modal-size: var(--modal-auto);
}
.br-modal .loading.medium {
  min-height: calc(var(--loading-indetermined-diameter-md) + var(--spacing-scale-2x) * 2);
}
.br-modal .terms {
  border: 0;
  box-shadow: var(--surface-shadow-sm-inset), var(--surface-shadow-sm-inset-up);
  font-size: var(--font-size-scale-base);
  height: 216px;
  margin-bottom: var(--spacing-scale-2x);
  margin-left: calc(var(--spacing-scale-2x) * -1);
  margin-right: calc(var(--spacing-scale-2x) * -1);
  overflow: auto;
  padding: var(--spacing-scale-2x);
  resize: none;
  width: auto;
}
.br-modal .terms::-webkit-scrollbar {
  height: var(--spacing-scale-base);
  width: var(--spacing-scale-base);
}
.br-modal .terms::-webkit-scrollbar-track {
  background: var(--gray-10);
}
.br-modal .terms::-webkit-scrollbar-thumb {
  background: var(--gray-30);
}
.br-modal .terms:hover::-webkit-scrollbar-thumb {
  background: var(--gray-40);
}
.br-modal .terms:active {
  outline: none;
}
.br-modal .terms:hover::-webkit-scrollbar-thumb {
  background: var(--color-secondary-07);
}
@media (max-width: 991px) {
  .br-modal .terms {
    margin-left: unset !important;
    margin-right: unset !important;
  }
  .br-modal-header .close {
    top: 0;
  }
}

/*# sourceMappingURL=modal.css.map*/