/* ------------------------------------------------------------------------
   PROVISIONAL - delete this file as soon as the archive gives back
     templates/shaper_salon/css/preset1.css
     templates/shaper_salon/css/custom.css
     components/com_sppagebuilder/assets/css/sppagecontainer.css
     plugins/system/jce/css/content.css
   All four are archived (BATCH_PLAN records all 12 stylesheets as archived); on 2026-08-16 the
   archive was refusing every request, so this site was built without them.

   Nothing here is a design decision taken on the client's behalf. Each rule restores a STRUCTURAL
   behaviour that is provably missing, and the evidence is named on the rule.
   ------------------------------------------------------------------------ */

/* sppagebuilder.css sets max-width on .sppb-row-container at 540/720/960/1140 and nothing else -
   no auto margins, no gutter. A max-width with no centring is not a layout anyone ships; the
   companion file that supplies it is the missing sppagecontainer.css, and without it every
   section on all 94 pages is full-bleed and flush against the left edge of the window. */
body.helix-ultimate .sppb-row-container {
  margin-left: auto;
  margin-right: auto;
  padding-left: 15px;
  padding-right: 15px;
  width: 100%;
}

/* #sp-header's immediate child is a bootstrap .row with the usual -15px gutters and NO .container
   around it, so it hangs 15px off both edges of the window and its columns get no gutter at all.
   The body class is `layout-fluid`, which is Helix Ultimate's full-width header, so the fix is a
   gutter rather than a 1140px box - boxing it (tried first) squeezed #sp-menu1 to 665px and made
   the 6-item megamenu wrap onto a second row that the original, at #sp-header{height:70px}, plainly
   did not have. */
#sp-header > .row {
  margin-left: 0;
  margin-right: 0;
  padding-left: 30px;
  padding-right: 30px;
  align-items: center;
}

/* The utility menu module in #sp-menu1 renders as a vertical bulleted list, which is 126px tall
   inside a 70px header - it overflows onto the hero on every page. It shares its column with the
   megamenu, so the two rows are the header. */
#sp-menu1 ul.menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0 18px;
  font-size: 13px;
}
#sp-menu1 ul.menu > li { display: inline-block; }
#sp-header { height: auto; min-height: 70px; }
#sp-header > .row > div { padding-top: 6px; padding-bottom: 6px; }

/* The megamenu dropdown panel has NO background. template.css gives .sp-dropdown-inner only
   `box-shadow: 0 3px 5px 0 rgba(0,0,0,.2)` - and the sibling implementation in the very same file,
   `.sp-megamenu-parent .menu-child`, pairs that identical shadow with `background-color:#fff`.
   Without it the 11 dropdown links render straight over the blue hero, near-illegible. */
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner,
.secondary-menu .sp-dropdown .sp-dropdown-inner {
  background-color: #fff;
  padding: 10px 0;
}
.sp-megamenu-parent .sp-dropdown .sp-dropdown-inner > ul > li > a { padding: 6px 20px; display: block; }

/* The logo bitmap is not on disk; o4_luso_fixups swaps it for the alt text it carried. Abril
   Fatface is one of the three families the site loads for itself, and #2560A5 is the brand blue
   that appears 100+ times in the page-builder CSS the pages carry inline. */
.luso-wordmark {
  font-family: "Abril Fatface", Georgia, serif;
  font-size: 26px;
  line-height: 70px;
  color: #2560A5;
  white-space: nowrap;
  display: inline-block;
}
#sp-footer .luso-wordmark, .sp-footer-column .luso-wordmark { color: #fff; line-height: 1.4; }

/* The off-canvas panel is the ONLY navigation a phone gets (the megamenu is d-none below lg).
   template.css paints the panel white - `.offcanvas-menu{background-color:#fff;color:#000}` - and
   every anchor inside it computes to #fff, i.e. white on white: with the panel open, the phone
   menu was 95 invisible links. The colour that would have won is in the missing preset1/custom
   pair; use the blue the desktop menu already uses. */
.offcanvas-menu a,
.offcanvas-menu ul.menu > li > a,
.offcanvas-menu ul.menu-child > li > a { color: #2560A5 !important; }
/* The sub-menus: main.js used to hide them and slideToggle them open. template.css already draws
   the chevron (.menu-toggler:after, \f105 closed / \f107 open) and already keys the open state off
   `li.menu-parent-open`, so only the collapse itself is missing. Do NOT add another chevron here -
   a first attempt did and template.css's absolute `left:-15px` dropped it on top of the first
   letter of every parent item. */
.offcanvas-menu ul.menu-child { display: none !important; padding-left: 14px; }
.offcanvas-menu li.menu-parent-open > ul.menu-child { display: flex !important; }

/* Bands whose photograph the asset round never reached (see fix_missing_bg). The copy inside
   them was written to sit on a photo, so it is either white - invisible on the white page - or,
   on the page-title band, the brand blue itself, which template.css sets on .sp-page-title h2 and
   which would then be blue on blue. Paint the band in the clinic's own blue and force the copy
   white, for exactly as long as the image is missing. */
.luso-noimg { background-color: #2560A5 !important; }
.luso-noimg h1, .luso-noimg h2, .luso-noimg h3, .luso-noimg h4,
.luso-noimg p, .luso-noimg span, .luso-noimg li { color: #fff !important; }
.luso-noimg a:not(.sppb-btn) { color: #fff !important; text-decoration: underline; }

/* The hero slider is rendered as its first slide (see o4_luso_fixups): owl.carousel.css keeps
   .owl-carousel hidden until its JS adds .owl-loaded, and that JS was never archived. */
.luso-static-slider { display: block !important; }
.luso-static-slider .item { display: block !important; width: 100% !important; }

/* Map block that replaces the Leaflet canvas polish removes. */
.luso-map-section { padding: 30px 0 50px; }
.luso-map { margin: 0; }
.luso-map-title { margin: 0 0 14px; }
.luso-map-caption { font-size: 14px; margin-top: 8px; }

/* A button whose target was never archived keeps its label (so the page still says which clinic
   it belonged to) but must not look like it will do something when clicked. */
a.sppb-btn:not([href]), a.btn:not([href]) { opacity: .45; cursor: default; }
.pagination a.page-link:not([href]) { opacity: .4; cursor: default; }

/* The booking block that replaces the dead Zoho iframe on /marcacao-de-consulta/. */
.luso-booking { max-width: 720px; margin: 0 auto 40px; }
.luso-booking ul { list-style: none; padding: 0; margin: 18px 0 0; }
.luso-booking li { padding: 10px 0; border-bottom: 1px solid rgba(0, 0, 0, .08); }

/* Accordion panels are opened by o4_luso_fixups; keep the chevron pointing the right way. */
.sppb-panel-heading { cursor: pointer; }
.sppb-panel-heading.active .sppb-toggle-direction i { transform: rotate(90deg); }