/* bb-design.css - Burleigh on the Beach DESKTOP parity layer (Stage 4). Loads after bb-bundle.css + bb-live.css (live's CSS,
   scoped under body.bb-site #page-container) and before bb-mobile.css. Every rule undoes something Divi adds that live iLaunch
   never had. Adapted from kit ilaunch-divi-parity.template.css ($B = body.bb-site, $P = body.bb-site #page-container,
   $H = body.bb-site.bb-home #page-container, $SC = bb). The kit template's sample form/calendar colours are NOT used:
   this template's own values are below. */

/* 1. Live iLaunch CSS assumes the browser default content-box; Divi sets * {box-sizing:border-box}. Divi's own contact-form module keeps border-box. */
body.bb-site #page-container, body.bb-site #page-container *, body.bb-site #page-container *::before, body.bb-site #page-container *::after { box-sizing: content-box; }
body.bb-site #page-container .et_pb_contact_form_container, body.bb-site #page-container .et_pb_contact_form_container * { box-sizing: border-box; }
/* form controls the browser sizes as border-box by default */
body.bb-site #page-container select, body.bb-site #page-container button,
body.bb-site #page-container input[type=submit], body.bb-site #page-container input[type=button], body.bb-site #page-container input[type=reset], body.bb-site #page-container input[type=image] { box-sizing: border-box; }

/* 2. Divi caps .container at 80% / 1080px; live's .container is a fixed 1170px (the footer's inner .container is 1585px). */
body.bb-site #page-container .container { max-width: none; }

/* 3. Browser-default spacing the live CSS relies on, which Divi's reset removes. No ids in these selectors, so every live rule
      (body.bb-site #page-container ...) still wins where live sets its own value. */
body.bb-site :where(.et-l, #main-content) p { padding-bottom: 0; margin-bottom: 1em; }
body.bb-site :where(.et-l, #main-content) ul, body.bb-site :where(.et-l, #main-content) ol { padding: 0 0 0 40px; margin: 1em 0; line-height: inherit; list-style-position: outside; }
body.bb-site :where(.et-l, #main-content) ul { list-style-type: disc; }
body.bb-site :where(.et-l, #main-content) ol { list-style-type: decimal; }
body.bb-site :where(.et-l, #main-content) :is(ul, ol) :is(ul, ol) { margin-top: 0; margin-bottom: 0; }
body.bb-site :where(.et-l, #main-content) ul ul { list-style-type: circle; }
/* live styles h1-h4 fully and h5 only partly; Divi's h1-h6 {color:#333; line-height:1em; font-size} must not show through on h5/h6 */
body.bb-site :where(.et-l, #main-content) h5 { font-size: 0.83em; color: inherit; line-height: inherit; }
body.bb-site :where(.et-l, #main-content) h6 { font-size: 0.67em; margin: 2.33em 0; font-weight: bold; color: inherit; line-height: inherit; }
body.bb-site :where(.et-l, #main-content) :is(h1, h2, h3, h4, h5, h6) { padding-bottom: 0; }
body.bb-site :where(.et-l, #main-content) strong, body.bb-site :where(.et-l, #main-content) b { font-weight: bold; }

/* 4. Divi forces greyscale font smoothing on body; live uses the browser default. */
body.bb-site { -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; }

/* 5. Divi's right-sidebar layout rule (#main-content .container::before) and its 58px top padding are not on live. */
body.bb-site #main-content .container::before { display: none; }

/* 6. Divi's content-table look is not on live: browser defaults, honouring width/cellpadding attributes. */
body.bb-site :where(.et-l, #main-content) table:not(.variations) { border: 0; margin: 0; width: auto; text-align: start; border-collapse: separate; }
body.bb-site :where(.et-l, #main-content) table[width="100%"]:not(.variations) { width: 100%; }
body.bb-site :where(.et-l, #main-content) tr td, body.bb-site :where(.et-l, #main-content) tr th { border-top: 0; padding: 1px; }
body.bb-site :where(.et-l, #main-content) table[cellpadding="0"] tr td, body.bb-site :where(.et-l, #main-content) table[cellpadding="0"] tr th { padding: 0; }

/* 7. Divi draws a 5px rule down the left of every blockquote; live's blockquote is the quote-icon look (reviews). */
body.bb-site :where(.et-l, #main-content) blockquote { border-left: 0; }

/* 8. Phone menu button (header fragment; never shown at desktop widths). */
body.bb-site #page-container .ils-menu-toggle { display: none; }

/* 9. Live ends most pages with an empty ".socialwidgets" block (dead Google +1 and Facebook Like widgets: 10px padding + a
      22px line, 15px margins, no rule). Blog views carry it as markup (ilaunch-site.php ils_sw()); pages get the same box as a
      pseudo-element at live's position. Absent on live /faq, /search, /site-map, /news and the 404. Desktop only (1170px up): the
      designed tablet and phone layouts skip it (bb-mobile.css hides the real blocks too). */
body.bb-site #page-container .socialwidgets { min-height: 22px; }
@media (min-width: 1170px) {
body.bb-site.page-id-1332 #page-container .content > .container > .right::after,
body.bb-site.page-id-1333 #page-container .content .list.rooms::after,
body.bb-site.page-id-1337 #page-container .content > .container > .left::after,
body.bb-site:is(.page-id-1335, .page-id-1340, .page-id-1341, .page-id-1342, .page-id-1343, .page-id-1344, .page-id-1345, .page-id-1346, .page-id-1347, .page-id-1348) #page-container .content > .container::after {
  content: ""; display: block; height: 22px; margin: 15px 0; padding-top: 10px; clear: none; }
/* facilities, location: the block sits just before the first gallery (its 40px top margin then follows the block). The negative
   top margin collapses with the gallery's 40px to give live's gap above the block: 20px after facilities' last paragraph
   (its 20px margin wins over the block's 15px), 15px after location's map image (no margin). */
body.bb-site:is(.page-id-1334, .page-id-1336) #page-container .content > .container > .gallery:not(.gallery ~ .gallery)::before {
  content: ""; display: block; height: 22px; margin: -20px 0 40px 0; padding-top: 10px; }
body.bb-site.page-id-1336 #page-container .content > .container > .gallery:not(.gallery ~ .gallery)::before { margin-top: -25px; }
}
/* apartments: on live the block follows the last room, so that room is not :last-child and keeps .list .entry's 125px */
@media (min-width: 1170px) { body.bb-site.page-id-1333 #page-container .list.rooms > .entry:last-child { margin-bottom: 125px; } }

/* 10. Bottom pin: its own inline rules (#special_bottompin_container ...) beat live's a:link on live; here the scoped a:link
       carries #page-container and would win, turning "Close this Deal" blue and underlined. */
body.bb-site #page-container #special_bottompin_container a.special_bottompin { color: #ffffff; text-decoration: none; }

/* 11. Divi colours every <a> #2ea3f2; live's colours only a:link, so name anchors (<a id="gallery">) inherit. Zero-id
       specificity so every live rule still wins. */
body.bb-site :where(#page-container a:not([href])) { color: inherit; }

/* 12. Divi pads "#main-content .container" 58px at the top; live's .container has none (home .content-bottom, contact, ...).
       Live rules that set their own padding (.content .container 160px) are more specific and still win. */
html body.bb-site #main-content .container { padding-top: 0; }

/* 13. Contact (and the hidden review) form: Divi's contact-form module dressed as live's table.form: 165px label column
       (5px 10px 5px 5px, 20px line), 455px field column (5px 20px 5px 5px), #f8f8f8 430 x 37px inputs with a 1px #ddd border,
       430 x 113px message box, a gold star 440px into the cell of each required field, an 88px verification row (live's
       reCAPTCHA belongs to iLaunch's account, so Divi's maths captcha sits in that row), green 103 x 40px SUBMIT and the
       "Required fields" note (a real <p class="ils-required-note"> after the form, pulled up into the submit row). */
body.bb-site #page-container .bb-contact-form { margin: 15px 0 0 0; padding: 0; width: 620px; max-width: 100%; }
body.bb-site #page-container .bb-contact-form .et-pb-contact-message:empty { display: none; }
body.bb-site #page-container .bb-contact-form .et_pb_contact { padding: 0; margin: 0; }
body.bb-site #page-container .bb-contact-form form.et_pb_contact_form { display: grid; grid-template-columns: 165px 455px; margin: 0; padding: 0; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field,
body.bb-site #page-container .bb-contact-form .et_contact_bottom_container,
body.bb-site #page-container .bb-contact-form .et_pb_contact_right { display: contents; }
body.bb-site #page-container .bb-contact-form .et_pb_contact_form_label {
  display: block; grid-column: 1; margin: 0; padding: 5px 10px 5px 5px; font: 400 14px/20px 'Open Sans', Arial, Helvetica, sans-serif; color: #444444; text-align: left; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field .input {
  grid-column: 2; display: block; width: 430px; height: 37px; margin: 5px 20px 5px 5px; padding: 8px 12px; border: 1px solid #dddddd; border-radius: 0;
  background: #f8f8f8; font: 400 14px/normal 'Open Sans', Arial, Helvetica, sans-serif; color: #444444; box-shadow: none; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field .input:focus { border-color: #1772b3; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field textarea.input { height: 113px; min-height: 113px; margin-bottom: 11px; resize: both; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field .input::placeholder { color: transparent; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field .input.et_contact_error { border-color: #e02b20; }
/* the required star: live paints it as the field cell's background at 440px 7px, i.e. 605px right of the label's left edge */
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field:has(> [data-required_mark="required"]) > .et_pb_contact_form_label { position: relative; }
body.bb-site #page-container .bb-contact-form p.et_pb_contact_field:has(> [data-required_mark="required"]) > .et_pb_contact_form_label::after {
  content: ""; position: absolute; left: 605px; top: 7px; width: 16px; height: 16px; background: url(/wp-content/uploads/ilaunch/skin/icon-required.png) no-repeat 0 0; }
/* verification row (live: reCAPTCHA, 78px + 10px) */
body.bb-site #page-container .bb-contact-form .et_pb_contact_right p.clearfix {
  grid-column: 2; display: block; float: none; margin: 0; padding: 5px 20px 5px 5px; min-height: 88px; text-align: left; font: 400 14px/37px 'Open Sans', Arial, Helvetica, sans-serif; color: #444444; }
body.bb-site #page-container .bb-contact-form .et_pb_contact_captcha_question { font: inherit; color: inherit; }
body.bb-site #page-container .bb-contact-form input.et_pb_contact_captcha {
  display: inline-block; width: 66px; max-width: none; height: 37px; margin: 0 0 0 10px; padding: 8px 12px; border: 1px solid #dddddd; border-radius: 0; background: #f8f8f8;
  font: 400 14px/normal 'Open Sans', Arial, Helvetica, sans-serif; color: #444444; vertical-align: top; box-shadow: none; }
body.bb-site #page-container .bb-contact-form input.et_pb_contact_captcha.et_contact_error { border-color: #e02b20; }
/* submit (live: input.button, #27ae08, melbournebold 18px uppercase, 10px 25px, radius 5px; hover #1772b3) */
body.bb-site #page-container .et_pb_section .bb-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button {
  grid-column: 2; justify-self: start; display: inline-block; width: auto; height: auto; margin: 5px 0 5px 5px !important; padding: 10px 25px !important; border: 0 !important; border-radius: 5px !important;
  background: #27ae08 !important; color: #ffffff !important; font: 600 18px/normal 'melbournebold', Arial, Helvetica, sans-serif !important; text-transform: uppercase; letter-spacing: 0 !important; cursor: pointer; transition: all 1s; }
body.bb-site #page-container .et_pb_section .bb-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button:hover { background: #1772b3 !important; padding: 10px 25px !important; }
body.bb-site #page-container .et_pb_section .bb-contact-form.et_pb_contact_form_container.et_pb_module .et_pb_button::after { display: none !important; }
/* "Required fields" note: right of the submit button, star 5px after it (live x658-735, star at 740) */
body.bb-site #page-container .content p.ils-required-note { position: relative; height: 0; margin: -45px 0 60px 0; padding: 0 0 0 523px; line-height: 22px; }
body.bb-site #page-container .content p.ils-required-note em.required {
  display: inline-block; padding-right: 21px; font-size: 11px; font-style: normal; line-height: 22px; color: #979797;
  background: url(/wp-content/uploads/ilaunch/skin/icon-required.png) no-repeat right 2px; }
/* fix round 2 (3.18 r2 B4): the note sat 1px below live's at 1250, 1440 and 1920 (note box top 1132 vs live 1131). Up 1px; the
   bottom margin takes the pixel back, so nothing after it moves. The star moves up with it to live's y (live paints it as the
   cell's background at 440px 7px: y 1133; staging's em top 1131 + 2px). Live's layout widths only; 768 to 1169 keeps its own. */
@media (min-width: 1170px) {
/* 523.109375px (7/64 px over 523): live's note starts at x 658.109 (its table cell's fractional width); at a whole 523px the
   first letter's anti-aliasing differed from live's by a few pixels */
body.bb-site #page-container .content p.ils-required-note { margin-top: -46px; margin-bottom: 61px; padding-left: 523.109375px; }
}

/* 14. Keyboard focus (fix round 2, 3.18 r2 B1). Divi's inline stylesheet resets ":focus { outline: 0 }" and
       "a, abbr, ... { outline: 0 }", so no link, field or button showed where the keyboard was; live has no outline rules
       and shows the browser's own focus ring on every stop. "revert" hands the outline back to the browser (Chrome: auto 1px,
       its two-tone ring; Safari and Firefox their own), exactly what live gets. Body-wide so the calendar and the promo pin
       (appended outside #page-container) are covered. Low specificity on purpose: live's own "outline: none" rules (fancybox
       arrows, slick) still win, as on live. Below 1250 bb-mobile.css draws its own AA ring. */
body.bb-site :focus-visible { outline: revert; }

/* 15. Phone numbers (fix round 3, 3.18 r3 C3; the kit's parity rule 18). Live shows 0411 205 122 as plain text in the header,
       the footer contact card and on /contact, and a real iPhone turns it into a link itself. Round 2's format-detection meta
       stopped iOS restyling the number but also stopped it being tappable. The three numbers are now explicit tel: links
       (class tel-link, href tel:+61411205122) that keep the surrounding text colour, with no underline, in every state
       (link, visited, hover, active, focus) and at every width, so from 1250 up they look exactly like live's plain text.
       !important beats live's "#footer a:hover { underline }" and "a:link { #1772b3; underline }". The meta stays, so iOS
       restyles nothing else. Below 1250 the tap height (24px+) is set in bb-mobile.css (fix round 3 block). */
body.bb-site #page-container a.tel-link, body.bb-site #page-container a.tel-link:link, body.bb-site #page-container a.tel-link:visited,
body.bb-site #page-container a.tel-link:hover, body.bb-site #page-container a.tel-link:active, body.bb-site #page-container a.tel-link:focus,
body.bb-site a[x-apple-data-detectors] { color: inherit !important; text-decoration: none !important; font: inherit; }

/* 16. Other businesses' phone numbers in page and post text (fix round 4, 3.18 r4 C6): /facilities "13 55 66" and seven posts.
       Live shows them as plain text, which a real iPhone links itself; with the format-detection meta (rule 15) staging's
       plain text was not tappable. Each is now an explicit tel: link, class dial-link, styled exactly as rule 15 (the
       surrounding text colour, no underline, every state, every width). Not class tel-link: live's ?etr= script (bb-live.js,
       EtApp.updateRegion) swaps the number inside any element whose class holds "tel" or "phone", which on live never
       touches these numbers. Tap height below 1250: bb-mobile.css (fix round 4 block). */
body.bb-site #page-container a.dial-link, body.bb-site #page-container a.dial-link:link, body.bb-site #page-container a.dial-link:visited,
body.bb-site #page-container a.dial-link:hover, body.bb-site #page-container a.dial-link:active, body.bb-site #page-container a.dial-link:focus { color: inherit !important; text-decoration: none !important; font: inherit; }

/* booking calendar parity (fix round 1, 2026-10-07). iLaunch appends #datepicker_div to <body>, outside #page-container,
   so live's calendar-table rules (".datepicker": width 100%, #ccc ground, centred cells; ".datepicker a": block) were
   scoped away by the CSS port and Divi's global border-box applied instead. The plugin sizes the calendar from the
   table's width, so it opened 127px wide with cramped cells where live's is 187px. Live's rules, unscoped: */
body.bb-site #datepicker_div, body.bb-site #datepicker_div * { box-sizing: revert; }
body.bb-site #datepicker_div .datepicker { clear: both; float: left; width: 100%; color: #fff; background: #ccc; text-align: center; font-size: 100%; border-collapse: separate; }
body.bb-site #datepicker_div td, body.bb-site #datepicker_div td a, body.bb-site #datepicker_div select { font-family: 'Open Sans', Arial, Helvetica, sans-serif; }
body.bb-site #datepicker_div .datepicker a { display: block; width: 100%; }

/* Facilities, Guest Information Mobile App (Jake feedback 2026-10-12): the QR code and Hotel Code images sat bare under the
   paragraph and read as popping up from nowhere. They now sit in a labelled panel: a lead-in line says what to do, then the
   QR code and Hotel Code side by side (stacked on phones). */
body.bb-site #page-container .content .eto-app-download { margin: 24px 0 32px; padding: 20px 24px; background: #f4f8fb; border: 1px solid #d5e3ee; border-left: 4px solid #1772b3; border-radius: 4px; }
body.bb-site #page-container .content .eto-app-download p.eto-app-download-label { margin: 0 0 16px; font-weight: 600; line-height: 1.6; }
body.bb-site #page-container .content .eto-app-download .eto-app-download-items { display: flex; flex-wrap: wrap; align-items: center; gap: 20px 28px; }
body.bb-site #page-container .content .eto-app-download .eto-app-download-items img { display: block; max-width: 100%; height: auto; margin: 0; }
@media (max-width: 767px) {
  body.bb-site #page-container .content .eto-app-download { padding: 16px; }
  body.bb-site #page-container .content .eto-app-download .eto-app-download-items { flex-direction: column; align-items: flex-start; }
}

/* Attractions, Experience OZ call to action (Jake feedback 2026-10-12): stand-alone button on its own line, centred. */
body.bb-site #page-container .content p.eto-attr-cta { text-align: center; margin: 24px 0 32px; }

/* Heavy body copy on the keyword pages (Jake feedback 2026-10-13): Burleigh Apartments, Burleigh Beach Resort and Holiday
   Apartments Burleigh Heads were long unbroken paragraphs. Paragraphs are now split at sentence boundaries in the page
   content (wording untouched, keyword bold removed); these rules set the reading rhythm: line height 1.75 and 20px between
   paragraphs at every width (the phone rule in bb-mobile.css otherwise tightens it to 14px). */
body.bb-site.page-id-1341 #page-container .content p, body.bb-site.page-id-1344 #page-container .content p, body.bb-site.page-id-1345 #page-container .content p { line-height: 1.75; margin: 20px 0; }