/* Site-wide "Book Now" enquiry modal — includes/book-modal.php.
   Layout follows the sibling regalyachtingmiami build (840px dialog, photo
   column + form column, ruled-paper message box); palette follows this site:
   navy #003D60, deep navy #022333, sand #D3AB80.

   Everything is scoped to .nybk and every rule that touches a bare element
   uses two classes. The modal renders outside .elementor, so it inherits none
   of the theme's box-sizing, while .elementor-kit-9 button (in post-9.css)
   still reaches it and would otherwise force 10px 40px padding, uppercase
   text and 2.5px letter-spacing onto the close and stepper buttons. */

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

.nybk {
  position: fixed; inset: 0; z-index: 999999;
  display: flex; align-items: center; justify-content: center; padding: 20px;
  background: rgba(2, 35, 51, .62);
  opacity: 0; visibility: hidden;
  transition: opacity .22s ease, visibility .22s ease;
}
.nybk.is-open { opacity: 1; visibility: visible; }
body.nybk-locked { overflow: hidden; }

.nybk-dialog {
  position: relative; display: flex; width: 100%; max-width: 840px;
  max-height: 92vh; background: #fff; overflow: hidden;
  transform: translateY(16px); transition: transform .22s ease;
}
.nybk.is-open .nybk-dialog { transform: none; }

.nybk .nybk-close {
  position: absolute; top: 10px; right: 12px; z-index: 5;
  width: 30px; height: 30px; padding: 0; margin: 0; border: 0; border-radius: 0;
  background: none; color: #022333; cursor: pointer;
  font: 400 26px/1 Georgia, serif; letter-spacing: 0; text-transform: none;
  display: flex; align-items: center; justify-content: center;
}
.nybk .nybk-close:hover { color: #003D60; }

.nybk-media {
  flex: 0 0 280px;
  background-position: center; background-size: cover; background-repeat: no-repeat;
}

.nybk-body { flex: 1 1 0; min-width: 0; padding: 38px 30px; overflow-y: auto; }
.nybk-eyebrow {
  margin: 0 0 8px; color: #003D60;
  font-size: 11px; letter-spacing: 3px; text-transform: uppercase;
}
.nybk-body h2 {
  margin: 0 0 8px; color: #022333;
  font-family: 'Roboto Slab', Georgia, serif; font-weight: 400;
  font-size: 30px; line-height: 1.15; letter-spacing: .5px;
}
.nybk-lede { margin: 0 0 24px; color: #5b6470; font-size: 14px; line-height: 1.6; }

.nybk-msg { margin: 0 0 18px; padding: 12px 15px; font-size: 13.5px; line-height: 1.55; }
.nybk-msg--error { background: #fdf2f2; border: 1px solid #f0c4c4; color: #8f2f2f; }
.nybk-msg--ok    { background: #eaf4ec; border: 1px solid #b8dcc2; color: #215c33; }

.nybk-cols { display: flex; gap: 20px; }
.nybk-left  { flex: 0 0 calc(50% - 10px); width: calc(50% - 10px); display: flex; flex-direction: column; row-gap: 15px; }
.nybk-right { flex: 0 0 calc(50% - 10px); width: calc(50% - 10px); border-left: 1px solid #d9d3c9; padding-left: 20px; }

.nybk .nybk-input {
  width: 100%; padding: 7px 0; border: 0; border-bottom: 1px solid #022333; border-radius: 0;
  background: transparent; color: #022333;
  font-family: inherit; font-size: 15px; line-height: 1.4;
}
.nybk .nybk-input::placeholder { color: #6d7681; opacity: 1; }
.nybk .nybk-input:focus { outline: none; border-bottom-color: #003D60; }

.nybk-label {
  display: block; margin-bottom: 8px; color: #022333;
  font-size: 11px; letter-spacing: .08em; text-transform: uppercase;
}
.nybk-req { color: #b4472f; }

.nybk-datepicker {
  display: flex; align-items: center; justify-content: space-between;
  height: 44px; padding: 4px; border: 1px solid #022333;
}
.nybk .nybk-date-input {
  flex: 1 1 0; min-width: 0; border: 0; background: none; text-align: center;
  color: #022333; font-family: inherit; font-size: 13px; cursor: default;
}
.nybk .nybk-date-input:focus { outline: none; }
.nybk .nybk-date-nav {
  flex: 0 0 auto; width: 30px; height: 30px; padding: 0; margin: 0;
  border: 0; border-radius: 0; background: none; color: #022333;
  cursor: pointer; letter-spacing: 0;
  display: flex; align-items: center; justify-content: center;
}
.nybk .nybk-date-nav:hover { color: #003D60; }
.nybk .nybk-date-nav svg { width: 16px; height: 16px; display: block; }
.nybk .nybk-date-nav[disabled] { opacity: .3; cursor: not-allowed; }

.nybk .nybk-select {
  width: 100%; height: 44px; padding: 4px 10px; border: 1px solid #022333; border-radius: 0;
  background: #fff; color: #022333; font-family: inherit; font-size: 14px;
}
.nybk .nybk-select:focus { outline: none; border-color: #003D60; }

/* Ruled-paper message box, as on the Miami modal. 40px line-height has to
   match the gradient's 40px stripe or the text drifts off the rules. */
.nybk .nybk-textarea {
  width: 100%; height: 268px; margin-top: 4px; padding: 0 1px;
  border: 0; border-radius: 0; resize: none; color: #022333;
  font-family: inherit; font-size: 15px; line-height: 40px;
  background: repeating-linear-gradient(#fff, #fff 39px, #d9d3c9 40px);
}
.nybk .nybk-textarea:focus { outline: none; }

.nybk .nybk-submit {
  display: block; width: 100%; margin-top: 20px; padding: 13px 40px;
  border: 0; border-radius: 0; background: #D3AB80; color: #022333;
  font-family: inherit; font-size: 12px; font-weight: 500;
  letter-spacing: 2.5px; text-transform: uppercase; text-align: center;
  cursor: pointer; transition: background .2s ease;
}
.nybk .nybk-submit:hover { background: #c1955f; }
.nybk .nybk-submit[disabled] { opacity: .65; cursor: not-allowed; }

.nybk-alt { margin: 14px 0 0; text-align: center; font-size: 13px; color: #5b6470; }
.nybk-alt a { color: #003D60; }

/* Honeypot: out of sight, out of the tab order, out of assistive tech. */
.nybk-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }

.nybk .form-recaptcha-note { margin: 12px 0 0; font-size: 11px; line-height: 1.5; color: #8a9099; }
.nybk .form-recaptcha-note a { color: #5b6470; }

@media (max-width: 767px) {
  .nybk { padding: 12px; }
  .nybk-dialog { flex-direction: column; max-height: 94vh; overflow-y: auto; }
  .nybk-media { flex: 0 0 130px; min-height: 130px; }
  .nybk-body { padding: 26px 18px; overflow: visible; }
  .nybk-body h2 { font-size: 25px; }
  .nybk-cols { flex-direction: column; gap: 16px; }
  .nybk-left, .nybk-right { flex-basis: auto; width: 100%; }
  .nybk-right { border-left: 0; border-top: 1px solid #d9d3c9; padding: 16px 0 0; }
  .nybk .nybk-textarea { height: 160px; }
}

/* ---- Validation feedback (Prompt F) -------------------------------------
   A field that failed gets a red rule and its own message directly beneath,
   so the message is next to the thing it is about. The summary at the top
   repeats them as links for anyone arriving by keyboard or screen reader. */
.nybk-fielderr{
  margin:6px 0 0;
  font:500 12.5px/1.45 var(--nybk-font,inherit);
  color:#b3261e;
  letter-spacing:.01em;
}
.nybk-input[aria-invalid="true"],
.nybk-select[aria-invalid="true"],
.nybk-textarea[aria-invalid="true"]{
  border-color:#b3261e;
  box-shadow:0 0 0 1px rgba(179,38,30,.25);
}
.nybk-errlist{
  margin:8px 0 0;
  padding-left:18px;
  font-size:13px;
}
.nybk-errlist a{ color:inherit; text-decoration:underline; }
.nybk-errlist a:focus-visible{ outline:2px solid currentColor; outline-offset:2px; }
#nybk-summary:focus{ outline:2px solid #b3261e; outline-offset:3px; }
.nybk-date-input[aria-invalid="true"]{ border-color:#b3261e; }
.nybk-datepicker:has(.nybk-date-input[aria-invalid="true"]){ box-shadow:0 0 0 1px rgba(179,38,30,.25); }