/* aa-design.css: Aristocrat Holiday Apartments desktop parity layer (Stage 4). Loads after the ported live CSS (aa-neutral.css first, then aa-bundle.css,
   aa-live.css) and before aa-mobile.css (the designed bands below 1250px). aa-neutral.css (the Stage 3 Divi neutraliser) stays first in the list.
   Every rule here either undoes something Divi adds that live (Bootstrap 3 + iLaunch general.css and home.css) never had, or puts back a live rule that
   the CSS port scoped under #page-container although its element lives outside it (the photo pop-up is appended to <body>).
   Measured against live with build/stage4/design_pairs_aa.js + design_diff.py at 1440. Bootstrap 3 sizes everything border-box, like Divi, so no
   content-box restore is needed on this template. /news and /wifi-terms are stand-alone documents on live's own sheets and never load this file. */

/* ---------- 1. Divi leaks the neutraliser does not cover ---------- */
/* Divi forces greyscale font smoothing (macOS): live uses the browser default */
body.aa-site { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }
/* Divi gives every image and video max-width:100%: live's pictures render at their own size (the 500px photos in the top 10 table shrank to 140px and
   that page came out 24px short); the home hero video is wider than the screen on live (it covers the box) and was squeezed to the screen width */
body.aa-site #page-container img { max-width: none; }
body.aa-site #page-container #featuremain video { max-width: none; }
/* Divi's `.et-l--body ul { list-style-type: disc }` reaches nested lists: live's nested lists (the site map) keep the browser's circle, then square */
body.aa-site #page-container .page-content ul ul { list-style-type: circle; }
body.aa-site #page-container .page-content ul ul ul { list-style-type: square; }
/* the blog views load Divi's own nav stylesheet: its `.nav li { line-height: 1em }` shrank the menu items' line boxes, and its `.nav li ul
   { visibility: hidden; opacity: 0; box-shadow }` (undone only on :hover) hid the drop-downs from keyboards and drew a shadow live does not have.
   Live shows and hides the drop-down with display alone. */
body.aa-site #page-container #navbar .nav li { line-height: inherit; }
body.aa-site #page-container #navbar .nav li ul { visibility: visible; opacity: 1; box-shadow: none; }
/* search form: live's keyword field is an unstyled input (the browser's own field); Divi restyles bare inputs (revert, not the computed values: an
   author-set border makes Chrome drop the native look) */
body.aa-site #page-container .page-content table.searchpage input[type="text"] { -webkit-appearance: revert; appearance: revert; padding: revert; border: revert; border-radius: revert; background: revert; }
/* Divi's content-table width:100% reaches the search table (live: as wide as its field and button) */
body.aa-site #page-container .page-content table.searchpage { width: auto; }

/* ---------- 2. Photo pop-up (fancybox 1.3.4, appended to <body>): its frame and shadow pieces carry the class .fancy-bg, which the port scoped under
   #page-container, so they lost their 20px size and absolute position. Live's rule, unscoped. Live's Bootstrap `* { box-sizing: border-box }` reaches
   the pop-up too, except the frame, its outer box and the inner picture box (the port forced content-box on all of it). ---------- */
body.aa-site .fancy-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; }
body.aa-site :is(#fancybox-tmp, #fancybox-loading, #fancybox-loading *, #fancybox-overlay, #fancybox-wrap *) { box-sizing: border-box; }
body.aa-site :is(#fancybox-wrap, #fancybox-outer, #fancybox-inner) { box-sizing: content-box; }

/* From 1200 live gives the hero a 127px top margin, which collapses through live's <body> (position: relative), so every pop-up (positioned against
   <body>) opens 127px lower than fancybox's centre on live. Divi's wrappers stop that collapse here; from 1250 the pop-up takes the same 127px, so it
   opens where live's does (below 1250 it stays centred: aa-mobile.css leaves it alone). */
@media (min-width: 1250px) {
  body.aa-site #fancybox-wrap { margin-top: 127px; }
}
/* The wifi terms pop-up loads live's stand-alone /wifi-terms fragment into the pop-up, outside #page-container, where the port's scoped copies of live's
   `.blank-wrapper { min-width: 320px }`, `.page-content` and `p` rules do not reach (and Divi's own `p { padding-bottom: 1em }` does): the pop-up came
   out 274px wide with its lines cut off. Live's rules, for content inside the pop-up only, as weak as live's element rules (the fragment's inline
   styles still win). */
body.aa-site :where(#fancybox-tmp, #fancybox-wrap) .blank-wrapper { padding: 0; width: 100%; min-width: 320px; min-height: 200px; }
body.aa-site :where(#fancybox-tmp, #fancybox-wrap) .page-content { position: relative; padding: 0 0 20px 0; }
body.aa-site :where(#fancybox-tmp, #fancybox-wrap) p { margin: 0 0 20px 0; padding-bottom: 0; font-size: 12px; line-height: 20px; }
@media (min-width: 768px) {
  body.aa-site :where(#fancybox-tmp, #fancybox-wrap) p { font-size: 18px; line-height: 28px; }
}

/* ---------- 3. Contact, review and newsletter unsubscribe forms: Divi contact-form modules dressed as live's Bootstrap 3 forms (measured at 1440):
   label Roboto 16px/28px bold white, 5px above a 34px field (6px 12px padding, Roboto 14px/20px, 1px #ccc border, faint inset shadow), 15px between
   groups, a 74px comments box, the Verification group (label, then a 78px area where live shows Google's reCAPTCHA box: here Divi's maths question
   and its field), and live's SUBMIT (.btn.btn-primary: Montserrat 16px bold capitals, 1px letter spacing, 45px tall, 0 80px padding, black on #f1ad46;
   hovered white with orange words; focused Bootstrap's white on #286090). ---------- */
body.aa-site #page-container .aa-contact-form { margin: 0; padding: 0; background: none; }
body.aa-site #page-container .aa-contact-form .et_pb_contact { padding: 0; margin: 0; }
body.aa-site #page-container .aa-contact-form form.et_pb_contact_form { display: block; margin: 0; padding: 0; }
/* (16px/28px like live's .form-group div: Divi's 18px paragraph font made each group 1px taller around the inline-block label) */
body.aa-site #page-container .aa-contact-form p.et_pb_contact_field { float: none; clear: both; width: auto; margin: 0 0 15px; padding: 0; font-size: 16px; line-height: 28px; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_form_label { display: inline-block; margin: 0 0 5px; padding: 0; font: 700 16px/28px 'Roboto', Arial, Helvetica, sans-serif; color: #ffffff; text-transform: none; }
body.aa-site #page-container .aa-contact-form .et_pb_contact p input.input,
body.aa-site #page-container .aa-contact-form .et_pb_contact p textarea.input {
  display: block; width: 100%; height: 34px; margin: 0; padding: 6px 12px; border: 1px solid #cccccc; border-radius: 0; background-color: #ffffff;
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); font: 400 14px/20px 'Roboto', Arial, Helvetica, sans-serif; color: #333333; }
body.aa-site #page-container .aa-contact-form .et_pb_contact p input.input[data-field_type="email"],
body.aa-site #page-container .aa-contact-form .et_pb_contact p textarea.input { color: #555555; }
body.aa-site #page-container .aa-contact-form .et_pb_contact p textarea.input { height: 74px; min-height: 0; resize: vertical; }
body.aa-site #page-container .aa-contact-form .et_pb_contact .input::placeholder { color: #999999; opacity: 1; }
body.aa-site #page-container .aa-contact-form .et_pb_contact .input:focus { border-color: #66afe9; outline: 0; box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(102, 175, 233, 0.6); }
/* Verification group: the label line, then a 78px area (live's reCAPTCHA box) holding the question and its field, 15px below */
body.aa-site #page-container .aa-contact-form .et_contact_bottom_container { display: block; float: none; clear: both; margin: 0; padding: 0; text-align: left; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_right { display: block; float: none; margin: 0 0 15px; padding: 0; text-align: left; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_right p.clearfix { display: block; float: none; box-sizing: border-box; height: 111px; margin: 0; padding: 0; font: 400 16px/34px 'Roboto', Arial, Helvetica, sans-serif; color: #ffffff; text-align: left; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_right p.clearfix::before { content: "Verification"; display: block; visibility: visible; height: 28px; margin: 0 0 5px; font-weight: 700; line-height: 28px; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_right p.clearfix::after { display: none; }
body.aa-site #page-container .aa-contact-form .et_pb_contact_captcha_question { font: 400 16px/34px 'Roboto', Arial, Helvetica, sans-serif; color: #ffffff; }
body.aa-site #page-container .aa-contact-form .et_pb_contact p input.input.et_pb_contact_captcha { display: inline-block; width: 80px; max-width: none; margin: 0 0 0 4px; vertical-align: top; color: #333333; }
/* SUBMIT */
body #page-container .et_pb_section .aa-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button.et_pb_contact_submit {
  display: inline-block; float: none; position: relative; height: 45px; margin: 0 !important; padding: 0 80px !important; border: 0 !important; border-radius: 0 !important;
  background: #f1ad46 !important; color: #000000 !important; font: 700 16px/45px 'Montserrat', Arial, Helvetica, sans-serif !important; letter-spacing: 1px !important;
  text-transform: uppercase; cursor: pointer; transition: none; }
body #page-container .et_pb_section .aa-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button.et_pb_contact_submit:focus { background: #286090 !important; color: #ffffff !important; padding: 0 80px !important; }
body #page-container .et_pb_section .aa-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button.et_pb_contact_submit:hover,
body #page-container .et_pb_section .aa-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button.et_pb_contact_submit:active { background: #ffffff !important; color: #f1ad46 !important; padding: 0 80px !important; }
body #page-container .et_pb_section .aa-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button.et_pb_contact_submit::after { display: none !important; }
/* the success line (Divi replaces the form with it) and the error list keep live's body text */
body.aa-site #page-container .aa-contact-form .et-pb-contact-message { font: 400 16px/28px 'Roboto', Arial, Helvetica, sans-serif; color: #ffffff; margin: 0; }
body.aa-site #page-container .aa-contact-form .et-pb-contact-message > * { margin: 0 0 15px; }
/* Reviews (page 1385): live's form is the boxed .form-standard (1px #eee border, 15px padding, 25px 200px margins at every width); the margin sits on
   the module so it collapses with the intro paragraph's margin, as live's form margin does */
body.aa-site.page-id-1385 #page-container .aa-contact-form { margin: 25px 200px; }
body.aa-site.page-id-1385 #page-container .aa-contact-form form.et_pb_contact_form { border: 1px solid #eeeeee; padding: 15px; }
/* Newsletter unsubscribe (1397): live's .form-horizontal from 768px (label in a 25% column, field in a 58.33% column of the 30px-wider Bootstrap row;
   the code and the button under the field); no "Verification" label */
@media (min-width: 768px) {
  body.aa-site.page-id-1397 #page-container .aa-contact-form form.et_pb_contact_form { display: grid; grid-template-columns: calc(25% + 7.5px) calc(58.3333% - 12.5px) 1fr; grid-auto-flow: row; margin: 0; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form p.et_pb_contact_field { display: contents; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form p.et_pb_contact_field > .et_pb_contact_form_label { grid-column: 1; align-self: start; display: block; margin: 0 0 15px; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form .et_pb_contact p.et_pb_contact_field > input.input { grid-column: 2; margin: 0 0 15px; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form .et_contact_bottom_container { grid-column: 2 / 4; padding-bottom: 15px; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form .et_pb_contact_right p.clearfix { height: 78px; }
  body.aa-site.page-id-1397 #page-container .aa-contact-form .et_pb_contact_right p.clearfix::before { content: none; display: none; }
}

/* ---------- 4. Keyboard focus: Divi's reset removes every outline (`:focus { outline: 0 }`, `a { outline: 0 }`); live shows the browser's ring (and
   Bootstrap's ring on links and buttons). Low specificity so live's own outline rules still decide where they exist. ---------- */
body.aa-site :focus-visible { outline: revert; }
/* controls whose own CSS removes the ring on live too (the phone menu button, the maths field): a ring only while focused from the keyboard */
body.aa-site #page-container .navbar-toggle:focus-visible { outline: 2px solid #0b3a60 !important; outline-offset: 2px; }
body.aa-site #page-container .aa-contact-form .et_pb_contact p input.input:focus-visible { outline: revert; }
/* the photo pop-up's links: live's Bootstrap `a:focus` ring and colour (Divi's reset removed them; kept as weak as an element rule) */
body.aa-site :where(#fancybox-wrap) a:focus { outline: 5px auto -webkit-focus-ring-color; outline-offset: -2px; }
/* ...and live's generic `a { color: #fff }` reaches the pop-up's close and arrow links (Divi's blue did here; no visible words, kept for parity) */
body.aa-site :where(#fancybox-wrap) a { color: #ffffff; }

/* ---------- 5. Phone numbers: explicit tel: links that keep the surrounding text's colour and look in every state (live shows plain text there) ---------- */
body.aa-site #page-container a.tel-link, body.aa-site #page-container a.tel-link:link, body.aa-site #page-container a.tel-link:visited,
body.aa-site #page-container a.tel-link:hover, body.aa-site #page-container a.tel-link:active, body.aa-site #page-container a.tel-link:focus,
body.aa-site a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font: inherit; }

/* ---------- 6. Google Translate button (in the header): Google's own `.goog-te-gadget-simple a { color: #000 }` wins over live's bare `a { color: #fff }`
   on live, but loses to the port's scoped `body.aa-site #page-container a` here, so the "Select Language" words were white on white. Google's colour,
   put back (the widget's words are Google's own 10pt Arial, as on live). ---------- */
body.aa-site #page-container #translate-widget .goog-te-gadget-simple a, body.aa-site #page-container #translate-widget .goog-te-gadget-simple a:is(:link, :visited, :hover, :focus, :active) { color: #000000; }

/* ---------- 7. The menu's Local Info and Contact Us items carry live's drop-down arrow as their background, which also clears the blue that live's own
   rule gives a focused item: a keyboard-focused parent showed white words on the white bar on live. While keyboard-focused only, its words take live's
   hovered colour (#176cb3, what a mouse sees when it points at the item); nothing changes for a mouse or a finger. ---------- */
body.aa-site #page-container .navbar-custom .navbar-nav > li > a.parent:focus-visible { color: #176cb3 !important; }

/* ---------- 8. Live's own copy carries an inline `outline: 0px` on some buttons (the top 10 page's white-underlined BOOK NOW and FIND OUT MORE), so they
   showed no focus ring on live either: a ring while keyboard-focused only ---------- */
body.aa-site #page-container .page-content a[style*="outline"]:focus-visible { outline: 2px solid #08304f !important; outline-offset: 2px !important; }

/* ---------- 9. Keyboard visitors (html.aa-kb, set by aa-sitewide.php on a key press and cleared by any pointer press): live opens the Local Info and
   Contact Us lists on mouse hover only, so Tour Desk, What's On, Blog, FAQs and Reviews could not be reached by Tab. From 1250 the list now also opens
   while focus is on its item or inside it, and Escape shuts it (li.aa-kb-shut). Nothing changes for a mouse. (768 to 1249: aa-mobile.css section 9.) ---------- */
@media (min-width: 1250px) {
  html.aa-kb body.aa-site #page-container .navbar-custom .navbar-nav > li:focus-within:not(.aa-kb-shut) > ul { display: block; }
}

/* ---------- 10. Reviews: the guests' words are italic (Jake, 15 Oct 2026); the name, place and date line under each stays upright ---------- */
body.aa-site #page-container .page-content blockquote p { font-style: italic; }
body.aa-site #page-container .page-content blockquote footer, body.aa-site #page-container .page-content blockquote footer cite { font-style: normal; }

/* ---------- 11. Keyword landing pages (.aa-kw): copy ported as one dense block reads as heavy. Same words, shorter paragraphs (two sentences each, split in the page),
   a 900px measure, line height 1.75 and 20px between paragraphs; the keyword links are underlined so they still read as links (Jake, 15 Oct 2026) ---------- */
body.aa-site #page-container .page-content.aa-kw p { max-width: 900px; line-height: 1.75; margin-top: 0 !important; margin-bottom: 20px !important; padding-bottom: 0; }
body.aa-site #page-container .page-content.aa-kw a.aa-textlink { text-decoration: underline; }