@font-face {
  font-family: 'AkzidenzGrotesk';
  font-style: normal;
  font-weight: normal;
  src: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/fonts/AkzidenzGroteskBE-Regular.otf") format("opentype");
}

@font-face {
  font-family: 'BigCaslon';
  font-style: normal;
  font-weight: normal;
  src: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/fonts/Big%20Caslon%20Medium.otf") format("opentype");
}

:root {
  --project-cream: #fbf6f0;
  --project-beige: #D7AA6F;
  --project-gray: #5B5B5B;
  --project-light-gray: #a8a8a8;
  --project-gray-util: #f3f3f3;
  --project-green: #4c7738;
  --project-red: #ff0000;
  --flexible-size: calc(1vw + 1vh + .5vmin);
  --nav-height: 9vh;
  --nav-height-phone: 7vh;
  --main-container-y-padding: calc(1vw + 1vh + .5vmin);
  --main-container-x-padding: calc(calc(1vw + 1vh + .5vmin)* .8);
  --common-border-radius: calc(var(--flexible-size)* .8);
  --common-button-aspect-ratio: 300 / 64;
}

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

p {
  margin: 0;
}

html,
body {
  width: 100%;
  height: 100%;
  font-family: "AkzidenzGrotesk";
}

select {
  font-family: "AkzidenzGrotesk";
}

body {
  min-height: 100%;
  height: fit-content;
  position: relative;
}

.bg-img {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

.no-spacing {
  padding: 0;
  margin: 0;
}

.no-focus {
  outline: none;
  box-shadow: none;
}

.no-focus:focus {
  outline: none;
  box-shadow: none;
}

.no-focus:active {
  outline: none;
  box-shadow: none;
}

.no-border {
  border: none;
}

.bg-cream {
  background: var(--project-cream);
}

.multiple-view[off] {
  display: none;
}

.alert {
  font-family: "AkzidenzGrotesk";
  background: white;
  border-radius: calc(var(--flexible-size)* .5);
  word-wrap: break-word;
  border: calc(var(--flexible-size)*.05) solid transparent;
}

.alert-info {
  color: var(--project-gray);
  border-color: var(--project-gray);
}

.alert-error {
  color: var(--project-red);
  border-color: var(--project-red);
}

.alert-success {
  color: var(--project-green);
  border-color: var(--project-green);
}

.main {
  display: flex;
  width: 100%;
  flex-grow: 2;
  position: relative;
  max-width: 100%;
}

.body-flex {
  display: flex;
  flex-direction: column;
}

.clean-input {
  background: none;
  border: none;
  font-family: "AkzidenzGrotesk";
}

.main-container {
  padding: var(--main-container-y-padding) var(--main-container-x-padding);
}

.content {
  background: white;
  flex-grow: 1;
  border-radius: var(--common-border-radius);
  padding: calc(var(--flexible-size)* .8);
  display: grid;
  grid-template-rows: min-content min-content auto min-content;
}

.content-first-row {
  display: flex;
}

.custom-btn {
  background: none;
  border: none;
}

.content-second-row {
  margin-top: calc(var(--flexible-size) * .4);
  height: max-content;
  display: flex;
  flex-wrap: wrap;
  padding-top: - calc(var(--flexible-size)* .4);
}

.content-second-row>* {
  margin-top: calc(var(--flexible-size)* .4);
}

.filter-dropdown,
.filter-searcher {
  border: calc(var(--flexible-size) * .05) solid var(--project-beige);
  width: 100%;
  font-size: calc(var(--flexible-size) * .6);
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/flecha_selector.svg");
  background-repeat: no-repeat;
  background-position: right calc(var(--flexible-size) * .5) center;
  background-size: calc(var(--flexible-size) * .5) calc(var(--flexible-size) * .45);
  border-radius: calc(var(--flexible-size) * .5);
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  padding: calc(var(--flexible-size) * .2);
  padding-left: calc(var(--flexible-size)*.5);
  color: var(--project-beige);
}

.filter-searcher>input {
  font-size: calc(var(--flexible-size) * .6);
  height: 80%;
  width: 100%;
  max-width: 100%;
  min-width: none;
  flex-basis: auto;
  -webkit-appearance: none;
  appearance: none;
  -moz-appearance: none;
}

.filter-searcher {
  background-image: none;
  display: flex;
  align-items: center;
  overflow: hidden;
}

.filter-searcher::after {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352c79.5 0 144-64.5 144-144s-64.5-144-144-144S64 128.5 64 208s64.5 144 144 144z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M416 208c0 45.9-14.9 88.3-40 122.7L502.6 457.4c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L330.7 376c-34.4 25.2-76.8 40-122.7 40C93.1 416 0 322.9 0 208S93.1 0 208 0S416 93.1 416 208zM208 352c79.5 0 144-64.5 144-144s-64.5-144-144-144S64 128.5 64 208s64.5 144 144 144z'/%3E%3C/svg%3E");
  content: " ";
  /*height:80%;*/
  width: calc(var(--flexible-size) * .6);
  margin: 0 1%;
  background: var(--project-beige);
  aspect-ratio: 1/1;
}

.date-filters {
  display: flex;
}

.date-filters div:first-child {
  margin-right: calc(var(--flexible-size)*.5);
}

.date-filter-subcontainer {
  display: flex;
  align-items: center;
}

.date-filter-subcontainer label,
.date-filter-subcontainer input {
  font-size: calc(var(--flexible-size)*.55);
  display: flex;
  align-items: center;
}

.date-filter-subcontainer label {
  margin-right: calc(var(--flexible-size)*.3);
}

.current-date {
  font-size: calc(var(--flexible-size)*.6);
}

.content-section {
  width: 100%;
  max-width: 100%;
  overflow: auto;
  margin-top: calc(var(--flexible-size)* .4);
}

.content-table-container {
  flex-grow: 1;
  overflow: auto;
  max-width: 100%;
  height: 100%;
}

.content-table {
  min-width: 100%;
  overflow: auto;
  border: none;
  border-collapse: collapse;
}

.content-table th {
  background-color: var(--project-beige);
  color: white;
  font-size: calc(var(--flexible-size)* .5);
  padding: 0 calc(var(--flexible-size)* .2);
  font-family: "AkzidenzGrotesk";
  min-width: max-content;
}

.content-table td {
  font-size: calc(var(--flexible-size)* .6);
  text-align: center;
  padding: calc(var(--flexible-size)* .3);
}

.content-table tbody tr:nth-child(odd) {
  background-color: white;
}

.content-table tbody tr:nth-child(even) {
  background-color: var(--project-cream);
}

.pagination-buttons {
  display: flex;
  justify-content: center;
}

.pagination-buttons>* {
  aspect-ratio: 113/150;
  cursor: pointer;
  width: calc(var(--flexible-size)* .8);
  background-color: var(--project-gray);
  margin-right: calc(var(--flexible-size)* .3);
}

.pagination-buttons>button:first-child {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 278.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M41.4 233.4c-12.5 12.5-12.5 32.8 0 45.3l192 192c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3L109.3 256 278.6 86.6c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0l-192 192z'/%3E%3C/svg%3E");
}

.pagination-buttons>button:last-child {
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M342.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L274.7 256 105.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M342.6 233.4c12.5 12.5 12.5 32.8 0 45.3l-192 192c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3L274.7 256 105.4 86.6c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0l192 192z'/%3E%3C/svg%3E");
}

.action-buttons {
  display: flex;
  width: max-content;
  flex-grow: 1;
  justify-content: flex-end;
}

#applyFiltersBtn,
#clearFiltersBtn,
#downloadBtn {
  width: calc(var(--flexible-size)* 4);
  aspect-ratio: 300 / 64;
  margin-right: calc(var(--flexible-size)* .3);
  background-repeat: no-repeat;
}

#applyFiltersBtn {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_filtrar.svg");
}

#clearFiltersBtn {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_limpiarfiltro.svg");
}

#downloadBtn {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_descargar.svg");
}

.action-buttons>button:last-child {
  margin-right: 0 !important;
}

.table-link {
  width: calc(var(--flexible-size)* .8);
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_mas.svg");
  aspect-ratio: 1/1;
  cursor: pointer;
}

.back-button {
  position: absolute;
  background: none;
  border: none;
  width: calc(var(--flexible-size)* 2.3);
  margin-top: calc(var(--flexible-size)* 1);
  margin-left: calc(var(--flexible-size)* 1);
  background-repeat: no-repeat;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/flecha_back.svg");
  background-position: center;
  background-size: 60%;
  aspect-ratio: 1/1;
}

.details-content-container {
  display: flex;
  flex-grow: 1;
}

.details-content {
  background-color: white;
  max-width: 80%;
  margin: calc(var(--flexible-size)* 1) auto;
  border-radius: var(--common-border-radius);
  padding: calc(var(--flexible-size)* .8);
  display: flex;
  flex-direction: column;
  flex-grow: 1;
}

.text-with-label {
  display: flex;
  align-items: center;
  margin-top: calc(var(--flexible-size)* .2);
}

.text-with-label>* {
  display: contents;
}

.text-with-label h3 {
  font-size: calc(var(--flexible-size)* .65);
  color: var(--project-beige);
  margin-right: calc(var(--flexible-size)* .2);
}

.text-with-label p {
  font-size: calc(var(--flexible-size)* .6);
}

.details-content hr {
  border: none;
  border-bottom: calc(var(--flexible-size) * .05) dashed var(--project-beige);
}

.details-content h2 {
  font-size: calc(var(--flexible-size) * .75);
  color: var(--project-beige);
}

.labeled-form-input-container {}

.labeled-form-input-container>p {
  font-size: calc(var(--flexible-size) * .75);
}

.labeled-form-input {
  border: calc(var(--flexible-size) * .05) solid var(--project-beige);
  font-size: calc(var(--flexible-size) * .65);
  width: 100%;
}

.tab-button {
  width: 15%;
  aspect-ratio: 300/60;
  background-repeat: no-repeat;
}


input[type='file'] {
  display: none;
}

/************************************************************************************/
/* LOGIN */
.login-main {
  padding: 2%;
  height: 100vh;
}

.login-image-container {
  flex-basis: 60%;
  display: flex;
  justify-content: center;
}

.login-image {
  display: flex;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/imagen_login.jpg");
  aspect-ratio: 1/1;
  height: 80%;
  align-self: center;
  justify-self: flex-end;
}

.login-form-section {

  display: flex;
  align-items: center;
  justify-content: center;
  flex-basis: 40%;
  flex-grow: 2;
}

.login-form-container {
  background-color: white;
  width: 70%;
  height: fit-content;
  display: flex;
  flex-direction: column;
  align-items: center;
  aspect-ratio: 8/10;
  max-height: 80%;
}

.login-form-image {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/logofull_conchal.svg");
  width: 55%;
  aspect-ratio: 300/121;
}

.login-form-title {
  color: var(--project-gray);
  font-size: calc(var(--flexible-size)* .8);
  text-align: center;
  margin: calc(var(--flexible-size)* .9) 0;
}

.login-form {
  display: flex;
  flex-direction: column;
  justify-content: space-evenly;
  background: var(--project-cream);
  width: 70%;
  padding: 0 10%;
  border-radius: calc(var(--flexible-size)* .9);
  aspect-ratio: 11/10;
}

.login-form-input-container {
  display: flex;
  border: none;
  border-bottom: solid var(--project-beige) 1px;
}

.login-form-input-container label {
  vertical-align: bottom;
  display: flex;
  align-items: end;
  font-size: calc(var(--flexible-size)* .5);
  color: var(--project-gray);
}

.login-form-input {
  margin-left: calc(var(--flexible-size)* .3);
  font-size: calc(var(--flexible-size)* .5);
  background: none;
  border: none;
  flex-grow: 2;
  color: var(--project-gray);
}

.login-form-button {
  background: none;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_ingresar.svg");
  border: none;
  width: 70%;
  align-self: center;
  aspect-ratio: 768/154;
}

/* NAVBAR */
.nav {
  height: var(--nav-height);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: white;
}

.nav-left {
  margin-left: calc(var(--flexible-size)* 2);
  height: 70%;
  display: flex;
  width: inherit;
}

.nav-left>hr {
  margin: 0 calc(var(--flexible-size)* .5);
  border: solid .5px var(--project-green);
}

.nav-logo {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/iconheader_logoconchal.svg");
  height: 100%;
  aspect-ratio: 768/547;
}

.nav-title {
  display: flex;
  align-items: center;
  font-size: calc(var(--flexible-size)* 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

.nav-logout {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_cerrarsesion.svg");
  height: 50%;
  aspect-ratio: 176/150;
  margin-right: calc(var(--flexible-size)* 1.2);
}

/* SIDE MENU */
.side-menu {
  background-color: white;
  padding: var(--flexible-size) calc(var(--flexible-size)* .6);
  border-radius: var(--common-border-radius);
  margin-right: var(--main-container-x-padding);
}

.side-menu ul {
  width: 100%;
  height: 100%;
  list-style: none;
}

.side-menu ul>li {
  margin-right: var(--flexible-size);
  margin-bottom: calc(var(--flexible-size) * .65);
  display: flex;
}

.side-menu ul>li>a {
  font-family: "BigCaslon";
  font-size: calc(var(--flexible-size) * .7);
  text-decoration: none;
  color: var(--project-light-gray);
  width: max-content;
}

.new-push-globe {
  background-color: red;
  min-width: calc(var(--flexible-size) * .7);
  height: calc(var(--flexible-size) * .7);
  border-radius: 50%;
  font-size: calc(var(--flexible-size)*0.5);
  padding: calc(var(--flexible-size)*0.1);
  color: white;
  text-align: center;
  display: flex;
  font-family: auto;
  align-items: center;
  justify-content: center;
  margin-top: calc(var(--flexible-size)*-0.1);
}

/* ENTRY DEPARTURE */
#entriesBtn,
#departuresBtn {
  width: 15%;
  aspect-ratio: 300/60;
  background-repeat: no-repeat;
}

#departuresBtn {
  margin-left: calc(var(--flexible-size) * .7);
}

#entriesBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_entradas_on.svg");
}

#entriesBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_entradas_off.svg");
}

#departuresBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_salidas_on.svg");
}

#departuresBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_salidas_off.svg");
}

.entry-departure-dropdown-filter,
.entry-departure-search-filter {
  width: 25%;
  flex-grow: 1;
}

.entry-departure-second-row>* {
  margin-right: calc(var(--flexible-size) * .7);
}

.entry-departure-second-row>*:last-child {
  margin-right: 0;
}

/* BOOKINGS */
.bookings-first-row h1 {
  font-size: calc(var(--flexible-size) * 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

.bookings-second-row {
  gap: calc(var(--flexible-size) * .5);
}

.bookings-second-row .action-buttons {
  flex-basis: auto;
}

.bookings-second-row>*:first-child,
.bookings-second-row>*:nth-child(2) {
  min-width: 30%;
  width: min-content;
  max-width: 100%;
  flex-grow: 1;
}

/* BOOKING DETAILS */
.booking-details .details-content h3 {
  font-size: calc(var(--flexible-size) * .65);

}

.booking-details .details-content p {
  font-size: calc(var(--flexible-size) * .6);
}

.details-content hr {
  border: none;
  border-bottom: calc(var(--flexible-size) * .05) dashed var(--project-beige);
}

.booking-detail-header {
  display: flex;
  width: 100%;
  justify-content: space-between;
  height: max-content;
}

.booking-detail-header>h1 {
  font-size: calc(var(--flexible-size) * 1);
  color: var(--project-beige);
}

.booking-detail-header>button {
  aspect-ratio: 300 / 64;
  width: calc(var(--flexible-size) * 4);
  background: none;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_descargar.svg");
}

.booking-details-first-info {
  margin-top: calc(var(--flexible-size) * .5);
  display: grid;
  gap: calc(var(--flexible-size) * .8);
  grid-template-columns: repeat(5, 1fr);
  overflow: auto;
  margin-bottom: calc(var(--flexible-size) * .8);
}

.booking-details-first-info h2 {
  margin-bottom: calc(var(--flexible-size) * .2);
}

.booking-details-first-info>section {
  overflow: auto;
}

.guest-name-type {
  display: flex;
  flex-direction: column;
}

.guest-name-type>span {
  font-size: calc(var(--flexible-size) * .5);
}

.guests-container {
  width: 100%;
  overflow: auto;
  aspect-ratio: 1.5/1;
}

.guests-container>* {
  margin-bottom: calc(var(--flexible-size) * .2);
}

.booking-details-section {
  margin: calc(var(--flexible-size) * .5) 0;
}

.preferences-container>* {
  margin-bottom: calc(var(--flexible-size) * .2);
}

.booking-details-fourth-info h3 {
  color: var(--project-beige);
}

.booking-actions-container {
  margin-top: calc(var(--flexible-size) * .5);
  display: grid;
  gap: calc(var(--flexible-size) * .7);
  grid-template-columns: repeat(5, 1fr);
}

.booking-actions {
  margin-top: calc(var(--flexible-size) * .2);
  width: 100%;
  overflow: auto;
  aspect-ratio: 2/1.1;
}

/* MEMBERSHIPS */
#petitionsBtn,
#membersBtn {
  width: 15%;
  aspect-ratio: 300/60;
  background-repeat: no-repeat;
}

#membersBtn {
  margin-left: calc(var(--flexible-size) * .7);
}

#petitionsBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btnchl_solicitudes_on.svg");
}

#petitionsBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btnchl_solicitudes_off.svg");
}

#membersBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btnchl_miembros_on.svg");
}

#membersBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btnchl_miembros_off.svg");
}

.date-container-petitions {
  order: 2;
}

.memberships-filters-container-petitions {
  flex-grow: 1;
}

.memberships-filters-container-petitions>*:first-child {
  width: calc(var(--flexible-size) * 15);
}

.memberships-filters-container-petitions>*:not(:first-child) {
  display: none;
}

.membership-members-second-row {
  flex-direction: column;
}

.date-container-members {
  display: flex;
  flex-grow: 1;
  justify-content: flex-end;
}

.memberships-filters-container-members {
  display: flex;
  gap: calc(var(--flexible-size) * .5);
  flex-wrap: wrap;
  flex-grow: 1;
  align-items: center;
}

.memberships-filters-container-members>* {
  width: auto;
  min-width: fit-content;
  flex: 1;
}

/* MEMBERSHIP DETAILS */
.membership-details p {
  font-size: calc(var(--flexible-size) * .6);
}

.membership-details span {
  font-size: calc(var(--flexible-size) * .5);
}

.membership-details h1 {
  font-size: calc(var(--flexible-size) * 1);
  word-wrap: break-word;
}

.membership-details h3 {
  font-size: calc(var(--flexible-size) * .65);

}

.membership-details-first-row {
  display: flex;
  flex-direction: column;
  margin-bottom: calc(var(--flexible-size) * .7);
}

.membership-details-sub-first-row {
  display: flex;
  margin-top: calc(var(--flexible-size) * .7);

}

.membership-details-sub-first-row>div:first-child {
  display: flex;
  flex: 3;
  flex-wrap: wrap;
  max-width: 75%;
  overflow: auto;
  gap: calc(var(--flexible-size) * .7)
}

.membership-details-sub-first-row>div:first-child>div:last-child {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 85%;
}

.membership-details-sub-first-row>div:last-child {
  display: flex;
  flex: 1;
  flex-direction: column;
  align-items: center;
  max-width: 25%;
  justify-content: center;
  gap: calc(var(--flexible-size) * .4);
}

.membership-details-sub-first-row>div:last-child>select {
  width: initial;
  max-width: 100%;
  border-radius: 0;
  padding-right: calc(var(--flexible-size) * 1.1);
}

.membership-details-sub-first-row>div:last-child>.custom-btn {
  width: 40%;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_guardar.svg");
  aspect-ratio: var(--common-button-aspect-ratio);
}

.owner-img {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/icon_fotouser.svg");
  width: calc(var(--flexible-size)*4);
  aspect-ratio: 1;
  background-size: 100%;
  border-radius: 100%;
}

.membership-details-sub-second-row {
  margin-top: calc(var(--flexible-size) * .7);
  display: flex;
  gap: calc(var(--flexible-size) * .2);
  flex-direction: column;
}

.membership-family-details {
  margin-top: calc(var(--flexible-size) * .7);
}

.membership-family-details h2 {
  color: black;
}

.membership-family-member {
  margin: calc(var(--flexible-size) * .6) 0;
}

.membership-payments-details {
  margin-top: calc(var(--flexible-size) * .7);
  display: flex;
  flex-direction: column;
}

.payment-detail {
  display: flex;
  width: 100%;

  flex-wrap: wrap;
  align-items: center;
  gap: calc(var(--flexible-size) * .5);
}

.payment-detail a {
  color: black;
  font-size: calc(var(--flexible-size) * .6);
}

.payment-detail>* {
  flex: 1;
}

/* PAYMENTS REPORTS */

.payments-reports .content-first-row>h1 {
  font-size: calc(var(--flexible-size) * 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

.payments-reports-filters-section {
  display: flex;
  gap: calc(var(--flexible-size) * .6);
  flex-wrap: wrap;
}

.payments-reports-filters-section>* {
  flex: 1;
}

.payments-reports-filters-section>.filter-searcher,
.payments-reports-filters-section>.filter-dropdown {
  min-width: calc(var(--flexible-size) * 7);
}

/* USERS */
#insideAppBtn,
#adminSiteBtn {
  width: 20%;
  aspect-ratio: 300/60;
  background-repeat: no-repeat;
}

.user-type-select {
  border-radius: 0;
}

#adminSiteBtn {
  margin-left: calc(var(--flexible-size) * .7);
}

#insideAppBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_appinterna_on.svg");
}

#insideAppBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_appinterna_off.svg");
}

#adminSiteBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_sitioadmin_on.svg");
}

#adminSiteBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_sitioadmin_off.svg");
}

.users-first-row {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.users-first-row p {
  display: flex;
  align-items: center;
}

.users-first-row>div:first-child {
  flex: 1;
  display: flex;
  align-items: center;
}

.users-content hr {
  margin: calc(var(--flexible-size) * .7) 0;
  border: none;
  border-bottom: calc(var(--flexible-size) * .2) solid var(--project-beige);
}

.users-second-row {
  width: 100%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: calc(var(--flexible-size) * .7);
}

.users-second-row>.filter-dropdown,
.users-second-row>.filter-searcher {
  min-width: 25%;
  flex: 1;
}

.users-second-row>.filter-dropdown,
.users-second-row>.filter-searcher,
.users-second-row>h1 {}

.users-second-row>h1,
.user-details h1 {
  font-size: calc(var(--flexible-size) * 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

/* .users-second-row>button {
  width: 12%;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_crearuser.svg");
  aspect-ratio: var(--common-button-aspect-ratio);
} */

.users-state-button {
  width: calc(var(--flexible-size) * 4);
  aspect-ratio: var(--common-button-aspect-ratio);
}

.users-state-button[inactive] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/indicador_inactivo.svg");
}

.users-state-button[active] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/indicador_activo.svg");
}

.edit-user-link {
  width: calc(var(--flexible-size) * 2);
  aspect-ratio: 281/150;
  background-repeat: no-repeat;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_editar.svg");
}

.user-details {
  flex-direction: column;
  align-items: center;
}

.user-form {
  width: 40%;
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: calc(var(--flexible-size) * .8)
}

.user-details .labeled-form-input-container {
  width: 100%;
}

.user-form>* {
  margin-bottom: calc(var(--flexible-size) * .8);
}

.user-details .labeled-form-input-container>p {
  margin-left: calc(var(--flexible-size) * .8);
}

.user-details .labeled-form-input {
  padding: calc(var(--flexible-size) * .15);
}

.create-user-button {
  width: 30%;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_crearuser.svg");
  aspect-ratio: var(--common-button-aspect-ratio);
}

/* COMMUNICATIONS */
.communications-first-row {
  display: flex;
  align-items: center;
}

.communications-first-row>*:not(:first-child) {
  margin-left: calc(var(--flexible-size) * .7);
}

.communications-first-row>*:last-child {
  flex-grow: 1;
  text-align: end;
}

#notificationsBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_notificaciones_on.svg");
}

#notificationsBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_notificaciones_off.svg");
}

#eventsBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_eventos_on.svg");
}

#eventsBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_eventos_off.svg");
}

#genInfoBtn[on] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_infogeneral_on.svg");
}

#genInfoBtn[off] {
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_infogeneral_off.svg");
}

.communications-second-row>hr {
  margin: calc(var(--flexible-size) * .7) 0;
  border: none;
  border-bottom: calc(var(--flexible-size) * .2) solid var(--project-beige);
}

.communications-content {
  /*min-height: 100%;
  min-width: 100%;*/
}

.communications-content p {
  font-size: calc(var(--flexible-size)* .6);
}

.communications-content h1 {
  font-size: calc(var(--flexible-size) * 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

.communications-notifications {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.notifications-form {
  margin-top: calc(var(--flexible-size) * .7);
  display: flex;
  flex-direction: column;
  width: 50%;
}

.notifications-form>* {
  margin-top: calc(var(--flexible-size) * .8);
}

.notifications-form span {
  font-size: calc(var(--flexible-size)* .5);
}

.notifications-form textarea {
  margin-top: calc(var(--flexible-size) * .7);
  width: 100%;
  font-family: "AkzidenzGrotesk";
  padding: calc(var(--flexible-size) * .4);
  aspect-ratio: 3;
  resize: none;
  font-size: calc(var(--flexible-size) * .55);
}


.notifications-form>p:first-child {
  text-align: center;
}

.notifications-form select {
  border-radius: 0;
  min-width: 40%;
  width: max-content;
}

.publish-button {
  margin-top: calc(var(--flexible-size) * .7);
  aspect-ratio: var(--common-button-aspect-ratio);
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_publicar.svg");
}

#submitNotificationBtn {
  width: 25%;
  margin: 0 auto;
}

.communications-events {
  display: flex;
  flex-direction: column;
}

.communications-events hr,
.communications-info hr {
  border: none;
  border-bottom: calc(var(--flexible-size) * .05) dashed var(--project-beige);
}

.communications-events>hr,
.communications-info>hr {
  margin: calc(var(--flexible-size) * .7) 0;
}

.communications-events-form {
  /*padding: 0 10%;*/
  margin: 0 auto;
  margin-top: calc(var(--flexible-size) * .7);
  display: grid;
  grid-template-columns: 1fr 1fr;
  width: 80%;
  flex-grow: 1;
}

.communications-events-form .date-filters {
  flex-wrap: wrap;
}

.communications-events-form .date-filters,
.communications-events-form .date-filters input {
  color: var(--project-beige);
}

.communications-events-form-first-part {
  border-right: calc(var(--flexible-size) * .05) dashed var(--project-beige);
  padding-right: calc(var(--flexible-size) * 1);
}

.communications-events-form-second-part {
  padding-left: calc(var(--flexible-size) * 2);
}

.communications-events-form-first-part,
.communications-events-form-second-part {
  overflow: auto;
}

.communications-events-form-first-part>*,
.communications-events-form-second-part>* {
  min-width: 60%;
  margin-top: calc(var(--flexible-size) * .7);
}

.communications-events-form input,
.communications-events-form select {
  padding-top: calc(var(--flexible-size) * .12);
  padding-bottom: calc(var(--flexible-size) * .12);
  border-radius: 0;
  font-size: calc(var(--flexible-size) * .6);
}

.communications-events-form input,
.communications-events-form select,
.communications-events-form p {
  width: 80%;
  max-width: 80%;
}

.communications-events-form .labeled-form-input-container .labeled-form-input-container {
  margin-top: calc(var(--flexible-size) * .5);
}

.communications-events-form .labeled-form-input-container .labeled-form-input-container p {
  color: var(--project-beige);
  margin-left: calc(var(--flexible-size) * .5);
}

.event-note-input {
  border: calc(var(--flexible-size) * .05) solid var(--project-beige);
  width: 100%;
  font-family: "AkzidenzGrotesk";
  padding: calc(var(--flexible-size) * .4);
  resize: none;
  aspect-ratio: 5;
  font-size: calc(var(--flexible-size) * .55);
}

.image-uploading {
  width: 70%;
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.image-uploading-container span {
  font-size: calc(var(--flexible-size) * .4);
  width: 50%;
  display: inline-block;
}

.communications-events-form .image-viewer {
  margin-top: calc(var(--flexible-size) * .4);
}

#submitEventBtn,
#submitInfoBtn {
  min-width: 15%;
  width: 30%;
}

.image-uploading>div:last-child {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.image-viewer {
  background-color: var(--project-gray-util);
  width: 100%;
  aspect-ratio: 700/800;
}

.upload-image-input-label {
  margin-left: calc(var(--flexible-size) * .8);
  width: 50%;
  aspect-ratio: 281/150;
  background-repeat: no-repeat;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_cargarimagen.svg");
}

.uploaded-image-carousel[visibility="gone"] {
  display: none;
}

.uploaded-image-carousel[visibility="visible"] {
  display: flex;
}

.uploaded-image-carousel {
  height: calc(var(--flexible-size) * 1.3);
  margin-top: calc(var(--flexible-size) * .5);
  max-width: 100%;
  display: flex;
  overflow-x: visible;
  position: relative;
  contain: size;
  overflow: auto;
}

.uploaded-image-carousel-container {
  display: flex;
}


.uploaded-image-carousel-container>* {
  height: 100%;
  margin-left: calc(var(--flexible-size) * .2);
  aspect-ratio: 800/1200;
}

.uploaded-image-carousel-container>*:first-child {
  margin-left: 0;
}


.communications-info .image-viewer {
  margin-top: unset;
  aspect-ratio: 800/1200;
}

.communications-info .image-uploading-container span {
  width: 100%;
  margin-left: calc(var(--flexible-size) * .8);
}

.communications-info .upload-image-input-label {
  margin-top: calc(var(--flexible-size) * .3);
}

.communications-info .image-uploading {
  margin-top: calc(var(--flexible-size) * .4);
}

.communications-info .image-uploading>div:last-child {
  flex-direction: column;
  align-items: unset;
}

.communications-table-content-container {
  width: 50%;
  margin: 0 auto;
  margin-top: calc(var(--flexible-size) * .4);
}

.communications-table-content-container .content-section {
  height: min(25vw, 25vh);
}

.delete-banner-row {
  aspect-ratio: 1;
  background-image: url();
  width: calc(var(--flexible-size) * .5);
  background-color: var(--project-red);
  mask-repeat: no-repeat;
  -webkit-mask-repeat: no-repeat;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M160 400C160 408.8 152.8 416 144 416C135.2 416 128 408.8 128 400V192C128 183.2 135.2 176 144 176C152.8 176 160 183.2 160 192V400zM240 400C240 408.8 232.8 416 224 416C215.2 416 208 408.8 208 400V192C208 183.2 215.2 176 224 176C232.8 176 240 183.2 240 192V400zM320 400C320 408.8 312.8 416 304 416C295.2 416 288 408.8 288 400V192C288 183.2 295.2 176 304 176C312.8 176 320 183.2 320 192V400zM317.5 24.94L354.2 80H424C437.3 80 448 90.75 448 104C448 117.3 437.3 128 424 128H416V432C416 476.2 380.2 512 336 512H112C67.82 512 32 476.2 32 432V128H24C10.75 128 0 117.3 0 104C0 90.75 10.75 80 24 80H93.82L130.5 24.94C140.9 9.357 158.4 0 177.1 0H270.9C289.6 0 307.1 9.358 317.5 24.94H317.5zM151.5 80H296.5L277.5 51.56C276 49.34 273.5 48 270.9 48H177.1C174.5 48 171.1 49.34 170.5 51.56L151.5 80zM80 432C80 449.7 94.33 464 112 464H336C353.7 464 368 449.7 368 432V128H80V432z'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M160 400C160 408.8 152.8 416 144 416C135.2 416 128 408.8 128 400V192C128 183.2 135.2 176 144 176C152.8 176 160 183.2 160 192V400zM240 400C240 408.8 232.8 416 224 416C215.2 416 208 408.8 208 400V192C208 183.2 215.2 176 224 176C232.8 176 240 183.2 240 192V400zM320 400C320 408.8 312.8 416 304 416C295.2 416 288 408.8 288 400V192C288 183.2 295.2 176 304 176C312.8 176 320 183.2 320 192V400zM317.5 24.94L354.2 80H424C437.3 80 448 90.75 448 104C448 117.3 437.3 128 424 128H416V432C416 476.2 380.2 512 336 512H112C67.82 512 32 476.2 32 432V128H24C10.75 128 0 117.3 0 104C0 90.75 10.75 80 24 80H93.82L130.5 24.94C140.9 9.357 158.4 0 177.1 0H270.9C289.6 0 307.1 9.358 317.5 24.94H317.5zM151.5 80H296.5L277.5 51.56C276 49.34 273.5 48 270.9 48H177.1C174.5 48 171.1 49.34 170.5 51.56L151.5 80zM80 432C80 449.7 94.33 464 112 464H336C353.7 464 368 449.7 368 432V128H80V432z'/%3E%3C/svg%3E");
}

.see-banner-row {
  width: calc(var(--flexible-size) * 1);
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_ver.svg");
  aspect-ratio: 281/150;
}

.edit-banner-row {
  width: calc(var(--flexible-size) * 1);
  aspect-ratio: 281/150;
  margin: 0 !important;
  background-repeat: no-repeat;
  background-image: url("https://storage.googleapis.com/res-conchal.appspot.com/cdn/imgs/btn_editar.svg");
}

#propertiesList {
  display: flex;
  flex-direction: column;
}

/* REPORTS */
.reports-content .content-first-row>h1 {
  font-size: calc(var(--flexible-size) * 1);
  font-family: "BigCaslon";
  color: var(--project-green);
}

/* VISITS */
.visits-section .content-table tbody td {
  text-wrap: nowrap;
}

.data-list-cell {
  cursor: pointer;
}

.data-list-cell li:not(:first-child) {
  height: 0;
  width: 0;
  opacity: 0;
}

.data-list-cell:focus {
  position: absolute;
  background: white;
  z-index: 99;
  border: .1vw solid rgb(220,220,220);
}

.data-list-cell:focus li {
  height: unset;
  width: unset;
  opacity: 1;
  padding: calc(var(--flexible-size)* .3);
}

/* TABLET / MEDIUM-LARGE SCREEN */
@media only screen and (max-aspect-ratio:1000/764) {

  /* LOGIN */

  .login-form-section {
    padding: 10%;
  }

  .login-image-container {
    display: none;
  }

  .login-form-title {
    font-size: calc(var(--flexible-size)* 1.1);
  }

  .login-form-input-container label,
  .login-form-input {
    font-size: calc(var(--flexible-size)* .8);
  }

  .login-form-button {
    width: 60%;
  }
}

/* PHONE / SMALL SCREEN */
@media only screen and (max-aspect-ratio:594/764) {
  /* LOGIN */

  .login-form-section {
    padding: 0;
  }

  .login-form-container {
    width: 90%;
  }

  .login-form-title {
    font-size: calc(var(--flexible-size)* 1.5);
  }

  .login-form-input-container label,
  .login-form-input {
    font-size: calc(var(--flexible-size)* 1.2);
  }

  .login-form {
    width: 100%;
  }

  /* NAVBAR */
  .nav-title {
    font-size: calc(var(--flexible-size)* .8);
  }

  .nav {
    height: var(--nav-height-phone);
  }

}

/* ERROR PAGES */
.body-error {
  display: flex;
  justify-content: center;
  align-items: center;
}

.body-error .text-container {
  display: flex;
  flex-direction: column;
  align-items: center;

}

.body-error .text-container h1 {
  text-align: center;
  font-size: calc(var(--flexible-size)* 3);
  font-family: "BigCaslon";
  color: var(--project-green);
}

.body-error .error-text-red>h1 {
  color: var(--project-red);
}

bsa-checkbox {
  padding: min(.7vh, .7vw);
}

.bsa-checkbox-lb {
  width: max(1.7vh, 1.7vw);
  height: max(1.7vh, 1.7vw);
  border-radius: 50%;
  margin-right: min(1vh, 1vw);
  transition: .4s all;
}

.bsa-checkbox-lb[checked] {
  background-color: var(--project-beige);
  background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" stroke="white" fill="white" height="1em" viewBox="0 0 448 512"><path d="M438.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L160 338.7 393.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"/></svg>');
  background-repeat: no-repeat;
  background-position: center;
  border: calc(var(--flexible-size) * 0.06) solid var(--project-beige);
}

.bsa-checkbox-lb:not([checked]) {
  border: calc(var(--flexible-size) * 0.06) solid var(--project-beige);
}

.bsa-checkbox-input {
  font-size: calc(var(--flexible-size) * .7);
  color: black;
}

#mainUserContent,
#userForm {
  display: none;
}

.form-hint {
    font-size: 10px;
    margin-top: 2px;
    display: block;
    line-height: 1.2;
}