/*!
 * bs-compat.css
 * ---------------------------------------------------------------------------
 * Replaces css/bootstrap.min.css (Bootstrap v4.6.2, 162KB) during the
 * Bootstrap -> Tailwind migration.
 *
 * WHY THIS FILE EXISTS
 * The site's own CSS (style.css, custom.css, plugin.css, default.css,
 * flight.css) contains ~977 selectors that target Bootstrap class names --
 * e.g. `.navbar-default .navbar-brand:hover`, `.header_menu .nav.navbar-nav
 * li > a`. Those rules carry the actual design and cannot be expressed as
 * Tailwind utilities. So the component class names stay in the markup as
 * plain CSS hooks, and this file supplies the base declarations Bootstrap
 * used to provide underneath them.
 *
 * WHAT IS IN HERE
 *   1. Reboot          - verbatim. The whole design sits on this baseline
 *                        (box-sizing, body font/line-height/colour, heading
 *                        and list margins). Dropping it would shift type
 *                        on every page.
 *   2. Components      - verbatim, but only the ones the markup actually
 *                        uses, confirmed by auditing all 25 PHP files.
 *
 * WHAT IS DELIBERATELY *NOT* IN HERE
 *   - The grid (.container/.row/.col-*) -> now Tailwind utilities in markup.
 *   - Spacing/display/text utilities     -> now Tailwind utilities in markup.
 *   - Every unused Bootstrap component (cards, alerts, modals, carousel,
 *     badges, pagination, spinners, toasts, ...).
 *
 * Declarations are copied byte-for-byte from Bootstrap 4.6.2 and this file
 * loads in the exact slot bootstrap.min.css used to occupy (first, before
 * default.css), so the cascade the theme was authored against is unchanged.
 *
 * Bootstrap is MIT licensed. Copyright 2011-2022 The Bootstrap Authors.
 */

/* ==========================================================================
   1. VARIABLES
   ========================================================================== */

:root {
  --blue: #007bff;
  --indigo: #6610f2;
  --purple: #6f42c1;
  --pink: #e83e8c;
  --red: #dc3545;
  --orange: #fd7e14;
  --yellow: #ffc107;
  --green: #28a745;
  --teal: #20c997;
  --cyan: #17a2b8;
  --white: #fff;
  --gray: #6c757d;
  --gray-dark: #343a40;
  --primary: #007bff;
  --secondary: #6c757d;
  --success: #28a745;
  --info: #17a2b8;
  --warning: #ffc107;
  --danger: #dc3545;
  --light: #f8f9fa;
  --dark: #343a40;
  --breakpoint-xs: 0;
  --breakpoint-sm: 576px;
  --breakpoint-md: 768px;
  --breakpoint-lg: 992px;
  --breakpoint-xl: 1200px;
  --font-family-sans-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
}

/* ==========================================================================
   2. REBOOT  (verbatim - this is the typographic baseline of the site)
   ========================================================================== */

*,
::after,
::before { box-sizing: border-box; }

html {
  font-family: sans-serif;
  line-height: 1.15;
  -webkit-text-size-adjust: 100%;
  -webkit-tap-highlight-color: transparent;
}

article, aside, figcaption, figure, footer, header, hgroup, main, nav, section { display: block; }

body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: left;
  background-color: #fff;
}

[tabindex="-1"]:focus:not(:focus-visible) { outline: 0 !important; }

hr { box-sizing: content-box; height: 0; overflow: visible; }

h1, h2, h3, h4, h5, h6 { margin-top: 0; margin-bottom: .5rem; }

p { margin-top: 0; margin-bottom: 1rem; }

abbr[data-original-title],
abbr[title] {
  text-decoration: underline;
  -webkit-text-decoration: underline dotted;
  text-decoration: underline dotted;
  cursor: help;
  border-bottom: 0;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
}

address { margin-bottom: 1rem; font-style: normal; line-height: inherit; }

dl, ol, ul { margin-top: 0; margin-bottom: 1rem; }
ol ol, ol ul, ul ol, ul ul { margin-bottom: 0; }
dt { font-weight: 700; }
dd { margin-bottom: .5rem; margin-left: 0; }

blockquote { margin: 0 0 1rem; }

b, strong { font-weight: bolder; }
small { font-size: 80%; }
sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline; }
sub { bottom: -.25em; }
sup { top: -.5em; }

a { color: #007bff; text-decoration: none; background-color: transparent; }
a:hover { color: #0056b3; text-decoration: underline; }
a:not([href]):not([class]) { color: inherit; text-decoration: none; }
a:not([href]):not([class]):hover { color: inherit; text-decoration: none; }

code, kbd, pre, samp {
  font-family: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  font-size: 1em;
}
pre { margin-top: 0; margin-bottom: 1rem; overflow: auto; -ms-overflow-style: scrollbar; }

figure { margin: 0 0 1rem; }

img { vertical-align: middle; border-style: none; }
svg { overflow: hidden; vertical-align: middle; }

table { border-collapse: collapse; }
caption { padding-top: .75rem; padding-bottom: .75rem; color: #6c757d; text-align: left; caption-side: bottom; }
th { text-align: inherit; text-align: -webkit-match-parent; }

label { display: inline-block; margin-bottom: .5rem; }

button { border-radius: 0; }
button:focus:not(:focus-visible) { outline: 0; }
button, input, optgroup, select, textarea { margin: 0; font-family: inherit; font-size: inherit; line-height: inherit; }
button, input { overflow: visible; }
button, select { text-transform: none; }
[role=button] { cursor: pointer; }
select { word-wrap: normal; }
[type=button], [type=reset], [type=submit], button { -webkit-appearance: button; }
[type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) { cursor: pointer; }
[type=button]::-moz-focus-inner, [type=reset]::-moz-focus-inner, [type=submit]::-moz-focus-inner, button::-moz-focus-inner { padding: 0; border-style: none; }
input[type=checkbox], input[type=radio] { box-sizing: border-box; padding: 0; }
textarea { overflow: auto; resize: vertical; }
fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
legend { display: block; width: 100%; max-width: 100%; padding: 0; margin-bottom: .5rem; font-size: 1.5rem; line-height: inherit; color: inherit; white-space: normal; }
progress { vertical-align: baseline; }
[type=number]::-webkit-inner-spin-button, [type=number]::-webkit-outer-spin-button { height: auto; }
[type=search] { outline-offset: -2px; -webkit-appearance: none; }
[type=search]::-webkit-search-decoration { -webkit-appearance: none; }
::-webkit-file-upload-button { font: inherit; -webkit-appearance: button; }
output { display: inline-block; }
summary { display: list-item; cursor: pointer; }
template { display: none; }
[hidden] { display: none !important; }

/* ==========================================================================
   3. COMPONENTS IN USE
   Each block notes where the markup uses it.
   ========================================================================== */

/* --- transitions / visibility state -------------------------------------
   .fade + .show drive the room-page tab panes.
   .collapse drives the mobile nav drawer in include/header.php.
   These are the classes js/bs-compat.js toggles.                          */

.fade { transition: opacity .15s linear; }
@media (prefers-reduced-motion: reduce) {
  .fade { transition: none; }
}
.fade:not(.show) { opacity: 0; }

.collapse:not(.show) { display: none; }

.collapsing {
  position: relative;
  height: 0;
  overflow: hidden;
  transition: height .35s ease;
}
@media (prefers-reduced-motion: reduce) {
  .collapsing { transition: none; }
}

/* --- dropdown -----------------------------------------------------------
   include/header.php: the Rooms and Services mega menus.
   NOTE: `.navbar-nav .dropdown-menu { position: static; float: none }` is
   part of stock Bootstrap and the mega menus are inside .navbar-nav, so it
   is kept here verbatim -- custom.css relies on overriding it, and removing
   it would change what the theme's own rules resolve against.             */

.dropdown, .dropleft, .dropright, .dropup { position: relative; }

.dropdown-toggle { white-space: nowrap; }
.dropdown-toggle::after {
  display: inline-block;
  margin-left: .255em;
  vertical-align: .255em;
  content: "";
  border-top: .3em solid;
  border-right: .3em solid transparent;
  border-bottom: 0;
  border-left: .3em solid transparent;
}
.dropdown-toggle:empty::after { margin-left: 0; }

.dropdown-menu {
  position: absolute;
  top: 100%;
  left: 0;
  z-index: 1000;
  display: none;
  float: left;
  min-width: 10rem;
  padding: .5rem 0;
  margin: .125rem 0 0;
  font-size: 1rem;
  color: #212529;
  text-align: left;
  list-style: none;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid rgba(0, 0, 0, .15);
  border-radius: .25rem;
}
.dropdown-menu.show { display: block; }

.dropdown-item {
  display: block;
  width: 100%;
  padding: .25rem 1.5rem;
  clear: both;
  font-weight: 400;
  color: #212529;
  text-align: inherit;
  white-space: nowrap;
  background-color: transparent;
  border: 0;
}
.dropdown-item:focus, .dropdown-item:hover { color: #16181b; text-decoration: none; background-color: #e9ecef; }
.dropdown-item.active, .dropdown-item:active { color: #fff; text-decoration: none; background-color: #007bff; }
.dropdown-item.disabled, .dropdown-item:disabled { color: #adb5bd; pointer-events: none; background-color: transparent; }

/* --- nav / navbar -------------------------------------------------------
   include/header.php: <nav class="navbar navbar-default">, .nav.navbar-nav,
   .navbar-brand, .navbar-collapse.
   .navbar-default, .navbar-header and .navbar-toggle are Bootstrap *3*
   names that BS4 never styled -- they are defined entirely in style.css /
   custom.css, so nothing for them is needed here.                         */

.nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}

.nav-link { display: block; padding: .5rem 1rem; }
.nav-link:focus, .nav-link:hover { text-decoration: none; }
.nav-link.disabled { color: #6c757d; pointer-events: none; cursor: default; }

/* nav-pills: room-page tab buttons (super-deluxe-bathtub.php) */
.nav-pills .nav-link { background: 0 0; border: 0; border-radius: .25rem; }
.nav-pills .nav-link.active, .nav-pills .show > .nav-link { color: #fff; background-color: #007bff; }

.navbar {
  position: relative;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
  padding: .5rem 1rem;
}

/* The header markup is <nav class="navbar"><div class="container">, and the
   container is now a Tailwind-built element. Bootstrap flexed that child,
   so the same rule is kept, matched on the data hook the migrated markup
   carries as well as the legacy .container selector. */
.navbar > .navbar-container,
.navbar .container,
.navbar .container-fluid {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.navbar-brand {
  display: inline-block;
  padding-top: .3125rem;
  padding-bottom: .3125rem;
  margin-right: 1rem;
  font-size: 1.25rem;
  line-height: inherit;
  white-space: nowrap;
}
.navbar-brand:focus, .navbar-brand:hover { text-decoration: none; }

.navbar-nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  padding-left: 0;
  margin-bottom: 0;
  list-style: none;
}
.navbar-nav .nav-link { padding-right: 0; padding-left: 0; }
.navbar-nav .dropdown-menu { position: static; float: none; }

.navbar-collapse {
  -ms-flex-preferred-size: 100%;
  flex-basis: 100%;
  -ms-flex-positive: 1;
  flex-grow: 1;
  -ms-flex-align: center;
  align-items: center;
}

/* --- tabs ---------------------------------------------------------------
   The 9 room pages use .tab-content > .tab-pane.                          */

.tab-content > .tab-pane { display: none; }
.tab-content > .active { display: block; }

/* --- breadcrumb ---------------------------------------------------------
   Every inner page has a .breadcrumb list in its page header.             */

.breadcrumb {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: .75rem 1rem;
  margin-bottom: 1rem;
  list-style: none;
  background-color: #e9ecef;
  border-radius: .25rem;
}
.breadcrumb-item + .breadcrumb-item { padding-left: .5rem; }
.breadcrumb-item + .breadcrumb-item::before { float: left; padding-right: .5rem; color: #6c757d; content: "/"; }
.breadcrumb-item + .breadcrumb-item:hover::before { text-decoration: underline; }
.breadcrumb-item + .breadcrumb-item:hover::before { text-decoration: none; }
.breadcrumb-item.active { color: #6c757d; }

/* --- buttons ------------------------------------------------------------
   .btn is used 29x sitewide, always paired with a theme skin such as
   .btn-orange (defined in custom.css, not Bootstrap).                     */

.btn {
  display: inline-block;
  font-weight: 400;
  color: #212529;
  text-align: center;
  vertical-align: middle;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: .375rem .75rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: .25rem;
  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) {
  .btn { transition: none; }
}
.btn:hover { color: #212529; text-decoration: none; }
.btn.focus, .btn:focus { outline: 0; box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25); }
.btn.disabled, .btn:disabled { opacity: .65; }
.btn:not(:disabled):not(.disabled) { cursor: pointer; }

/* --- forms --------------------------------------------------------------
   contact.php and the index.php enquiry form.                             */

.form-group { margin-bottom: 1rem; }

.form-control {
  display: block;
  width: 100%;
  height: calc(1.5em + .75rem + 2px);
  padding: .375rem .75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #495057;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  border-radius: .25rem;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}
@media (prefers-reduced-motion: reduce) {
  .form-control { transition: none; }
}
.form-control::-ms-expand { background-color: transparent; border: 0; }
.form-control:focus {
  color: #495057;
  background-color: #fff;
  border-color: #80bdff;
  outline: 0;
  box-shadow: 0 0 0 .2rem rgba(0, 123, 255, .25);
}
.form-control::-webkit-input-placeholder { color: #6c757d; opacity: 1; }
.form-control::-moz-placeholder { color: #6c757d; opacity: 1; }
.form-control:-ms-input-placeholder { color: #6c757d; opacity: 1; }
.form-control::-ms-input-placeholder { color: #6c757d; opacity: 1; }
.form-control::placeholder { color: #6c757d; opacity: 1; }
.form-control:disabled, .form-control[readonly] { background-color: #e9ecef; opacity: 1; }