/*--------------------------------------------------------------------------
| FILE:
|--------------------------------------------------------------------------
|
| wp-content/plugins/shenanigans-ticket-cards/assets/css/style.css
|
| CLEAN + FINAL VERSION
|
*/

/*--------------------------------------------------------------------------
| PREVENT HORIZONTAL MOBILE SCROLL
|--------------------------------------------------------------------------
*/

html,
body {

  width:100%;

  max-width:100%;

  /* overflow-x:hidden !important; */
}

body {

  overflow-x:hidden;
}

* {

  box-sizing:border-box;
}

/* REMOVE LARGE GAP UNDER AVAILABILITY */

[data-section-title-area="true"] {

  margin-bottom:0 !important;

  padding-bottom:0 !important;
}

[data-section-title-area="true"] .section-title-col {

  margin-bottom:0 !important;

  padding-bottom:0 !important;
}

[data-section-title-area="true"] h2 {

  margin-bottom:8px !important;

  padding-bottom:0 !important;

  line-height:1.1 !important;
}

img,
video,
iframe {

  max-width:100%;

  height:auto;
}

/*--------------------------------------------------------------------------
| FIX MESMERIZE CLEARFIX BREAKING CSS GRID
|--------------------------------------------------------------------------
*/

.shenanigans-ticket-grid::before,
.shenanigans-ticket-grid::after {

  content:none !important;

  display:none !important;
}

.shenanigans-ticket-grid > div::before,
.shenanigans-ticket-grid > div::after {

  content:none !important;

  display:none !important;
}

/*--------------------------------------------------------------------------
| FORCE FULL WIDTH AVAILABILITY SECTION
|--------------------------------------------------------------------------
*/

#availability .row.center-xs.middle-xs {

  display:block !important;

  width:100% !important;

  margin:0 !important;

  padding:0 !important;
}

#availability .col-sm-9 {

  width:100% !important;

  max-width:100% !important;

  flex:none !important;

  margin:0 !important;

  padding:0 !important;
}

#availability .gridContainer {

  width:100% !important;

  max-width:100% !important;

  margin:0 !important;

  padding:0 !important;
}

/*--------------------------------------------------------------------------
| WRAPPER
|--------------------------------------------------------------------------
*/

.shenanigans-ticket-wrapper {

  display:block !important;

  width:100% !important;

  max-width:920px !important;

  margin:0 auto !important;

  padding:0 6px !important;

  box-sizing:border-box !important;

}

/*--------------------------------------------------------------------------
| SECTION HEADINGS
|--------------------------------------------------------------------------
*/

.ticket-section-heading {

  display:block !important;

  width:100% !important;

  clear:both !important;

  margin:50px 0 25px 0 !important;

  text-align:center !important;

  font-size:32px !important;

  font-weight:700 !important;

  color:#0f172a !important;

  letter-spacing:.5px !important;
}

.ticket-section-heading:first-child {

  margin-top:20px !important;
}

/*--------------------------------------------------------------------------
| GRID
|--------------------------------------------------------------------------
*/

.shenanigans-ticket-grid {

  display:grid !important;

  grid-template-columns:
    repeat(
      2,
      minmax(280px,420px)
    ) !important;

  justify-content:center !important;

  gap:24px !important;

  width:100% !important;

  margin:0 auto !important;

  padding:0 !important;

  box-sizing:border-box !important;

  align-items:start !important;

  justify-items:center !important;

  clear:both !important;

}

.shenanigans-ticket-grid > * {

  min-width:0 !important;
}

/*--------------------------------------------------------------------------
| CARD
|--------------------------------------------------------------------------
*/

.ticket-card {

  position:relative;

  overflow:hidden;

  width:100% !important;

  min-width:0 !important;

  margin:0 !important;

  display:flex !important;

  flex-direction:column !important;

  border-radius:30px;

  background:
    linear-gradient(
      180deg,
      #ffffff 0%,
      #f7fbff 100%
    );

  border:
    1px solid rgba(255,255,255,.85);

  box-shadow:
    0 18px 50px rgba(15,55,95,.12),
    0 8px 18px rgba(15,55,95,.08);

  backdrop-filter:none;

  transition:
    transform .35s ease,
    box-shadow .35s ease;

  max-width:100% !important;
}

.ticket-card:hover {

  transform:
    translateY(-10px);

  box-shadow:
    0 30px 80px rgba(15,55,95,.18),
    0 12px 26px rgba(15,55,95,.12);
}

/*--------------------------------------------------------------------------
| IMAGE
|--------------------------------------------------------------------------
*/

.ticket-image {

  position:relative;

  height:280px;

  overflow:hidden;

  line-height:0;

  z-index:1;
}

.ticket-image img {

  width:100%;

  height:100%;

  object-fit:cover;

  display:block;
}

.ticket-wave {

  position:absolute;

  left:0;

  bottom:-1px;

  width:100%;

  height:70px;

  display:block;

  z-index:100;
}

.ticket-wave svg {

  width:100% !important;

  height:100% !important;

  display:block !important;
}

/*--------------------------------------------------------------------------
| CONTENT
|--------------------------------------------------------------------------
*/

.ticket-content {

  position:relative;

  padding:
    4px
    22px
    22px
    22px;

  text-align:center;

  margin-top:-8px;

  background:#fff;
}

/*--------------------------------------------------------------------------
| PALM ICON
|--------------------------------------------------------------------------
*/

.ticket-palm {

  width:104px;

  height:104px;

  border-radius:999px;

  background:#ffffff;

  display:flex;

  align-items:center;

  justify-content:center;

  margin:
    -68px auto 16px auto;

  position:relative;

  z-index:50;

  border:
    6px solid #dff5fb;

  box-shadow:
    0 14px 28px rgba(0,0,0,.14);
}

.ticket-palm span {

  font-size:46px;

  line-height:1;
}

/*--------------------------------------------------------------------------
| BADGE
|--------------------------------------------------------------------------
*/

.ticket-badge {

  display:inline-flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  font-size:10px;

  letter-spacing:2px;

  font-weight:800;

  color:#0098b8;

  text-transform:uppercase;

  margin-bottom:14px;
}

.ticket-badge:before,
.ticket-badge:after {

  content:"";

  width:34px;

  height:2px;

  background:#00b7d6;

  border-radius:999px;
}

/*--------------------------------------------------------------------------
| TITLE
|--------------------------------------------------------------------------
*/

.ticket-title {

  font-size:54px;

  line-height:1;

  margin:0 0 16px 0;

  font-weight:400;

  color:#06264d;

  letter-spacing:0;

  font-family:
    "Kaushan Script",
    cursive;
}

/*--------------------------------------------------------------------------
| DATES
|--------------------------------------------------------------------------
*/

.ticket-dates {

  display:flex;

  align-items:center;

  justify-content:center;

  gap:10px;

  background:
    linear-gradient(
      180deg,
      #f3fbff 0%,
      #e5f6ff 100%
    );

  border-radius:999px;

  padding:16px 20px;

  font-size:16px;

  font-weight:700;

  color:#164f72;

  margin-bottom:18px;

  box-shadow:
    inset 0 2px 6px rgba(255,255,255,.9),
    0 3px 10px rgba(0,0,0,.05);
}

.calendar-icon {

  display:flex;

  align-items:center;

  justify-content:center;

  color:#164f72;

  line-height:1;
}

/*--------------------------------------------------------------------------
| DURATION
|--------------------------------------------------------------------------
*/

.ticket-duration {

  font-size:13px;

  font-weight:800;

  color:#00a6c7;

  letter-spacing:2px;

  text-transform:uppercase;

  margin-bottom:14px;
}

/*--------------------------------------------------------------------------
| SAVINGS
|--------------------------------------------------------------------------
*/

.ticket-savings {

  font-size:18px;

  font-weight:700;

  color:#0f9d7a;

  margin-bottom:10px;
}

.ticket-original-price {

  font-size:16px;

  color:#7b8794;

  text-decoration:line-through;

  margin-bottom:8px;
}

/*--------------------------------------------------------------------------
| PRICE
|--------------------------------------------------------------------------
*/

/*--------------------------------------------------------------------------
| PRICE
|--------------------------------------------------------------------------
*/

.ticket-price {

  font-size:36px;

  line-height:1;

  font-weight:900;

  color:#12385d;

  margin-bottom:8px;

  letter-spacing:-1px;
}

.ticket-fees {

  font-size:14px;

  color:#627385;

  margin-bottom:22px;
}

/*--------------------------------------------------------------------------
| BUTTON
|--------------------------------------------------------------------------
*/

/*--------------------------------------------------------------------------
| BUTTON
|--------------------------------------------------------------------------
*/

/*--------------------------------------------------------------------------
| BUTTON
|--------------------------------------------------------------------------
*/

.ticket-button {

  display:flex !important;

  flex-direction:row !important;

  flex-wrap:nowrap !important;

  align-items:center !important;

  justify-content:center !important;

  gap:10px;

  width:100%;

  min-height:58px;
  overflow:visible;
  padding:0 18px;
  white-space:nowrap;
  text-align:center;
  text-decoration:none !important;
  background:
    linear-gradient(
      180deg,
      #00a8d1 0%,
      #0079a5 100%
    );
  color:#fff !important;
  border-radius:20px;
  font-size:17px;
  font-weight:800;
  line-height:1;
}

.ticket-button:hover {

  transform:
    translateY(-3px);

  box-shadow:
    0 18px 34px rgba(0,130,170,.34);

  background:
    linear-gradient(
      180deg,
      #00bde8 0%,
      #0080ad 100%
    );
}

.cart-icon {

  font-size:30px;

  line-height:1;

  display:flex;

  align-items:center;

  justify-content:center;

  color:#ffffff !important;

  opacity:1;

  filter:
    brightness(1.5)
    contrast(1.2);
}

/*--------------------------------------------------------------------------
| EMPTY
|--------------------------------------------------------------------------
*/

.no-weeks {

  width:100%;

  padding:40px;

  text-align:center;

  font-size:22px;
}

/*--------------------------------------------------------------------------
| TABLET / MOBILE
|--------------------------------------------------------------------------
*/

@media(max-width:900px) {

  .shenanigans-ticket-grid {

    grid-template-columns:1fr !important;

    gap:20px !important;
  }

  .ticket-section-heading {

    font-size:24px !important;

    margin-top:40px !important;

    margin-bottom:20px !important;
  }

  .ticket-image {

    height:220px;
  }

  .ticket-title {

    font-size:44px;
  }

  .ticket-price {

    font-size:54px;
  }

  .ticket-content {

    padding:
      4px
      18px
      18px
      18px;
  }
}

/*--------------------------------------------------------------------------
| SMALL MOBILE
|--------------------------------------------------------------------------
*/

@media(max-width:480px) {

  .shenanigans-ticket-grid {

    width:96% !important;

    margin:0 auto !important;

    justify-items:center !important;
  }

  .ticket-card {
    border-radius:20px;
    width:92% !important;
    max-width:92% !important;
    margin:0 auto !important;
    overflow:hidden !important;
  }

  .ticket-image {

    height:200px;
  }

  .ticket-wave {

    height:52px;
  }

  .ticket-content {

    padding:
      2px
      12px
      12px
      12px;
  }

  .ticket-palm {

    width:76px;

    height:76px;

    margin:
      -40px auto 6px auto;

    border-width:4px;
  }

  .ticket-palm span {

    font-size:38px;

    line-height:1;
  }

  .ticket-badge {

    font-size:12px;

    margin-bottom:6px;

    gap:4px;
  }

  .ticket-badge:before,
  .ticket-badge:after {

    width:16px;
  }

  .ticket-title {

    font-size:44px;

    line-height:1;

    margin-bottom:8px;
  }

  .ticket-dates {

    padding:9px 10px;

    font-size:18px;

    margin-bottom:8px;

    gap:5px;
  }

  .ticket-duration {

    font-size:10px;

    margin-bottom:8px;
  }

  .ticket-savings {

    margin-bottom:6px;
  }

  .ticket-original-price {

    margin-bottom:4px;
  }

  .ticket-fees {

    font-size:11px;

    margin-bottom:10px;

    line-height:1.2;
  }

  .ticket-button {

    display:flex;

    align-items:center;

    justify-content:center;

    text-align:center;

    gap:8px;

    width:100%;

    min-height:48px;

    padding:0 12px;

    font-size:13px;

    font-weight:800;

    line-height:1;

    border-radius:14px;
  }

  .cart-icon {

    font-size:18px;

    line-height:1;

    display:flex;

    align-items:center;

    justify-content:center;
  }

}

/* for html2canvas */

.exporting .cart-icon,
.exporting .calendar-icon,
.exporting .ticket-palm span {

  transform:none !important;

  display:inline-flex !important;

  align-items:center !important;

  justify-content:center !important;
}

.exporting .ticket-dates {

  background:
    linear-gradient(
      180deg,
      #f3fbff 0%,
      #e5f6ff 100%
    ) !important;

  -webkit-print-color-adjust:exact !important;

  print-color-adjust:exact !important;

  border-radius:50px;

  overflow:hidden;
}

.exporting .ticket-original-price {

  display:block !important;

  visibility:visible !important;

  opacity:1 !important;

  color:#7b8794 !important;

  text-decoration:line-through !important;

}

@media (hover:none) {

  .ticket-card:hover,
  .ticket-button:hover {

    transform:none !important;
  }
}

.ticket-card {

  touch-action:pan-y;
}

.ticket-button {

  touch-action:pan-y;
}

.ticket-dates {

  touch-action:pan-y;
}

.ticket-palm {

  touch-action:pan-y;
}

