/* ==========================================================================
   FONTS
   ========================================================================== */

   @font-face {
    font-family: 'hurme_geometric_sans_3';
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    src: url('../fonts/hurmegeometricsans3-webfont.woff2') format('woff2'),
         url('../fonts/hurmegeometricsans3-webfont.woff') format('woff');
}

@font-face {
    font-family: 'hurme_geometric_sans_3semibold';
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    src: url('../fonts/hurmegeometricsans3-semibold-webfont.woff2') format('woff2'),
         url('../fonts/hurmegeometricsans3-semibold-webfont.woff') format('woff');
}

@font-face {
    font-family: 'hurme_geometric_sans_3bold';
    font-style: normal;
    font-weight: normal;
    font-display: swap;
    src: url('../fonts/hurmegeometricsans3-bold-webfont.woff2') format('woff2'),
    url('../fonts/hurmegeometricsans3-bold-webfont.woff') format('woff');
    }



/* ==========================================================================
   VARIABLES
   ========================================================================== */
:root {
  --font-body: 'hurme_geometric_sans_3semibold', sans-serif;
  --font-strong: 'hurme_geometric_sans_3bold', sans-serif;
  --font-headers: 'hurme_geometric_sans_3semibold', sans-serif;
  --color-dark: #1D1E22;
  --color-white: #FFF;
  --color-gray: #979797;
  --color-primary: #CD7F31;
  --bg-dark: #1D1E22;
  --bg-white: #FFF;
  --bg-dark-green: #2F5C4F;
  --bg-light: #F9F1E8;
  --bg-light-gray: #F1F1F1;
  --bg-gray: #979797;
  --bg-primary: #CD7F31;
  --bg-blue: #935BDF;
  --bg-light-white: #f9f9f9;
  --border-radius: 4px;
  --border-radius-pill: 50rem;
  --border-light-gray: #E4E3DF;
  --border-color-input: #ced4da;
}


/* ==========================================================================
  General Styles
========================================================================== */
* {
    box-sizing: border-box;
    margin:0;
    padding:0;
}
body, html {
    height: 100%;
    width: 100%;
    position: relative;
    overflow-x: hidden; 
}
html {-webkit-font-smoothing: antialiased;}

body {
  background-color: var(--bg-light);
  color: var(--color-dark);
  padding-top: 56px;
}


a {
  color: var(--color-primary);
  text-decoration: none; 
  transition: all 0.3s ease-in-out; }

a:hover, a:focus {
  color: var(--color-primary);
  text-decoration: none;
  transition: all 0.3s ease-in-out; }

a:active {outline:none; outline-style:none;}
a:focus {outline:none; outline-style:none;}

body, input, textarea, select {
  font-family: var(--font-body);
  font-size: 16px!important;
  line-height: 21px!important;
}

main {
  padding: 1rem 0;
}

h1,h2,h3,h4 {
  font-family: var(--font-headers)
}


h1 {
  font-size: 2.5rem;
  line-height: 2.5rem;
  margin-bottom: 1.2rem;
}
h2 {
  font-size: 2rem;
  line-height: 2rem;
}

h3 {
  font-weight: 400;
  font-size: 1.3rem;
  line-height: 1.4rem;
}
h4 {
  font-size: 1.2rem;
  line-height: 1.2rem;
}
small {
  font-size: .875rem!important;
  line-height: .875rem !important;
}
strong {
  font-family: var(--font-strong);
}
.text-muted {
  color: var(--color-gray) !important;
}
.bg-gray {
  background-color: var(--bg-light-gray);
}
.btn {
  font-family: var(--font-headers);
  border-radius: var(--border-radius-pill);
  font-size: 1rem;
  line-height: 1.5;
  padding: 20px 30px;
  border: none!important;
  white-space: nowrap;
  min-width: 150px;
}

.btn.btn-sm {
  padding: 11px 22px 13px;
  min-width: 120px;
}
.btn.btn-xs {
  padding: 8px 16px;
  font-size: .8rem;
  min-width: 80px;
}

.btn svg {
  margin-left: 8px;
  display: inline-block;
  width: 1em;
  height: 1em;
  font-size: inherit;
  color: inherit;
  vertical-align: -0.15em;
  fill: currentColor;
}
.btn.icon-reverse svg {
  margin-left: 0px;
  margin-right: 8px;
}

.btn.btn-primary {
  color: var(--color-white);
  background-color: var(--bg-primary);
}
.btn.btn-primary svg {
  fill: var(--color-white);
}
.btn.btn-secondary {
  color: var(--color-dark);
  background-color: var(--bg-white);
}
.btn.btn-secoondary svg {
  fill: var(--color-dark);
}
.btn.btn-transparent {
  color: var(--color-white);
  background-color: transparent
}
.btn.btn-transparent svg {
  fill: var(--color-white);
}
.btn:focus {
  box-shadow: none;
}
.btn-link,
.btn-link:hover {
  color: var(--color-primary);
  text-decoration: none;
}
.btn-dark {
  background-color: var(--bg-dark);
  color: var(--color-white);
}
.btn-gray,
.btn-gray:hover {
  background-color: var(--bg-gray);
  color: var(--color-white);
}

.bg-dark .btn-link,
.bg-dark .btn-link:hover {
  color: var(--color-white);
  text-decoration: none;
}

.bg-light-white {
  background-color: var(--bg-light-white);
}

.btn.btn-action {
  padding: 6px 16px;
  background-color: var(--bg-white);
  border: 1px solid var(--border-color-input) !important;
  border-radius: var(--border-radius) !important;
  min-width: 100px;
  line-height: 21px;
}
.btn.btn-filter {
  background-image: url(../images/icon-filters.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-add {
  background-image: url(../images/icon-plus.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-download-document {
  background-image: url(../images/icon-document-download.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-download {
  background-image: url(../images/icon-arrow-download.svg);
  background-position: 16px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.icon-preview-document {
  background-image: url(../images/icon-eye.svg);
  background-position: 8px center;
  padding-left: 0px;
  background-repeat: no-repeat;
  min-width: 16px;
}
.btn.btn-preview-document {
  background-image: url(../images/icon-eye.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-print {
  background-image: url(../images/icon-printer.svg);
  background-position: 8px center;
  padding-left: 40px;
  background-repeat: no-repeat;
}
.btn.btn-dossier {
  background-image: url(../images/icon-dossier.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-share {
  background-image: url(../images/icon-share.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}
.btn.btn-delete {
  background-image: url(../images/icon-trash.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
  background-color: var(--bg-primary);
  border-color: var(--bg-primary);
  color: var(--color-white);
}
.btn.icon-btn{
  min-width: auto;
  padding-left: 0px;
}

.input-search {
  background-image: url(../images/icon-search.svg);
  background-position: 8px center;
  padding-left: 36px;
  background-repeat: no-repeat;
}

.input-date {
  background-image: url(../images/icon-input-datepicker.svg);
  background-position: 8px center;
  padding-left: 40px;
  background-repeat: no-repeat;
}
textarea {
  resize: none;
}
.form-control::-moz-placeholder {
  color: var(--color-gray);
  opacity: 1
}
.form-control::placeholder { 
  color: var(--color-gray);
  opacity: 1; 
}

.form-check-input {
  width: .8em;
  height: .8em;
  margin-top: .40em;
}

.badge.bg-available {
  border: 1px solid var(--border-light-gray);
  color: var(--color-dark);
  background-color: var(--bg-white);
}

.badge.bg-instalation {
  border: 1px solid var(--border-light-gray);
  color: var(--color-dark);
  background-color: var(--bg-light);
  font-size: 0.9rem;
  line-height: 1.5rem;
}
.bg-unavailable {
  background-color: var(--bg-dark);
  color: var(--bg-white);
}
.bg-booked {
  background-color: var(--bg-gray);
  color: var(--bg-white);
}
.bg-sold {
  background-color: var(--bg-primary);
  color: var(--bg-white);
}
.bg-paid {
  background-color: var(--bg-blue);
  color: var(--bg-white);
}
.badge.bg-promo {
  background-color: #CD7F31;
  color: var(--color-white);
}
.badge.bg-paid {
  background-color: #935BDF;
  color: var(--color-white);
}


hr {
  border-top: 1px solid var(--border-light-gray);
  margin: 2rem 0;
  opacity: 1;
}
.alert {
  font-family: var(--font-headers);
}
.alert-dark {
  background-color: var(--bg-dark);
  color: var(--color-white);
}
.alert-dark div {
  background-image: url(../images/icon-check-ok.svg);
  background-repeat: no-repeat;
  background-position: 0 1px;
  padding-left: 30px;
}

.icon-min-info {
  background-image: url(../images/icon-info.svg);
  background-repeat: no-repeat;
  background-size: 16px;
  background-position: 0 4px;
  padding-left: 24px;
}

.position-card-top-right {
  position: absolute;
  right: 8px;
  top: 8px;
}
.position-card-top-left {
  position: absolute;
  left: 8px;
  top: 8px;
}

.card-grid .card-grid-lg {
  height: 400px;
}
.card-grid .card-grid-sm {
  height: calc(200px - var(--bs-gutter-y) / 2);
}

@media (max-width: 767.98px) {
  .card-grid .card-grid-lg {
    height: 320px;
  }
}

.glightbox-clean .gslide-title {
  font-family: var(--font-headers) !important;
  margin-bottom: 0!important;
}

.info-section {
  padding-left: 50px;
  background-position: left 8px;
  background-repeat: no-repeat;
}
.info-section h3 {
  font-size: 1.2rem;
  color: var(--color-gray);
}
.info-section p{
  font-size: .9rem;
  line-height: 1.1rem;
}
.info-section.icon-info {
  background-image: url(../images/icon-info.svg);
  background-size: 32px;
}
.info-section.icon-map {
  background-image: url(../images/icon-location.svg);
}
.info-section.icon-materials {
  background-image: url(../images/icon-materials.svg);
}
.info-section.icon-calendar {
  background-image: url(../images/icon-calendar.svg);
}

.container-video {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.video-iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

@media (min-width: 768px) {
  main {
    padding: 2rem 0;
  }
  h1 {
    font-size: 3rem;
    line-height: 3rem;
  }
  h2 {
    font-size: 2rem;
    line-height: 2rem;
  }
  h3 {
    font-size: 1.5rem;
    line-height: 1.5rem;
  }
  p.lead {
    font-size: 1.2rem;
    line-height: 2rem;
  }
}

/* ==========================================================================
  TABS
========================================================================== */

.nav-tabs {
  --bs-nav-tabs-border-width: 0.0625rem;
  --bs-nav-tabs-border-color: var(--border-light-gray);
  --bs-nav-tabs-border-radius: 0;
  --bs-nav-tabs-link-hover-border-color: var(--border-light-gray);
  --bs-nav-tabs-link-active-color: #CD7F31;
  --bs-nav-tabs-link-active-bg: transparent;
  --bs-nav-tabs-link-active-border-color: #CD7F31;
  border-bottom: var(--bs-nav-tabs-border-width) solid var(--bs-nav-tabs-border-color)
}

.nav-tabs .nav-link {
  margin-bottom: calc(var(--bs-nav-tabs-border-width) * -1);
  background: 0 0;
  border: var(--bs-nav-tabs-border-width) solid transparent;
  border-top-left-radius: var(--bs-nav-tabs-border-radius);
  border-top-right-radius: var(--bs-nav-tabs-border-radius);
  color: var(--color-dark);
}

.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover {
  isolation: isolate;
  border-color: var(--bs-nav-tabs-link-hover-border-color)
}

.nav-tabs .nav-link.disabled,.nav-tabs .nav-link:disabled {
  color: var(--bs-nav-link-disabled-color);
  background-color: transparent;
  border-color: transparent
}

.nav-tabs .nav-item.show .nav-link,.nav-tabs .nav-link.active {
  color: var(--bs-nav-tabs-link-active-color);
  background-color: var(--bs-nav-tabs-link-active-bg);
  border-color: var(--bs-nav-tabs-link-active-border-color)
}

.nav-tabs .nav-link {
  border-top-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  border-bottom: .1875rem solid transparent;
  margin-bottom: -.125rem
}

.nav-tabs .nav-link .nav-item.show .nav-link,.nav-tabs .nav-link.active,.nav-tabs .nav-link:focus,.nav-tabs .nav-link:hover {
  border-top-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent
}

.nav-tabs .nav-item.show .nav-link {
  color: var(--color-dark)
  border-color: transparent
}

.nav-tabs .nav-item.show .nav-link:hover {
  color: var(--color-primary)
}

.nav-tabs .nav-item.show .nav-link.active {
  color: var(--color-primary)
}

.nav-tabs:not(.nav-vertical) .nav-link {
  padding-top: 1.25rem;
  padding-bottom: 1.25rem;
  padding-left: 0.9rem;
  padding-right: 0.9rem;
}

/* ==========================================================================
  HEADER/NAV
========================================================================== */

.navbar-nav .nav-link {
  font-family: var(--font-headers);
}

.account-link {
  color: var(--color-white) !important;
  background-color: var(--bg-primary) !important;
  font-family: var(--font-headers);
  width: 40px;
  line-height: 40px;
  border-radius: 50%;
  text-align: center;
  display: inline-block;
}

@media (min-width: 992px) {
  .navbar {
    padding-top: 0;
    padding-bottom: 0;
  }
  .navbar-nav .nav-link {
    padding-top: 1rem;
    padding-bottom: 1rem;
  }
  body#stock .navbar-nav li:nth-child(1) a,
  body#booking .navbar-nav li:nth-child(2) a,
  body#sales .navbar-nav li:nth-child(3) a,
  body#config .navbar-nav li:nth-child(5) a, 
  body#invoices .navbar-nav li:nth-child(4) a, 
  body#help .navbar-nav li:nth-child(6) a 
  {
    color: var(--color-primary);
    border-bottom: 5px solid var(--bg-primary);
  }
  .navbar-expand-lg .navbar-nav .nav-link {
      padding-right: 1.2rem;
      padding-left: 1.2rem;
  }
}

/* ==========================================================================
  OFFCANVAS
========================================================================== */
button.navbar-toggler:focus { 
  outline: none;
  box-shadow: none;
 }

 .offcanvas-title {
  font-family: var(--font-headers);
 }

@media (min-width: 768px) {
  .offcanvas {
    width: 70vw !important;
  }
  .offcanvas.offcanvas-filters {
    width: 400px !important;
  }
  .offcanvas.offcanvas-contract {
    width: 720px !important;
  }
}
@media (min-width: 992px) {
  .offcanvas {
    width: 50vw !important;
  }
  .offcanvas.offcanvas-filters {
    width: 400px !important;
  }
}
@media (min-width: 1200px) {
  .offcanvas {
    width: 45vw !important;
  }
  .offcanvas.offcanvas-filters {
    width: 400px !important;
  }
  
}


@media (max-width: 991.98px) {
  .offcanvas-collapse {
    position: fixed;
    top: 52px; /* Height of navbar */
    bottom: 0;
    left: 100%;
    width: 100%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: var(--bg-white);
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
  }
  .offcanvas-collapse.open {
    visibility: visible;
    transform: translateX(-100%);
  }
}

.nav-scroller .nav {
  color: rgba(255, 255, 255, .75);
}

.nav-scroller .nav-link {
  padding-top: .75rem;
  padding-bottom: .75rem;
  font-size: .875rem;
  color: #6c757d;
}

.nav-scroller .nav-link:hover {
  color: #007bff;
}

.nav-scroller .active {
  font-weight: 500;
  color: #343a40;
}

/* ==========================================================================
  TABLES
========================================================================== */

.table th {
  font-size: .9rem;
  color: var(--color-gray);
  background-color: var(--bg-light-gray);
}

.table>:not(caption)>*>* {
  padding: 1rem .5rem;
}

.modal .table th {
  font-size: .9rem;
  color: var(--color-gray);
  background-color: var(--bg-white);
}

.table-responsive-lg .table th.icon {
  max-width: 24px;  
}


.table-responsive-lg .table th.info {
  min-width: 180px;  
}

.table-responsive-lg.sales-open .table th.info {
  min-width: 130px;  
}



.mini-cover-stock {
  background-color: var(--bg-dark);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  border-radius: var(--border-radius);
  display: inline-block;
  width: 48px;
  height: 48px;
  position: relative;
}
.mini-cover-stock .favorite {
  position: absolute;
  top: -6px;
  right: -6px;
}
.dropdown-menu {
  box-shadow: 0 .6125rem 2.5rem .6125rem rgba(140,152,164,.175);
}
.dropdown-toggle.caret-off::before {
  display: none !important;
}
.dropdown-toggle.caret-off::after {
  display: none !important;
}
.dropdown-item {
  font-size: .9rem;
}
.hiddenRow {
  padding: 0 !important;
}
.rotate {
  transform: rotateZ(-180deg);
}

/* ==========================================================================
  LOGIN
========================================================================== */
.bg-login {
  background-color: var(--bg-dark);
}
.carousel-caption {
  right: 0;
  bottom: 0;
  left: 0;
  padding-left: 2.5rem;
  text-align: left;
}
.carousel-caption h5 {
  font-size: 14px;
  font-family: var(--font-headers);
  text-transform: uppercase;
}
.carousel-caption p {
  font-family: var(--font-headers);
  font-size: 18px;
}
.form-login {
  width: 100%;
  max-width: 420px;
  margin: 0 auto;
}
.form-login p {
  font-family: var(--font-headers);
  color: var(--color-gray);
}
.showpass {
  position: absolute;
  right: 8px;
  top: 8px;
  width: 24px;
  height: 24px;
  display: block;
  background: transparent url(../images/icon-eye.svg) no-repeat center;
}
.showpass.active {
  background: transparent url(../images/icon-eye-off.svg) no-repeat center;
}
.form-label {
  font-family: var(--font-headers);
  color: var(--color-gray);
  font-size: 1rem;
  margin-bottom: .2rem;
}
.form-control {
  border-radius: var(--border-radius);
  font-size: 1rem !important;
  font-family: var(--font-headers);
}
.form-control:focus,
.form-select:focus {
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.form-login a{
  font-family: var(--font-headers);
  color: var(--bg-primary);
}

/* ==========================================================================
  STEPS
========================================================================== */

.step {
  position: relative;
  list-style: none;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
  margin-right: calc(1.5rem / -2);
  margin-left: calc(1.5rem / -2)
}


.step-title {
  display: block;
  color: var(--color-gray);
  font-weight: 600
}


.step .step-item {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
  padding-right: .75rem;
  padding-left: .75rem;
  margin-bottom: 2.25rem
}


.step .step-content-wrapper {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  width: 100%
}

.step .step-content {
  -ms-flex: 1;
  flex: 1
}

.step .step-icon {
  display: -ms-inline-flexbox;
  display: inline-flex;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  -ms-flex-pack: center;
  justify-content: center;
  -ms-flex-align: center;
  align-items: center;
  font-size: .875rem;
  font-weight: 600;
  width: 2.625rem;
  height: 2.625rem;
  border-radius: 50%;
  margin-right: 1rem
}

.step .step-icon::after {
  position: absolute;
  top: 3.375rem;
  left: 1.3125rem;
  height: calc(100% - 1.875rem);
  border-left: .125rem solid rgba(231,234,243,.7);
  content: ""
}

@media (min-width: 576px) {

  .step-sm .step-item {
      -ms-flex-positive: 1;
      flex-grow: 1;
      -ms-flex: 1;
      flex: 1;
      margin-bottom: 0
  }

  .step-sm:not(.step-inline) .step-content-wrapper {
      display: block
  }

  .step-sm .step-icon {
      margin-bottom: 1rem
  }

  .step-sm .step-icon::after {
      top: 1.3125rem;
      left: 4.125rem;
      width: calc(100% - 4.125rem);
      height: 1.625rem;
      border-top: .125rem solid rgba(231,234,243,.7);
      border-left: none
  }

  .step-sm .step-icon.step-icon-xs::after,.step-sm.step-icon-xs .step-icon::after {
      top: .765625rem;
      left: 3.03125rem;
      width: calc(100% - 3.03125rem)
  }

  .step-sm .step-icon.step-icon-sm::after,.step-sm.step-icon-sm .step-icon::after {
      top: 1.203125rem;
      left: 3.90625rem;
      width: calc(100% - 3.90625rem)
  }

  .step-sm .step-icon.step-icon-lg::after,.step-sm.step-icon-lg .step-icon::after {
      top: 2.40625rem;
      left: 6.3125rem;
      width: calc(100% - 6.3125rem)
  }
}


@media (min-width: 768px) {
  .step-md .step-item {
      -ms-flex-positive: 1;
      flex-grow: 1;
      -ms-flex: 1;
      flex: 1;
      margin-bottom: 0
  }

  .step-md:not(.step-inline) .step-content-wrapper {
      display: block
  }

  .step-md .step-icon {
      margin-bottom: 1rem
  }

  .step-md .step-icon::after {
      top: 1.3125rem;
      left: 4.125rem;
      width: calc(100% - 4.125rem);
      height: 1.625rem;
      border-top: .125rem solid rgba(231,234,243,.7);
      border-left: none
  }
}


.step .active .step-icon,.step .active.is-valid .step-icon,.step .visited .step-icon {
  color: #fff;
  background-color: var(--bg-primary)
}

.step .active .step-title,.step .active.is-valid .step-title,.step .visited .step-title {
  color: var(--color-primary)
}


.step-icon-primary {
  color: #fff;
  background-color: var(--bg-gray);
}

.step-icon-primary.step-icon-pseudo::before {
  background-color: #fff
}

.step-inline .step-content-wrapper {
  -ms-flex-align: center;
  align-items: center
}

.step-inline .step-item:last-child .step-title::after {
  display: none
}

.step-inline .step-title {
  display: inline-block
}


@media (min-width: 576px) {

  .step-sm.step-inline .step-item {
      overflow: hidden
  }

  .step-sm.step-inline .step-icon {
      margin-bottom: 0
  }

  .step-sm.step-inline .step-icon::after {
      display: none
  }

  .step-sm.step-inline .step-title::after {
      position: absolute;
      top: 1.3125rem;
      width: 100%;
      height: 1.625rem;
      border-top: .125rem solid var(--bg-gray);
      margin-left: 1.5rem;
      content: ""
  }
}

@media (min-width: 768px) {

  .step-md.step-inline .step-item {
      overflow: hidden
  }

  .step-md.step-inline .step-icon {
      margin-bottom: 0
  }

  .step-md.step-inline .step-icon::after {
      display: none
  }

  .step-md.step-inline .step-title::after {
      position: absolute;
      top: 1.3125rem;
      width: 100%;
      height: 1.625rem;
      border-top: .125rem solid var(--bg-gray);
      margin-left: 1.5rem;
      content: ""
  }

}


/* ==========================================================================
  DATERANGEPICKER
========================================================================== */

.daterangepicker-custom-input {
  cursor: pointer
}

.daterangepicker-wrapper {
  border: none;
  padding: 0;
  cursor: pointer
}

.daterangepicker {
  border: none;
  font-family: Inter,sans-serif;
  z-index: 3001;
  background-color: #fff;
  box-shadow: 0 .6125rem 2.5rem .6125rem rgba(140,152,164,.175);
  margin-top: 0;
  border-radius: .75rem
}

.daterangepicker.opensright::after,.daterangepicker.opensright::before {
  left: 1rem
}

.daterangepicker::after,.daterangepicker::before {
  top: 0;
  border-bottom-color: #fff;
  border-bottom-width: 0
}

.daterangepicker.drop-up::before {
  border-top-color: #fff
}

.daterangepicker .drp-calendar {
  max-width: 18.75rem
}

.daterangepicker .drp-calendar.left {
  padding: 1rem 1rem
}

.daterangepicker .drp-calendar.right {
  padding: 1rem 1rem
}

.daterangepicker th.next,.daterangepicker th.prev {
  min-width: auto;
  width: 2.40625rem;
  height: 2.40625rem;
  color: #377dff;
  font-size: .875rem;
  border-radius: 50%
}

.daterangepicker th.next:hover,.daterangepicker th.prev:hover {
  background-color: rgba(55,125,255,.1)
}

.daterangepicker th.next:hover .daterangepicker-custom-arrow,.daterangepicker th.prev:hover .daterangepicker-custom-arrow {
  color: #377dff
}

.daterangepicker .calendar-table {
  background-color: #fff;
  border-width: 0
}

.daterangepicker .calendar-table table {
  border-collapse: separate;
  border-spacing: 0 .25rem
}

.daterangepicker .calendar-table th:not(.month) {
  color: #97a4af;
  font-weight: 600;
  text-transform: uppercase
}

.daterangepicker .calendar-table th.month {
  font-size: .875rem;
  font-weight: 600
}

.daterangepicker .calendar-table td {
  min-width: 2.40625rem;
  width: 2.40625rem;
  height: 2.40625rem;
  font-size: .875rem;
  line-height: 2.15625rem
}

.daterangepicker .calendar-table .next span,.daterangepicker .calendar-table .prev span {
  border-color: #677788
}

.daterangepicker .calendar-table .next:hover span,.daterangepicker .calendar-table .prev:hover span {
  border-color: #377dff
}

.daterangepicker td.available:not(.in-range) {
  border-radius: 50%
}

.daterangepicker td.available:hover:not(.active) {
  color: #377dff;
  background-color: rgba(55,125,255,.1)
}

.daterangepicker td.in-range {
  color: #677788;
  background-color: rgba(231,234,243,.5)
}

.daterangepicker td.active.start-date.end-date,.daterangepicker td.today.start-date.end-date {
  border-radius: 50%
}

.daterangepicker td.active,.daterangepicker td.active:hover {
  color: #fff;
  background-color: #377dff
}

.daterangepicker td.active.start-date {
  border-top-right-radius: 0;
  border-bottom-right-radius: 0;
  border-top-left-radius: 50rem;
  border-bottom-left-radius: 50rem
}

.daterangepicker td.active.end-date {
  border-top-right-radius: 50rem;
  border-bottom-right-radius: 50rem;
  border-top-left-radius: 0;
  border-bottom-left-radius: 0
}

.daterangepicker td.off,.daterangepicker td.off.end-date,.daterangepicker td.off.in-range,.daterangepicker td.off.start-date {
  color: #bdc5d1;
  background-color: transparent
}

.daterangepicker .drp-buttons,.daterangepicker.show-ranges.ltr .drp-calendar.left {
  border-color: rgba(231,234,243,.7)
}

.daterangepicker .drp-buttons {
  padding: 1rem 1rem
}

.daterangepicker .drp-buttons .btn {
  font-size: .875rem;
  font-weight: 400;
  padding: .6125rem 1rem
}

.daterangepicker .cancelBtn {
  background-color: #fff;
  border-color: rgba(231,234,243,.7)
}

.daterangepicker .cancelBtn.active,.daterangepicker .cancelBtn:active,.daterangepicker .cancelBtn:focus,.daterangepicker .cancelBtn:hover {
  color: #1366ff;
  box-shadow: 0 3px 6px -2px rgba(140,152,164,.25)
}

.daterangepicker .drp-selected {
  color: #71869d
}

.daterangepicker .ranges ul {
  min-width: 10rem;
  padding-top: .5rem;
  padding-bottom: .5rem
}

.daterangepicker .ranges li {
  color: #677788;
  font-size: .875rem;
  line-height: 1.5;
  border-radius: .3125rem;
  padding: .5rem 1rem;
  margin-left: .625rem;
  margin-right: .625rem
}

.daterangepicker .ranges li:hover {
  color: #1366ff;
  background-color: transparent
}

.daterangepicker .ranges li.active {
  color: #377dff;
  background-color: rgba(55,125,255,.1)
}

.daterangepicker select.ampmselect,.daterangepicker select.hourselect,.daterangepicker select.minuteselect,.daterangepicker select.secondselect {
  cursor: pointer;
  width: 3.5rem;
  font-size: .8125rem;
  color: #1e2022;
  background-color: transparent;
  border-color: rgba(231,234,243,.7);
  padding: .25rem .25rem;
  border-radius: .5rem
}

.daterangepicker select.ampmselect:hover,.daterangepicker select.hourselect:hover,.daterangepicker select.minuteselect:hover,.daterangepicker select.secondselect:hover {
  color: #1366ff
}

@media (max-width: 776.98px) {
  .daterangepicker {
      width:auto;
      max-width: 19rem
  }

  .daterangepicker .drp-calendar {
      max-width: 100%
  }

  .daterangepicker .drp-calendar,.daterangepicker .ranges {
      float: none
  }

  .daterangepicker .ranges ul {
      width: 100%;
      margin: 0
  }

  .daterangepicker .drp-selected {
      display: block;
      margin-bottom: 1rem
  }
}

/* ==========================================================================
  PAGINATION
========================================================================== */

.pagination {
  --bs-pagination-padding-x: 0.75rem;
  --bs-pagination-padding-y: 0.375rem;
  --bs-pagination-font-size: 0.875rem;
  --bs-pagination-color: #677788;
  --bs-pagination-bg: #fff;
  --bs-pagination-border-width: 0;
  --bs-pagination-border-color: #e7eaf3;
  --bs-pagination-border-radius: 0.3125rem;
  --bs-pagination-hover-color: var(--color-dark);
  --bs-pagination-hover-bg: #f8fafd;
  --bs-pagination-hover-border-color: #e7eaf3;
  --bs-pagination-focus-color: var(--bs-link-hover-color);
  --bs-pagination-focus-bg: #f8fafd;
  --bs-pagination-focus-box-shadow: 0 0 1rem 0 rgba(140, 152, 164, 0.25);
  --bs-pagination-active-color: #fff;
  --bs-pagination-active-bg: var(--bg-primary);
  --bs-pagination-active-border-color: var(--bg-primary);
  --bs-pagination-disabled-color: #8c98a4;
  --bs-pagination-disabled-bg: #fff;
  --bs-pagination-disabled-border-color: #e7eaf3;
  display: -ms-flexbox;
  display: flex;
  padding-left: 0;
  list-style: none
}

.page-link {
  position: relative;
  display: block;
  padding: var(--bs-pagination-padding-y) var(--bs-pagination-padding-x);
  font-size: var(--bs-pagination-font-size);
  color: var(--bs-pagination-color);
  background-color: var(--bs-pagination-bg);
  border: var(--bs-pagination-border-width) solid var(--bs-pagination-border-color);
  transition: color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

@media (prefers-reduced-motion:reduce) {
  .page-link {
      transition: none
  }
}

.page-link:hover {
  z-index: 2;
  color: var(--bs-pagination-hover-color);
  background-color: var(--bs-pagination-hover-bg);
  border-color: var(--bs-pagination-hover-border-color)
}

.page-link:focus {
  z-index: 3;
  color: var(--bs-pagination-focus-color);
  background-color: var(--bs-pagination-focus-bg);
  outline: 0;
  box-shadow: var(--bs-pagination-focus-box-shadow)
}

.active>.page-link,.page-link.active {
  z-index: 3;
  color: var(--bs-pagination-active-color);
  background-color: var(--bs-pagination-active-bg);
  border-color: var(--bs-pagination-active-border-color)
}

.disabled>.page-link,.page-link.disabled {
  color: var(--bs-pagination-disabled-color);
  pointer-events: none;
  background-color: var(--bs-pagination-disabled-bg);
  border-color: var(--bs-pagination-disabled-border-color)
}

.page-item:not(:first-child) .page-link {
  margin-left: 0
}

.page-item:first-child .page-link {
  border-top-left-radius: var(--bs-pagination-border-radius);
  border-bottom-left-radius: var(--bs-pagination-border-radius)
}

.page-item:last-child .page-link {
  border-top-right-radius: var(--bs-pagination-border-radius);
  border-bottom-right-radius: var(--bs-pagination-border-radius)
}


/* ==========================================================================
  TABS SCROLLER
========================================================================== */

.hs-nav-scroller-horizontal {
  position: relative
}

.hs-nav-scroller-horizontal .nav {
  overflow-x: auto;
  overflow-y: hidden;
  -ms-flex-wrap: nowrap;
  flex-wrap: nowrap;
  white-space: nowrap;
  scroll-behavior: smooth
}

.hs-nav-scroller-horizontal .nav .nav-item {
  white-space: nowrap
}

.hs-nav-scroller-horizontal .nav .nav-link {
  white-space: nowrap
}

.hs-nav-scroller-horizontal .nav::-webkit-scrollbar {
  display: none
}

.hs-nav-scroller-horizontal .nav-tabs {
  padding-bottom: .125rem
}

/* ==========================================================================
  ERRORS
========================================================================== */

small.is-invalid{
  width: 100%;
  margin-top: 0.25rem;
  color: #dc3545;
}

/* #booking .card img{
  max-height: 150px;
} */

/* ==========================================================================
  PÁGINA COLUMBARIOS
========================================================================== */
.title-columbarios {
  font-size: 32px;
  font-weight: 600;
  line-height: normal;
}

.text-columbarios {
  padding: 15px 0;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.14;
  color: #979797;
  font-family: 'hurme_geometric_sans_3';
}

.help-intro{
  font-size: 14px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.5;
  letter-spacing: normal;
  color: #979797;
}

.help-category-title{
  font-size: 21px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: normal;
  letter-spacing: normal;
  color: #22252b;
}

.help-category ul{
  margin-top: 7px;
}
.help-category ul li{
  font-size: 16px;
  font-weight: 600;
  font-stretch: normal;
  font-style: normal;
  line-height: 2;
  letter-spacing: normal;
  color: #22252b;
  background-image: url(../images/icon-text.svg);
  background-position: 8px center;
  padding-left: 35px;
  background-repeat: no-repeat;
}

.help-category a{
  color: #22252b;
}

.help-section-title{
  font-size: 21px;
  line-height: 32px;
  color: #22252b;
  background-size: 20px;
  background-image: url(../images/icon-text.svg);
  background-position: 8px center;
  padding-left: 35px;
  background-repeat: no-repeat;
}
.help-section-content{
  font-size: 14px;
  line-height: 24px;
  color: #22252b;
  padding-left: 35px;
}

.icon-cards{
  padding-left:10px;
}

.icon-cards img{
  padding: 0px 5px;
}

.table-col-canvas{
  margin: 0 auto;
}

 .table-col-canvas td{
  vertical-align: middle;
  /* font-size: .9rem;
  color: var(--color-gray);
  background-color: var(--bg-light-gray); */
} 

#alert-modal-columbarium .modal-dialog {
  max-width: 800px;
}

.modal-content {
  width: 100%;
  overflow-x: auto;
}

.badge.badge-legend{
  width: 15px;
  display: inline-block;
  height: 15px;
}

/* Estilos generales para hacer el modal más flexible */
.modal-fullwidth {
  max-width: 100%;
}

.modal-content {
  width: 100%;
  overflow-x: auto;
}

/* Ajustes específicos para la tabla en pantallas pequeñas */
@media (max-width: 768px) {
  .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .table-col-canvas {
    min-width: 600px; /* o el ancho mínimo que necesite la tabla */
  }

  .modal-body {
    padding: 1rem;
  }

  .modal-title {
    font-size: 1.2rem;
    text-align: left;
  }
}

.breadcrumb-item, .breadcrumb-item a{
  color: #6c757d;
}

.breadcrumb-item.active, .breadcrumb-item.active a {
  color: var(--color-primary)
}
/* CSS MODAL COLUMNARIOS*/
.responsive-table {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.table-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  border: 1px solid #ddd;
  border-radius: 0.5rem;
  padding: 1rem;
  background: white;
}

.table-header {
  display: none;
}

.cell {
  flex: 1 1 45%;
  margin-bottom: 0.5rem;
}

.cell::before {
  content: attr(data-label) ": ";
  font-weight: bold;
  display: inline-block;
}

.cell.no-label::before {
  content: none;
}

/* En pantallas grandes: formato tabla clásica */
@media (min-width: 768px) {
  .responsive-table {
    display: table;
    width: 100%;
    border-collapse: collapse;
  }

  .table-row {
    display: table-row;
    border: none;
    padding: 0;
  }

  .table-header {
    display: table-header-group;
    font-size: .9rem;
    color: var(--color-gray);
    background-color: var(--bg-white);
  }

  .cell {
    display: table-cell;
    padding: 0.75rem;
    margin: 0;
    /* border-bottom: 1px solid #ccc; */
  }

  .cell::before {
    content: none;
  }
}

.input-group-text {
  padding:0.5rem .75rem!important;
}

.concept-form{
  overflow: hidden;
  padding-bottom: 80px!important;
}

/* SWITCH */
legend {
  font-family: var(--font-headers);
  color: var(--color-gray);
  font-size: 1rem;
  margin-bottom: .2rem;
}

input[data-switch] {
    display: none
}

input[data-switch]+label {
    width: 56px;
    height: 24px;
    background-color: #eaeef2;
    background-image: none;
    border-radius: 2rem;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    position: relative;
    margin-top: .5rem;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

input[data-switch]+label.header {
    margin-left: 10px;
    margin-top: 0;
    background-color: #FFFFFF;
}

input[data-switch]+label.private {
    width: 75px;
    text-transform: capitalize;
    margin-top: -2px;
    margin-left: 10px;
}
input[data-switch]+label.private.file {
    margin-right: 10px;
    margin-left: 0;
}
input[data-switch]+label.private.visit {
  margin-top: -15px;
  margin-bottom: -5px;
}

input[data-switch]+label:before {
    color: #313a46;
    content: attr(data-off-label);
    display: block;
    font-family: inherit;
    font-weight: 600;
    font-size: .75rem;
    line-height: 24px;
    position: absolute;
    right: 3px;
    margin: 0 .21667rem;
    top: 0;
    text-align: center;
    min-width: 1.66667rem;
    overflow: hidden;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

input[data-switch]+label:after {
    content: '';
    position: absolute;
    left: 4px;
    background-color: #adb5bd;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 2rem;
    height: 18px;
    width: 18px;
    top: 3px;
    -webkit-transition: all .1s ease-in-out;
    transition: all .1s ease-in-out
}

input[data-switch]:checked+label {
    background-color: #727cf5
}

input[data-switch]:checked+label:before {
    color: #fff;
    content: attr(data-on-label);
    right: auto;
    left: 4px
}

input[data-switch]:checked+label:after {
    left: 34px;
    background-color: #f1f3fa
}

input[data-switch]:checked+label.private:after {
    left: 54px;
}

input[data-switch=bool]+label {
    background-color: #fa5c7c
}

input:disabled+label {
    opacity: .5;
    cursor: default
}

input[data-switch=bool]+label:before,input[data-switch=bool]:checked+label:before {
    color: #fff!important
}

input[data-switch=bool]+label:after {
    background-color: #f1f3fa
}

input[data-switch=primary]:checked+label {
    background-color: var(--bg-primary)
}

input[data-switch=secondary]:checked+label {
    background-color: #6c757d
}

input[data-switch=success]:checked+label {
    background-color: #0acf97
}

input[data-switch=info]:checked+label {
    background-color: #39afd1
}

input[data-switch=warning]:checked+label {
    background-color: #ffbc00
}

input[data-switch=danger]:checked+label {
    background-color: #fa5c7c
}

input[data-switch=light]:checked+label {
    background-color: #eef2f7
}

input[data-switch=dark]:checked+label {
    background-color: #313a46
}
.paddding-icon-right {
  padding-right: 30px;
}
.icon-append-input {
  position: absolute;
  right: 8px;
  bottom: 9px;
}