@font-face {
  font-family: 'airbnb-l'; /* Name of your font */
  src: url('../fonts/AirbnbCereal_W_Lt.otf') format('truetype'); /* Corrected path and format */
}

@font-face {
  font-family: 'airbnb-md'; /* Name of your font */
  src: url('../fonts/AirbnbCereal_W_Md.otf') format('truetype'); /* Corrected path and format */
}


.homedropdown .btn-outline-primary.dropdown-toggle:visited, .btn-outline-primary.dropdown-toggle.show  {
  color: #fff;
  background: #36ad95;
}

.homedropdown .btn-primary, .btn.bg-gradient-primary {
  box-shadow: none !important;
}


@media (min-width: 992px) {
  .homedropdown .dropdown-menu, .dropup .dropdown-menu, .dropstart .dropdown-menu, .dropend .dropdown-menu {
      box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgb(50 50 50);
      transition: visibility 0.25s, opacity 0.25s, transform 0.25s;
      cursor: pointer;
  }
}



/*!
Simple-dataTabless
Github: https://github.com/fiduswriter/Simple-dataTabless
*/

.dataTables_wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
}

.table-responsive {
  overflow-x: visible;
  -webkit-overflow-scrolling: touch;
}

table td{
  text-wrap: wrap !important;
}

.dataTables_wrapper.no-header .dataTables_wrapper div:nth-child(2) {
  border-top: 1px solid #d9d9d9;
}

.dataTables_wrapper.no-footer .dataTables_wrapper div:nth-child(2) {
  border-bottom: 1px solid #d9d9d9;
}

.dataTables_wrapper div:nth-child(1), .dataTables_wrapper div:nth-child(3) {
  padding: 8px 10px; }

.dataTables_wrapper div:nth-child(3) .dataTables_info {
    padding: 8px 10px 8px 0px !important;
}


.dataTables_wrapper div:nth-child(3) .dataTables_paginate {
  float:right;
}

.dataTables_wrapper div:nth-child(2) table{
  width: 100% !important;
}

  .dataTables_wrapper div:nth-child(1) > nav:first-child,
  .dataTables_wrapper div:nth-child(1) > div:first-child,
  .dataTables_wrapper div:nth-child(3) > nav:first-child,
  .dataTables_wrapper div:nth-child(3) > div:first-child {
  float: left; }

  .dataTables_wrapper div:nth-child(1) > nav:last-child,
  .dataTables_wrapper div:nth-child(1) > div:last-child,
  .dataTables_wrapper div:nth-child(3) > nav:last-child,
  .dataTables_wrapper div:nth-child(3) > div:last-child {
  float: left; }

.dataTables-selector {
  padding: 6px; }

.dataTables-input {
  padding: 6px 12px; }

.dataTabless_info {
  margin: 7px 0; }

/* PAGER */
.dataTables-pagination ul {
  margin: 0;
  padding-left: 0; }

.dataTables-pagination li {
  list-style: none;
  float: left; }

.dataTables-pagination a {
  border: 1px solid transparent;
  float: left;
  margin-left: 2px;
  padding: 6px 12px;
  position: relative;
  text-decoration: none;
  color: #333; }

.dataTables-pagination a:hover {
  background-color: #d9d9d9; }

.dataTables-pagination .active a,
.dataTables-pagination .active a:focus,
.dataTables-pagination .active a:hover {
  background-color: #d9d9d9;
  cursor: default; }

.dataTables-pagination .ellipsis a,
.dataTables-pagination .disabled a,
.dataTables-pagination .disabled a:focus,
.dataTables-pagination .disabled a:hover {
  cursor: not-allowed; }

.dataTables-pagination .disabled a,
.dataTables-pagination .disabled a:focus,
.dataTables-pagination .disabled a:hover {
  cursor: not-allowed;
  opacity: 0.4; }

.dataTables-pagination .pager a {
  font-weight: bold; }

/* TABLE */
.dataTables-table {
  max-width: 100%;
  width: 100%;
  border-spacing: 0;
  border-collapse: separate; }

.dataTables-table > tbody > tr > td,
.dataTables-table > tbody > tr > th,
.dataTables-table > tfoot > tr > td,
.dataTables-table > tfoot > tr > th,
.dataTables-table > thead > tr > td,
.dataTables-table > thead > tr > th {
  vertical-align: top;
  padding: 8px 10px; }

.dataTables-table > thead > tr > th {
  vertical-align: bottom;
  text-align: left;
  border-bottom: 1px solid #d9d9d9; }

.dataTables-table > tfoot > tr > th {
  vertical-align: bottom;
  text-align: left;
  border-top: 1px solid #d9d9d9; }

.dataTables-table th {
  vertical-align: bottom;
  text-align: left; }

.dataTables-table th a {
  text-decoration: none;
  color: inherit; }

.dataTables-sorter {
  display: inline-block;
  height: 100%;
  position: relative;
  width: 100%; }

.dataTables-sorter::before,
.dataTables-sorter::after {
  content: "";
  height: 0;
  width: 0;
  position: absolute;
  right: 4px;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  opacity: 0.2; }

.dataTables-sorter::before {
  border-top: 4px solid #000;
  bottom: 0px; }

.dataTables-sorter::after {
  border-bottom: 4px solid #000;
  border-top: 4px solid transparent;
  top: 0px; }

.asc .dataTables-sorter::after,
.desc .dataTables-sorter::before {
  opacity: 0.6; }

.dataTabless-empty {
  text-align: center; }

  .dataTables_wrapper div:nth-child(1)::after, .dataTables_wrapper div:nth-child(3)::after {
  clear: both;
  content: " ";
  display: table; }

/*!
Simple-dataTabless
Github: https://github.com/fiduswriter/Simple-dataTabless
*/
.dataTables_wrapper div:nth-child(3) {
  padding: 1.5rem; }
.dataTables_wrapper div:nth-child(1) .dataTables-dropdown {
    float: left; }
.dataTables_wrapper div:nth-child(1) .dataTables-dropdown label {
      margin-bottom: 0;
      margin-left: 0;
      color: #7b809a;
      font-weight: 400; }
.dataTables_wrapper div:nth-child(1) .dataTables-dropdown label .dataTables-selector {
        border-color: #f0f2f5;
        border-radius: 0.375rem; }
.dataTables_wrapper div:nth-child(1) .dataTables-search input {
    font-size: 0.875rem;
    color: #495057;
    border: 1px solid #f0f2f5;
    border-radius: 0.375rem; }
.dataTables_wrapper div:nth-child(1) .dataTables-search input:focus-visible {
      outline: none; }

.dataTables_wrapper div:nth-child(2) .table thead tr th {
  padding: 0.75rem 1.5rem;
  opacity: .7;
  font-weight: bolder;
  color: #7b809a;
  text-transform: uppercase;
  font-size: 0.65rem; }

.dataTables_wrapper div:nth-child(2) .table tbody tr td {
  padding: 0.75rem 0.5rem; }

.dataTables_wrapper div:nth-child(3) {
  padding: 1.5rem;
  padding-top: 0; }

.dataTables_wrapper div:nth-child(3) .dataTabless_info {
    color: #7b809a;
    font-size: 0.875rem; }

.dataTables_wrapper div:nth-child(3) .dataTables-pagination .dataTables-pagination-list li a {
    display: flex;
    align-items: center;
    justify-content: center;
    color: #7b809a;
    padding: 0;
    margin: 0 3px;
    border: 1px solid #dee2e6;
    border-radius: 50% !important;
    width: 36px;
    height: 36px;
    font-size: 0.875rem;
    margin-left: 0; }

.dataTables_wrapper div:nth-child(3) .dataTables-pagination .dataTables-pagination-list li a:hover {
      background: #f0f2f5; }

.dataTables_wrapper div:nth-child(3) .dataTables-pagination .dataTables-pagination-list .active a {
    background: transparent;
    background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%);
    box-shadow: 0 3px 5px -1px rgba(0, 0, 0, 0.09), 0 2px 3px -1px rgba(0, 0, 0, 0.07);
    color: #fff;
    border: none;
    border-radius: 50% !important; }

 .dataTables_wrapper div:nth-child(3) .dataTables-pagination .dataTables-pagination-list .active a:hover {
      background-image: linear-gradient(195deg, #EC407A 0%, #D81B60 100%); }

.dataTables_wrapper.no-footer .dataTables_wrapper div:nth-child(2) {
  border-bottom: 0; }

.dataTables-table thead td,
.dataTables-table thead th,
.dataTables-table tbody td,
.dataTables-table tbody th,
.dataTables-table tfoot td,
.dataTables-table tfoot th {
  vertical-align: middle !important; }




  table.dataTable thead>tr>th.sorting,table.dataTable thead>tr>th.sorting_asc,table.dataTable thead>tr>th.sorting_desc,table.dataTable thead>tr>th.sorting_asc_disabled,table.dataTable thead>tr>th.sorting_desc_disabled,table.dataTable thead>tr>td.sorting,table.dataTable thead>tr>td.sorting_asc,table.dataTable thead>tr>td.sorting_desc,table.dataTable thead>tr>td.sorting_asc_disabled,table.dataTable thead>tr>td.sorting_desc_disabled{
    cursor:pointer;
    position:relative;
    padding-right:26px
}
table.dataTable thead>tr>th.sorting:before,table.dataTable thead>tr>th.sorting:after,table.dataTable thead>tr>th.sorting_asc:before,table.dataTable thead>tr>th.sorting_asc:after,table.dataTable thead>tr>th.sorting_desc:before,table.dataTable thead>tr>th.sorting_desc:after,table.dataTable thead>tr>th.sorting_asc_disabled:before,table.dataTable thead>tr>th.sorting_asc_disabled:after,table.dataTable thead>tr>th.sorting_desc_disabled:before,table.dataTable thead>tr>th.sorting_desc_disabled:after,table.dataTable thead>tr>td.sorting:before,table.dataTable thead>tr>td.sorting:after,table.dataTable thead>tr>td.sorting_asc:before,table.dataTable thead>tr>td.sorting_asc:after,table.dataTable thead>tr>td.sorting_desc:before,table.dataTable thead>tr>td.sorting_desc:after,table.dataTable thead>tr>td.sorting_asc_disabled:before,table.dataTable thead>tr>td.sorting_asc_disabled:after,table.dataTable thead>tr>td.sorting_desc_disabled:before,table.dataTable thead>tr>td.sorting_desc_disabled:after{
    position:absolute;
    display:block;
    opacity:.125;
    right:10px;
    line-height:9px;
    font-size:.8em
}
table.dataTable thead>tr>th.sorting:before,table.dataTable thead>tr>th.sorting_asc:before,table.dataTable thead>tr>th.sorting_desc:before,table.dataTable thead>tr>th.sorting_asc_disabled:before,table.dataTable thead>tr>th.sorting_desc_disabled:before,table.dataTable thead>tr>td.sorting:before,table.dataTable thead>tr>td.sorting_asc:before,table.dataTable thead>tr>td.sorting_desc:before,table.dataTable thead>tr>td.sorting_asc_disabled:before,table.dataTable thead>tr>td.sorting_desc_disabled:before{
    bottom:50%;
    content:"▲";
    content:"▲"/""
}
table.dataTable thead>tr>th.sorting:after,table.dataTable thead>tr>th.sorting_asc:after,table.dataTable thead>tr>th.sorting_desc:after,table.dataTable thead>tr>th.sorting_asc_disabled:after,table.dataTable thead>tr>th.sorting_desc_disabled:after,table.dataTable thead>tr>td.sorting:after,table.dataTable thead>tr>td.sorting_asc:after,table.dataTable thead>tr>td.sorting_desc:after,table.dataTable thead>tr>td.sorting_asc_disabled:after,table.dataTable thead>tr>td.sorting_desc_disabled:after{
    top:50%;
    content:"▼";
    content:"▼"/""
}
table.dataTable thead>tr>th.sorting_asc:before,table.dataTable thead>tr>th.sorting_desc:after,table.dataTable thead>tr>td.sorting_asc:before,table.dataTable thead>tr>td.sorting_desc:after{
    opacity:.6
}
table.dataTable thead>tr>th.sorting_desc_disabled:after,table.dataTable thead>tr>th.sorting_asc_disabled:before,table.dataTable thead>tr>td.sorting_desc_disabled:after,table.dataTable thead>tr>td.sorting_asc_disabled:before{
    display:none
}
table.dataTable thead>tr>th:active,table.dataTable thead>tr>td:active{
    outline:none
}
div.dataTables_scrollBody>table.dataTable>thead>tr>th:before,div.dataTables_scrollBody>table.dataTable>thead>tr>th:after,div.dataTables_scrollBody>table.dataTable>thead>tr>td:before,div.dataTables_scrollBody>table.dataTable>thead>tr>td:after{
    display:none
}



table.dataTable.order-column>tbody tr>.sorting_1,table.dataTable.order-column>tbody tr>.sorting_2,table.dataTable.order-column>tbody tr>.sorting_3,table.dataTable.display>tbody tr>.sorting_1,table.dataTable.display>tbody tr>.sorting_2,table.dataTable.display>tbody tr>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.019);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.019)
}
table.dataTable.order-column>tbody tr.selected>.sorting_1,table.dataTable.order-column>tbody tr.selected>.sorting_2,table.dataTable.order-column>tbody tr.selected>.sorting_3,table.dataTable.display>tbody tr.selected>.sorting_1,table.dataTable.display>tbody tr.selected>.sorting_2,table.dataTable.display>tbody tr.selected>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.919);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919)
}
table.dataTable.display>tbody>tr.odd>.sorting_1,table.dataTable.order-column.stripe>tbody>tr.odd>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.054);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.054)
}
table.dataTable.display>tbody>tr.odd>.sorting_2,table.dataTable.order-column.stripe>tbody>tr.odd>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.047);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.047)
}
table.dataTable.display>tbody>tr.odd>.sorting_3,table.dataTable.order-column.stripe>tbody>tr.odd>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.039);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-column-ordering), 0.039)
}
table.dataTable.display>tbody>tr.odd.selected>.sorting_1,table.dataTable.order-column.stripe>tbody>tr.odd.selected>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.954);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.954)
}
table.dataTable.display>tbody>tr.odd.selected>.sorting_2,table.dataTable.order-column.stripe>tbody>tr.odd.selected>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.947);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.947)
}
table.dataTable.display>tbody>tr.odd.selected>.sorting_3,table.dataTable.order-column.stripe>tbody>tr.odd.selected>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.939);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.939)
}
table.dataTable.display>tbody>tr.even>.sorting_1,table.dataTable.order-column.stripe>tbody>tr.even>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.019);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.019)
}
table.dataTable.display>tbody>tr.even>.sorting_2,table.dataTable.order-column.stripe>tbody>tr.even>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.011);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.011)
}
table.dataTable.display>tbody>tr.even>.sorting_3,table.dataTable.order-column.stripe>tbody>tr.even>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.003);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.003)
}
table.dataTable.display>tbody>tr.even.selected>.sorting_1,table.dataTable.order-column.stripe>tbody>tr.even.selected>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.919);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.919)
}
table.dataTable.display>tbody>tr.even.selected>.sorting_2,table.dataTable.order-column.stripe>tbody>tr.even.selected>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.911);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.911)
}
table.dataTable.display>tbody>tr.even.selected>.sorting_3,table.dataTable.order-column.stripe>tbody>tr.even.selected>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.903);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.903)
}
table.dataTable.display tbody tr:hover>.sorting_1,table.dataTable.order-column.hover tbody tr:hover>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.082);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.082)
}
table.dataTable.display tbody tr:hover>.sorting_2,table.dataTable.order-column.hover tbody tr:hover>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.074);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.074)
}
table.dataTable.display tbody tr:hover>.sorting_3,table.dataTable.order-column.hover tbody tr:hover>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(0, 0, 0, 0.062);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-hover), 0.062)
}
table.dataTable.display tbody tr:hover.selected>.sorting_1,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_1{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.982);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.982)
}
table.dataTable.display tbody tr:hover.selected>.sorting_2,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_2{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.974);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.974)
}
table.dataTable.display tbody tr:hover.selected>.sorting_3,table.dataTable.order-column.hover tbody tr:hover.selected>.sorting_3{
    box-shadow:inset 0 0 0 9999px rgba(13, 110, 253, 0.962);
    box-shadow:inset 0 0 0 9999px rgba(var(--dt-row-selected), 0.962)
}

.dataTables_wrapper .dataTables_filter input{
    border:1px solid #aaa;
    border-radius:3px;
    padding:5px;
    background-color:transparent;
    color:inherit;
    margin-left:3px
}

.dataTables_wrapper .table tbody tr td {
    padding: 0.75rem 1.5rem;
}

.dataTables_wrapper div:nth-child(1) label {
    margin-bottom: 0;
    margin-left: 0;
    color: #7b809a;
    font-weight: 400;
    display: inline-flex;
    align-items: baseline;
}


.dataTables_length {
    float: left !important;
}

.dataTables_length select {
    border: 1px solid #f0f2f5;
    margin: -3px 10px 10px;
    border-radius: 0.375rem;
}

.dataTables_filter {
    float: right!important;
}

.dataTables_filter input {
    font-size: .875rem !important;
    color: #495057 !important;
    border: 1px solid #f0f2f5!important;
    border-radius: 0.375rem!important;
    margin: -3px 10px 10px;
}

.dataTables_wrapper .dataTables_wrapper div:nth-child(3) .dataTables_info {
    color: #7b809a;
    font-size: .875rem;
    margin-top: 5px;
}

.dataTables_wrapper .dataTables_wrapper div:nth-child(3) .dataTables_paginate
{
    float:right;
    color: #7b809a;
    font-size: .875rem;
}


.itemrow{
  /* box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); */
  border: 0 solid rgba(0, 0, 0, 0.125);
  border-radius: 25px;
  background:#fff;    
  padding: 15px;
}

.itemrow img {
  border-top-left-radius: 10px;
}

#listRuang td{
  border-bottom:none;
}


.owl-carousel .owl-item img {
  display: block;
  width: 100%;
  filter: brightness(60%);
}

.slidercontent {
  margin-top:-310px; padding: 8px 53px; position: absolute;
}


#listRuang td{
  padding: 0px !important;
}

.demo-preview {
  padding-top: 60px;
  padding-bottom: 10px;
  margin: auto;
  text-align: center;
}
.demo-preview .badge{
  margin-right:10px;
}
.badge {
  display: inline-block;
  font-size: 11px;
  font-weight: 600;
  padding: 3px 6px;
  border: 1px solid transparent;
  min-width: 10px;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  border-radius: 99999px
}

.badge.badge-default {
  background-color: #B0BEC5
}

.badge.badge-primary {
  background-color: #2196F3
}

.badge.badge-secondary {
  background-color: #323a45
}

.badge.badge-success {
  background-color: #64DD17
}

.badge.badge-warning {
  background-color: #FFD600
}

.badge.badge-info {
  background-color: #29B6F6
}

.badge.badge-danger {
  background-color: #ef1c1c
}

.badge.badge-outlined {
  background-color: transparent
}

.badge.badge-outlined.badge-default {
  border-color: #B0BEC5;
  color: #B0BEC5
}

.badge.badge-outlined.badge-primary {
  border-color: #2196F3;
  color: #2196F3
}

.badge.badge-outlined.badge-secondary {
  border-color: #323a45;
  color: #323a45
}

.badge.badge-outlined.badge-success {
  border-color: #64DD17;
  color: #64DD17
}

.badge.badge-outlined.badge-warning {
  border-color: #FFD600;
  color: #FFD600
}

.badge.badge-outlined.badge-info {
  border-color: #29B6F6;
  color: #29B6F6
}

.badge.badge-outlined.badge-danger {
  border-color: #ef1c1c;
  color: #ef1c1c
}

#ddCarian option{
  height:100px !important;
}

p,.card, .card-body {
  line-height: 1.425;
  color: #5b5b5b !important;
  font-weight: 500 !important;
  font-size: 0.89rem !important;
  font-family: 'airbnb-l' !important;
}


p{
  text-shadow: 0px 0px #333 !important;
}


#filterbtn{
  /* border-radius:50%; */
}

.btn-circle.btn-sm {
  width: 30px;
  height: 30px;
  padding: 6px 0px;
  border-radius: 15px;
  font-size: 8px;
  text-align: center;
}
.btn-circle.btn-md {
  width: 50px;
  height: 50px;
  padding: 7px 10px;
  border-radius: 25px;
  font-size: 10px;
  text-align: center;
}
.btn-circle.btn-xl {
  width: 48px;
  height: 48px;
  padding: 10px 16px;
  border-radius: 35px;
  font-size: 12px;
  text-align: center;
}




/* CUSTOM SELECT */


.select-hidden {
  display: none;
  visibility: hidden;
  padding-right: 10px;
}
.select {
  cursor: pointer;
  display: inline-block;
  position: relative;
  font-size: 0.875rem;
  width: 100%;
  height: 40px;
}
.select-styled {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #ffffff;
  padding: 8px 15px;
  height: 44px;
  border-radius: 8px;
  border: 1px solid #d2d6da;
  padding: 8px 15px;
  transition:(all 0.2s ease-in);
  &:after {
    content:"";
    width: 0;
    height: 0;
    border: 7px solid transparent;
    border-color: #4caf50 transparent transparent transparent;
    position: absolute;
    top: 16px;
    right: 10px;
  }
  &:hover {
    background-color: darken(#4caf50 , 2);
  }
  &:active, &.active {
    background-color: darken(#4caf50 , 5);
    &:after {
      top: 9px;
      border-color: transparent transparent #4caf50  transparent;
    }
  }
}

.select-options {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  left: 0;
  z-index: 999;
  margin: 0;
  padding: 0;
  list-style: none;
  background-color: #fff;
  li {
    margin: 0;
    padding: 12px 0;
    text-indent: 15px;
    @include transition(all 0.15s ease-in);
    &:hover,
    &.is-selected {
      color: #000000;
      background: #f5f5f5;
    }
    &[rel="hide"] {
      display: none;
    }
  }
}


.navbar-vertical.navbar-expand-xs.fixed-start {
  z-index: 1;
}

/* Mobile: when the hamburger opens the sidebar as an overlay (g-sidenav-pinned),
   it must stack above ordinary page content instead of the low desktop z-index
   above, otherwise sidebar nav items visually interleave with the page behind it. */
@media (max-width: 1199.98px) {
  .g-sidenav-show.g-sidenav-pinned .navbar-vertical.navbar-expand-xs.fixed-start {
    z-index: 1030;
  }
}

/* CUSTOM SELECT END */


.text-secondary, .table {
  color: #2c2c2c !important;
}

.bg-white{
  background-color: #fafbff !important;
  font-family:'airbnb-l';
}

.bg-gray-200.car.card-body.bg-white{
  background-color: none !important;
}



.sidenav{
  font-family: "Roboto", Helvetica, Arial, sans-serif;
}

.bg-white h5{
  font-family:'airbnb-md';
}

aside.bg-white{

  background-color: #fff !important;
}

/* SIDENAV PROFILE CARD */
.sidenav-profile-card {
  background-color: #f8f9fa;
  border: 1px solid #eceef0;
  border-radius: 0.75rem;
  margin: 0 0.5rem;
  cursor: default;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.04);
}

.sidenav-profile-card .flex-grow-1 {
  min-width: 0;
}

.sidenav-profile-name {
  font-size: 0.8rem;
  font-weight: 700;
  line-height: 1.3;
  text-transform: uppercase;
}

.sidenav-profile-clock {
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}

.sidenav-profile-avatar {
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  flex-shrink: 0;
}

.sidenav-profile-role-badge {
  font-size: 0.65rem;
  color: #fff;
  padding: 0.25rem 0.6rem;
}

.sidenav-profile-assignment {
  font-size: 0.68rem;
  line-height: 1.35;
  color: #67748e;
}

.bg-gradient-kj-purple {
  background-image: linear-gradient(195deg, #8e6fd0 0%, #6f42c1 100%);
}

.sidenav-profile-assignment i {
  font-size: 0.65rem;
  margin-right: 0.25rem;
}

/* Collapsed ("minimized") sidebar: shrink the profile card down to just the
   avatar, centered, matching how the rest of the sidebar collapses. Expands
   back on hover, mirroring the vendor's .nav-link-text/.sidenav-normal behaviour. */
@media (min-width: 1200px) {
  .g-sidenav-hidden .navbar-vertical .sidenav-profile-card {
    justify-content: center;
    margin: 0 0.35rem;
    padding: 0.5rem 0 !important;
    transition: justify-content 0.2s, padding 0.2s;
  }
  .g-sidenav-hidden .navbar-vertical .sidenav-profile-card .flex-grow-1 {
    opacity: 0;
    width: 0;
    height: 0;
    overflow: hidden;
    margin: 0 !important;
    transition: opacity 0.2s, width 0.2s, height 0.2s;
  }
  .g-sidenav-hidden .navbar-vertical .sidenav-profile-avatar {
    margin-right: 0 !important;
  }

  .g-sidenav-hidden .navbar-vertical:hover .sidenav-profile-card {
    justify-content: flex-start;
    padding: 0.5rem 0.75rem !important;
  }
  .g-sidenav-hidden .navbar-vertical:hover .sidenav-profile-card .flex-grow-1 {
    opacity: 1;
    width: auto;
    height: auto;
    overflow: visible;
  }
  .g-sidenav-hidden .navbar-vertical:hover .sidenav-profile-avatar {
    margin-right: 0.5rem !important;
  }
}
/* SIDENAV PROFILE CARD END */

/* DASHBOARD STAT CARDS - kad statistik boleh diklik (cth. Modules/Cso dashboard) */
.dashboard-stat-card-link {
  display: block;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.dashboard-stat-card-link:hover .card {
  transform: translateY(-2px);
  box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.1);
}
/* DASHBOARD STAT CARDS END */

/* =========================
   GARIS MASA (TIMELINE) - dikongsi merentasi module (Moderator, CSO, dll.)
   Rujuk asal: Modules/Moderator/resources/views/moderator_aduan.blade.php
   ========================= */
.timeline-masonry {
  max-height: 60vh;
  overflow-y: auto;
  padding: 10px;
}

.timeline-masonry .timeline-item {
  display: block;
  width: 100%;
  padding-left: 50px;
  margin-bottom: 25px;
  position: relative;
}

.timeline-masonry .timeline-item::after {
  content: "";
  position: absolute;
  left: 15px;
  top: 32px;
  bottom: -25px;
  width: 2px;
  background: #dee2e6;
  z-index: 0;
}

.timeline-item:last-child::after {
  display: none;
}

.timeline-icon {
  position: absolute;
  left: 0;
  top: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 1;
}

.timeline-content {
  background: #fff;
  padding: 12px 20px;
  border-radius: 12px;
  border: 1px solid #eee;
  display: inline-flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 8px;
  max-width: 85%;
  width: max-content;
}

.timeline-desc {
  color: #495057;
  white-space: normal;
  word-break: break-word;
  display: inline;
}

.timeline-title {
  font-weight: 600;
  color: #333;
}

.timeline-pelaku {
  color: #67748e;
  font-size: 12px;
  font-style: italic;
}

.timeline-date {
  color: #6c757d;
  font-size: 14px;
}

.timeline-separator {
  color: #adb5bd;
}

@media (max-width: 992px) {
  .timeline-masonry {
    column-width: auto;
  }
}
/* GARIS MASA (TIMELINE) END */

/* BADGE STATUS - standard seluruh sistem. Guna macam ni di mana-mana page:
   <span class="badge badge-status badge-status-buka rounded-pill">Buka</span>
   Rujuk resources/views/design-system/index.blade.php untuk senarai penuh. */
.badge-status {
  min-width: 90px;
  text-align: center;
}
.badge-status-draf {
  background: linear-gradient(135deg, #475569, #94A3B8);
  color: #fff;
}
.badge-status-buka {
  background: linear-gradient(135deg, #0284C7, #06B6D4);
  color: #fff;
}
.badge-status-terima {
  background: linear-gradient(135deg, #1D4ED8, #3B82F6);
  color: #fff;
}
.badge-status-tindakan-moderator {
  background: linear-gradient(135deg, #D97706, #F59E0B);
  color: #fff;
}
.badge-status-selesai {
  background: linear-gradient(135deg, #047857, #10B981);
  color: #fff;
}
.badge-status-pindah-tindakan {
  background: linear-gradient(135deg, #475569, #94A3B8);
  color: #fff;
}
.badge-status-batal {
  background: linear-gradient(135deg, #BE123C, #FB7185);
  color: #fff;
}
/* BADGE STATUS END */

.content-bg-white{
  background-color: #fff !important;
  border-radius:25px;
}


.nav.nav-pills {
  min-height: 42px;
}

/* STICKY HEADER */
nav {
  padding: 20px 40px;
  /* width: 100%; */
  z-index: 20;
  background-color: #ffffff; /* fafbff */

  -webkit-transition: all 0.5s ease;
  -moz-transition: position 10s;
  -ms-transition: position 10s;
  -o-transition: position 10s;
  transition: all 0.5s ease;
}

section {
  /* height: 150vh; */
}


.fixed {
  position: fixed;
  top: 0;
  left: 0;
  animation: smoothScroll 1s forwards;
  margin-top: 0px !important;
    padding-top: 20px;
    box-shadow: 0 -6px 15px 15px rgb(123 148 183 / 17%) !important;
}
@keyframes smoothScroll {
	0% {
		transform: translateY(-40px);
	}
	100% {
		transform: translateY(0px);
	}
}
/* STICKY HEADER END */


.detailItem img{
  width: max-content !important;
    height: 538px;
    overflow-y: hidden !important;
    margin: auto;
}


/* CAROUSEL NEXT PREV BUTTON */
.owl-prev,
.owl-next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 7rem !important;

}

.owl-prev {
  left: 2rem;
}

.owl-next {
  right: 2rem;
}

.owl-theme .owl-nav [class*=owl-]:hover {
  background: none !important;
}

/* CAROUSEL NEXT PREV BUTTON */


.card {
  box-shadow: 0px 8px 22px 3px rgb(123 148 183 / 10%) !important;

  min-height: auto; /* Optional, set if needed */
  height: auto; /* Ensure the height can expand */
  overflow: visible; /* Allow content to expand */

}

.auto {
  height: auto;
}

.inherit {
  height: inherit;
}


/* fullcalendar fix */
.fc .fc-scrollgrid-liquid {
  height: 102.1% !important;
}

/* .fc-scroller {
  height: auto !important;
} */

.fc-theme-standard .fc-scrollgrid {
  border: 1px solid #dbdbdb !important;
  /* border-radius: 16px; */
}

.fc .fc-daygrid-day.fc-day-today {
  background-color: rgb(209 226 245 / 15%) !important;
}

.fc .fc-col-header-cell-cushion {
  color: #2572bf;
}

.fc .fc-daygrid-day-frame {
  /* cursor: pointer; */
}

.fc-daygrid-block-event .fc-event-time, .fc-daygrid-block-event .fc-event-title {
  visibility: hidden;
}

.fc-h-event {
/* 
  background-color: #d55c77;
  border-radius: 45px !important; */
}

.fc-day:hover{
  background:rgb(242 249 255);
  cursor:pointer;
}
.fc-slats,
.fc-content-skeleton,
.fc-bgevent-skeleton{
  pointer-events:none;
}
.fc-bgevent,
.fc-event-container{
  pointer-events:auto;
}

.tooltip{
  position:absolute;
  z-index:10000;
  background:white;
  pointer-events:none;
}


/* fullcalendar fix end */


a.input-button {
  text-decoration: none;
  border: 1px solid #bbb;
  display: block;
  padding: 13px 12px;
  border-left: 0;
  cursor: pointer;
  align-self: center;
  justify-content: center;
  line-height: 1;
}

.input-group {
  display: flex;
  align-items: center;
}

.flatpickr .flatpickr-input{
  padding: 5px;
}


.modal-content {
  border-radius: 25px;
}

#resp-table {
  width: 100%;
  }

#resp-table-header{
  display:flex;
  justify-content: space-evenly;
  width: -webkit-fill-available;
  padding: 0px;
  }

.table-header-cell{
  display: table-cell;
  padding: 10px;
  text-align: justify;
  border-bottom: 1px solid black;
  width: -webkit-fill-available;
  }

  .resp-table-row{
    display: table-row;
    }

  #resp-table-body{
    display: table-row-group;
    }

  .table-body-cell{
    display: table-cell;
    padding: 10px;
    text-align: justify;
    border-bottom: 1px solid black;
    width: -webkit-fill-available;
    }


    #pilihTempahan #tkhMula:active, #pilihTempahan #tkhMula:hover, #pilihTempahan #tkhMula:focus-visible,
    #pilihTempahan #tkhTmt:active, #pilihTempahan #tkhTmt:hover, #pilihTempahan #tkhTmt:focus-visible{
      cursor: pointer;
      border: 2px solid #009688;
    }

    .fc-day-past {
      background-color: #fbfbfb !important;
  }


  .moving-tab {
    padding: 0px;
    position: absolute;
    width: 0px;
    transform: translate3d(0px, 0px, 0px);
    transition: 0.5s ease;
}

label, .form-label {
  color: #2c2c40;
}

#listRuang_wrapper .next,#listRuang_wrapper .previous,#listRuang_wrapper .first,#listRuang_wrapper .last{
  position: relative;
  top: 2px;
}


#listRuang_wrapper .dt-paging-button{
font-size: 15px;margin: 0px 1px !important;
}


#listRuang_wrapper .dt-paging-button .material-icons {
font-size: 20px !important;    top: 3px;
}

#listRuang_wrapper nav{
  background: none;
  text-align: center;
  margin-bottom: 20px;

}

#fasilitiTable > tbody > tr:hover > *,#fasilitiTable > tbody > tr > * {
  box-shadow:none !important;
}

#fasilitiTable > tbody > tr > * {
  border-top: 1px solid rgb(145 145 145 / 15%);
}

#fasilitiTable_wrapper > .dt-layout-row{
  margin: 0 0 !important;
}

#fasilitiTable_wrapper{

  font-size: 0.75rem ;
}


.error-border {
  border: 2px solid red !important; /* Customize the border width and color */
}

.input-group.input-group-static.is-focused.is-invalid .form-control, .error-choice{
  background-image: linear-gradient(0deg, #F44335 2px, rgba(156, 39, 176, 0) 0), linear-gradient(0deg, #F44336 2px, rgba(209, 209, 209, 0) 0) !important;
  border-radius: 0 !important;


}




.owl-theme .owl-nav.disabled+.owl-dots {
  padding-bottom: 10px;
}




.required{
  color: red;font-weight: 700;
}

.custom-info:hover{
  background: none !important;
}

.fc-daygrid-block-event{
  height:22px;
}

.fc-daygrid-block-event div{
  display:none;
}

 .custom-popover {
  background-color: #2c2c2c;
}
.custom-popover .popover-body {
  color: #e3e3e3 !important;
}

.custom-popover-body {
  color: #f5f5f5 !important;
}

.bs-popover-top > .popover-arrow::after, .bs-popover-auto[data-popper-placement^="top"] > .popover-arrow::after {
  border-top-color: #4e4e4e;
}

.no-sticky-navbar {
  position: static !important;
}

.fc-theme-standard td, .fc-theme-standard th {
  border-color: #dadada !important;
  /* background: #ffffff; */
}

.fc-timegrid-col-events{
  display: flex
;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    
}

.fc-timegrid-event-harness-inset{
  
  width: 10%;
}

.fc-license-message{
  display: none;
}

.fc-direction-ltr .fc-timeline-slot {
  border-right: 1px solid #e9e9e9 !important;
}

.fc-theme-standard td, .fc-theme-standard th {
  border: 1px solid #333;
}

.fc-datagrid-cell-main{

}

.fc-datagrid-cell-cushion .fc-datagrid-cell-main{
  font-weight: 600;
  color: #333;
}

.fc .fc-datagrid-cell-cushion {
  font-size: 0.85rem;
}

.fc .fc-timeline-slot-cushion {
  font-size: 0.8rem;
}

.fc-timeline-event:not(.fc-event-end)::after, .fc-timeline-event:not(.fc-event-start)::before {
  border-style: none;
}

.fc-h-event .fc-event-title {
  padding: 2px 0px 2px 10px;
}

.fc-timeline-event-harness{
  cursor:pointer;

}

/* .fc-scroller {
  height: auto !important;
} */

.fc-head .fc-widget-header {
  margin-right: 0 !important;
}

/* .fc-scroller {
  overflow: visible !important;
} */