/* backend changes start */
@import url("https://pro.fontawesome.com/releases/v5.10.0/css/fontawesome.css");
.btn .odi-share::before {
    content: "\f14d" !important;
}
swift-ui {
    overflow: hidden;
    background-color: #ffffff !important;
}
.odi-share {
    background: url(https://www.cruisedirect.com/odynew/transition-img/share-icon-blue.svg) no-repeat left !important;
    width: 22px;
    margin: 0 10px;
    background-size: 22px !important;
}
/* .odi-share:hover {
    background: url(https://www.cruisedirect.com/odynew/transition-img/share-icon-white.svg) no-repeat left;
} */
i.odi.odi-share-variant {
    background: url(https://www.cruisedirect.com/odynew/transition-img/share-icon-blue.svg) no-repeat left;
    display: block !important;
    width: 22px!important;
    height: 22px!important;
    margin: 0 2px!important;
    background-size: 22px!important;
}
/* i.odi.odi-share-variant:hover {
    background: url(https://www.cruisedirect.com/odynew/transition-img/share-icon-white.svg) no-repeat left;
} */
i.odi.odi-share-variant::before{
    content: inherit !important;
}
.share-icon span.btn:hover{
    background-color: #fff!important;
    color: #2e86c1!important;
}

.resultSalesImgSm ~ span.fs14.spanpadding.pl-1 {
    font-size: 1rem!important;
}
.most_popular.nobox-shadow .summary_index > span{
    color:#e74c3c !important;
}
.section-title.proximanova-light .btn-outline-primary{
    background-color: #ffffff!important;
}
.section-title.proximanova-light .btn-outline-primary{
    color: #2e86c1!important;
}
.guest-info-form label {
    color: #6e6e6e!important;
    font-size: 12px!important;
    font-weight: 500!important;
    text-transform: uppercase;
}
.text-red .d-block {
    color: #000000!important;
}
.text-red.tab-price{
    color: #000000!important;
}
.text-grey.lh-normal{
    color: #c12e3d!important;
    font-weight: bold;
}
.category-price-text.text-red,.category-price-per-person.text-red {
    color: #000 !important;
}
.section-cruise-cabin .section-stateroom-deckplan-details .section-ship-deckplan-details .section-showing-deckplan .alert {
    text-align: center !important;
}
label.pass-form-title.text-nowrap {
    color: #141414;
    font-family: 'proxima-nova';
}
.d-sm-flex.flex-equal.flex-wrap.align-items-center.search-booking-form {
    padding-top: 25px;
}
.search-booking-panel.mb-3.py-3 {
    width: 800px;
    margin: 0 auto;
}
a.share-icon {
    background: #fff;
}

img.resultSalesImgSm {
    width: 24px;
    height: 24px;
    margin-right: 8px;
}

@media (max-width: 767px) {
    .search-booking-panel.mb-3.py-3 {
        width: 100%;
        margin: 0 auto;
    }
    ul.bookingpagelist {
        padding: 0px 20px !important;
        display: inherit !important;
    }
    .bookingpagelist li {
        padding-top: 10px;
        padding-bottom: 10px;
        width: 100% !important;
    }
    .resultSalesImgSm ~ .fs14.spanpadding.pl-1 {
        display: none;
    }
    .resultSalesImgSm ~ .odi.odi-clone {
        display: none;
    }
    .price-column a {
        width: 25%;
        float: left;
        margin-bottom: 5px !important;
    }
    ul.bookingpagelist li:nth-child(3){
        margin-left: 0 !important;
    }
    .category-price-table .category-price-table-row .category-price-table-column .price-column {
        -webkit-box-pack: start;
        -ms-flex-pack: start;
        justify-content: center;
        align-items: center;
        width: 100px;
    }
    .progress-stepper-arrow {
        padding-top: 20px;
    }
    .bg-primary.text-white.checkout-steps-wrap * {
      font-size: 17px;
    }
    .stepper-with-arrow{
        margin-top: 20px;
    }
}

@media (min-width: 768px) {
  .category-price-table-column .price-column a {
    padding-bottom: 5px;
  }
  .category-price-table-column.passenger-price span br {
    display: none;
  }
  .category-price-table-header > div:first-child {
    padding-left: 20px !important;
  }
}

.category-price-table-header > div {
    padding: 10px !important;
    display: flex;
    vertical-align: middle;
    align-items: center;
  }

@media (min-width: 1025px) {
  .category-price-table .category-price-table-row .category-price-table-column {
    line-height: normal;
  }
}

@media (max-width: 1100px) {
  .category-price-table .category-price-table-row .category-price-table-column {
    white-space: normal !important;
    display: flex;
  }
}

.subtext {
    text-align: center;
    font-family: 'proxima-nova';
    color: #6e6e6e;
    margin-bottom: 15px;
}

ul.bookingpagelist {
    list-style: none;
    margin: 0;
    padding: 0 120px;

    display: flex;
}
ul.bookingpagelist li:nth-child(3) {
    width: 30%;
    margin-left: 38px;
}
.bookingpagelist li {
    width: 33%;
    padding-left: 24px;
    font-family: 'proxima-nova';
    color: #6e6e6e;
    background: url(transition-img/check-icon.png) no-repeat left;
}
.stepper-with-arrow{
    margin-bottom: 30px;
}
/* backend changes start */

/* pricing section */
.summary-table-wrap .summary-table.priceSummary .row{
  border-bottom: 1px solid #90989b;
  }
  .summary-table-wrap .summary-table.priceSummary .col-xs-6.text-right{
    border-left:1px solid #90989b;
        padding-bottom: 10px;
  }
  .summary-table-wrap .summary-table.priceSummary .mar-sm-top{
      margin-top: 0px;
  }
  .summary-table-wrap div.priceSummary.summary-table {
      padding: 0px 10px 10px !important;
  }
  .main .summary-table.visible-xs .col-xs-6.text-left{
        padding: 2px 10px;
  }
  /* pricing section */

/* Insurance Popover styles */
.insurance-sec div#InsDescription.modal p, .insurance-sec div#InsDescription.modal p * {
  font-weight: normal;
  text-transform: none;
  line-height: 22px;
}
.insurance-sec div#InsDescription.modal p span {
  line-height: normal;
}
.insurance-sec div#InsDescription.modal table td:first-child {
  color: #333;
}
.insurance-sec div#InsDescription.modal table td,
.insurance-sec div#InsDescription.modal table {
  border: none;
}
.insurance-sec div#InsDescription.modal * {font-family: "Arial";}
/* End insurance popover style */
.modal-dialog.modal-message-content,
.modal .modal-sm,
.modal-dialog {
	max-width: 810px;
}


.embed-responsive-item {
    height: auto !important;
}

.ship-image {
    height: 250px;
}
/*
.embed-responsive-item {
    height: auto !important;
}

.embed-responsive {
    height: auto !important;
    max-height: 300px;
}
*/
div#cruiseline-video-holder div.embed-responsive {
    height: auto !important;
    max-height: inherit;
}

div#cruiseline-video-holder div.embed-responsive img.embed-responsive-item {
    height: auto !important;
}

div.stepper-with-arrow > div.container-fluid > div.mb-3.confirm-button {
    margin-bottom: 0px !important;
}

div.cruise-details-outer div div.embed-responsive{
    height: auto !important;
    max-height: 224px !important;
}

.modal-dialog {
    max-width: 810px !important;
}

div.category-cabin-details-img a.embed-responsive {
    height: auto !important;
    max-height: 313px !important;
}

div.cruise-details-outer div.modal div.modal-dialog.ship-info-modal div.modal-content div.modal-body div.embed-responsive {
    height: auto !important;
    max-height: none !important;
    min-height: 507px !important;
}

div.cruise-details-outer div.modal div.modal-dialog.ship-info-modal div.modal-content div.modal-body div.embed-responsive iframe {
    height: auto !important;
    max-height: none !important;
    min-height: 507px !important;
}

div.carousel-inner div.carousel-item div.embed-responsive::before {
    padding-bottom: 0px !important;
}

@media (max-width: 767px) {

    div.cruise-details-outer div div.embed-responsive{
        height: auto !important;
        max-height: 224px !important;
    }

    .ship-info-content {
        height: 462px !important;
    }

    
    div.card-body.category-cruise-content div.category-cabin-details div div div.category-cabin-details-img a.embed-responsive {
        height: auto !important;
        max-height: 200px !important;
    }
}

/* -------------------------------------------------------
   FIX 1: Remove white gap below CruiseWatch header bar.
   The booking platform wraps all pages in a flex column container;
   the first .row inside stretches to 114px due to flexbox alignment.
   This constrains it to the 64px height of the actual header bar.
   Applies to ALL steps of the booking flow automatically.
   ------------------------------------------------------- */
.container-fluid.d-flex.flex-column > .row:first-child {
    max-height: 64px !important;
    min-height: 0 !important;
    overflow: hidden !important;
}

/* -------------------------------------------------------
   FIX 3: Remove excess left padding on Bonus Offers items
   in the booking sidebar (all steps of the booking flow).
   The existing rule sets padding: 0 120px on bookingpagelist
   which pushes all items 120px from the left edge.
   ------------------------------------------------------- */
ul.bookingpagelist {
    padding: 0 !important;
}
.bookingpagelist li {
    padding-left: 30px !important;
}
 
/* -------------------------------------------------------
   FIX 4: Reduce spacing between stepper and page content.
   Default margin-bottom: 30px creates too much space above
   the orange countdown bar on checkout.aspx (non-swift) and
   above content on swift pages. Applies to both flows.
   ------------------------------------------------------- */
.stepper-with-arrow {
    margin-bottom: 10px !important;
}
 
/* -------------------------------------------------------
   FIX 5: Change accordion section header bars to CruiseWatch
   navy (#295196) instead of the platform's default blue.
   Targets "PASSENGER INFORMATION" and "PAYMENT INFORMATION"
   expand/collapse headers on the checkout page.
   ------------------------------------------------------- */
.client-header .bg-primary,
.section-collapsible-title.bg-primary {
    background-color: #295196 !important;
}
.client-header .btn-primary {
    background-color: #295196 !important;
    border-color: #1f3f78 !important;
}
.client-header .btn-primary:hover {
    background-color: #1f3f78 !important;
}

/* -------------------------------------------------------
   FIX 6: Remove extra bottom padding on embed-responsive::before
   inside the "Upgrade your stateroom!" section on cabin.aspx.
   The ::before pseudo-element gets both padding-top AND
   padding-bottom applied, doubling the container height to ~495px
   and leaving ~250px of blank space below each upgrade image.
   Zeroing padding-bottom restores the correct 3:2 aspect ratio.
   ------------------------------------------------------- */
.upgrade-room-box .embed-responsive::before {
    padding-bottom: 0px !important;
}
.upgrade-room-box .embed-responsive {
    max-height: 280px !important;
}

/* -------------------------------------------------------
   FIX 7: Add 20px top padding to main content area on
   non-swift (ASP.NET) booking pages — category, cabin,
   checkout. Prevents content from sitting flush against
   the breadcrumb stepper bar.
   ------------------------------------------------------- */
.client-header .main-section-outer.mt-0 {
    padding-top: 20px !important;
}

/* -------------------------------------------------------
   FIX 8: Remove default 30px margin on the Re-Price button
   wrapper on checkout.aspx. The margin creates unwanted
   spacing around the hidden/visible retry button.
   ------------------------------------------------------- */
div.retryPriceButton {
    margin: 0 !important;
}

/* -------------------------------------------------------
   FIX 9: Reduce bottom margin on the large booking-step
   indicator bar on the Sailing Details (swift) page.
   Default is 50px; reducing to 15px tightens the gap
   between the step bar and the cruise details content.
   ------------------------------------------------------- */
.checkout-steps-wrap.d-lg-flex.d-none.flex-equal {
    margin-bottom: 15px !important;
}