programandoarg/pg_rails

@use 'sass:color';

:root,
[data-bs-theme=light] {
  --bs-form-invalid-color: #b50000;
  --bs-form-invalid-border-color: #b50000;
}

// Toasts
.toast.show {
  display: inline-block;
}

// FORMS
input[disabled] {
  background-color: #e9e9ed;
  color: black;
}

form label {
  font-weight: bold;
}

select[multiple] {
  height: inherit;
}

input[type=date] {
  max-width: 12em;
}

input[type=datetime-local], input[type=datetime] {
  max-width: 15em;
}

.form-select:not(:has(option)) {
  background-color: #d5d5d5;
}

.form-control.is-invalid, .form-select.is-invalid {
  background-color: #fff3f3;
}

// LISTADOS
.listado {
  td, th {
    padding: 0.25rem 1rem;
  }
}
.listado .btn-sm {
  padding: 0em 0.3em;
  margin-right: 4px;
}

// FILTROS
.filter {
  display: inline-block;
  vertical-align: top;
  max-width: 17em;
}

// Modal
.modal-content {
  box-shadow: 15px 15px 9px 0px rgba(0, 0, 0, 0.6);
}

// Nested
.link-to-add:hover {
  background-color: #f4f4f4;
}

.link-to-add {
  display: inline-block;
  width: 100%;
  text-align: center;
  border-radius: var(--bs-border-radius);
  padding: 0.6em 0.4em;
}


.navbar {
  @extend .bg-primary;
}

.offcanvas {
  @extend .bg-primary;
}

// Root variables
:root {
  --bs-border-radius-sm: 0.06rem;
  --bs-border-radius: 0.1rem;
  --bs-border-radius-lg: 0.25rem;
  --bs-border-radius-xl: 0.45rem;
  --bs-border-radius-xxl: 0.6rem;
  --bs-border-color: #a7b7bb;
}

// Alerts
.alert-dismissible {
  .btn-close {
    padding: 0.725rem $alert-padding-x;
  }
}

// Switcher (ver switcher_controller.js)
.switcher > * {
  display: none;
}

// Flash
#flash .alert {
  box-shadow: 0px 9px 13px -3px rgba(0, 0, 0, 0.5);
}