
/* Finca Terol Layout Engine V5
   Structural page geometry. Loaded after all legacy layout CSS.
   Header is always the first page section; content is always below it.
   The Studio may change object geometry, but cannot change this hierarchy. */

html,body{width:100%;max-width:100%;min-height:100%;margin:0;overflow-x:hidden}
body.ft-layout-v5{
  min-height:100vh!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
}

/* 1. HEADER: always first and independent from the content grid. */
body.ft-layout-v5>.site-header.ft-global-header-container{
  order:0!important;
  flex:0 0 auto!important;
  box-sizing:border-box!important;
  width:100%!important;
  max-width:none!important;
  margin-top:0!important;
  position:relative!important;
  top:auto!important;
  z-index:50!important;
  overflow:visible!important;
}
body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-inner{
  display:grid!important;
  grid-template-columns:repeat(1000,minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  align-items:center!important;
  width:100%!important;
  max-width:none!important;
  min-height:0!important;
  height:auto!important;
  box-sizing:border-box!important;
  margin:0!important;
  padding:clamp(8px,1vw,16px) clamp(12px,1.5vw,28px)!important;
  gap:0!important;
  overflow:visible!important;
}
body.ft-layout-v5 .ft-global-logo-field{
  grid-column:1 / span 500;
  grid-row:1;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  flex:none!important;
  box-sizing:border-box!important;
  align-self:center!important;
}
body.ft-layout-v5 .ft-global-menu-field{
  grid-column:501 / span 500;
  grid-row:1;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  padding:0!important;
  flex:none!important;
  box-sizing:border-box!important;
  align-self:center!important;
}
body.ft-layout-v5 .ft-global-brand{
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:auto!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:visible!important;
}
body.ft-layout-v5 .ft-global-brand-image{
  display:block!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  max-width:100%!important;
  max-height:var(--ft-global-logo-max-h,140px)!important;
  object-fit:contain!important;
  margin:0!important;
}
body.ft-layout-v5 .ft-global-menu-tools,
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons,
body.ft-layout-v5 .ft-global-menu-tools .ft-global-top-links{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  flex-wrap:wrap!important;
}

/* 2. BODY GRID: sidebar and main content are siblings below the header. */
body.ft-layout-v5>.shell.layout{
  order:1!important;
  flex:1 0 auto!important;
  display:grid!important;
  grid-template-columns:repeat(1000,minmax(0,1fr))!important;
  grid-auto-flow:row!important;
  align-items:start!important;
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  box-sizing:border-box!important;
  padding:clamp(12px,1.5vw,28px)!important;
  gap:0!important;
  margin:0!important;
}
body.ft-layout-v5>.shell.layout>.ft-sidebar-wrap{
  grid-column:1 / span 200;
  grid-row:1;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  align-self:start!important;
}
body.ft-layout-v5>.shell.layout>main{
  grid-column:201 / span 800;
  grid-row:1;
  width:auto!important;
  max-width:none!important;
  min-width:0!important;
  margin:0!important;
  box-sizing:border-box!important;
  align-self:start!important;
}

/* 3. FOOTER: always after the entire body grid. */
body.ft-layout-v5>footer.shell.ft-global-footer{
  order:2!important;
  flex:0 0 auto!important;
  box-sizing:border-box!important;
  max-width:none!important;
  min-width:0!important;
}

/* Studio/live engine marks structural objects with inline grid placement.
   Prevent old flex/grid rules from reasserting themselves. */
body.ft-layout-v5 [data-ft-layout-engine="grid-item"]{
  max-width:none!important;
  box-sizing:border-box!important;
}

/* Dashboard has no visible sidebar in the normal application; main remains full width. */
body.ft-layout-v5.ft-dashboard-page>.shell.layout>main{
  grid-column:1 / span 1000;
}

/* Mobile baseline: the hierarchy remains deterministic even without a saved mobile layout. */
@media (max-width:640px){
  body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-inner{
    grid-template-columns:repeat(1000,minmax(0,1fr))!important;
  }
  body.ft-layout-v5 .ft-global-logo-field{
    grid-column:1 / span 1000;
    grid-row:1;
  }
  body.ft-layout-v5 .ft-global-menu-field{
    grid-column:1 / span 1000;
    grid-row:2;
  }
  body.ft-layout-v5>.shell.layout>.ft-sidebar-wrap{
    grid-column:1 / span 1000;
    grid-row:1;
  }
  body.ft-layout-v5>.shell.layout>main{
    grid-column:1 / span 1000;
    grid-row:2;
  }
}


/* v5.2.2 SAFE: independent editable header background object.
   This block only affects the live/preview page header, never Layout Studio itself. */
body.ft-layout-v5>.site-header.ft-global-header-container{
  isolation:isolate!important;
  overflow:hidden!important;
  background-image:none!important;
}
body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-background-object{
  position:absolute!important;
  left:0;
  top:0;
  z-index:0!important;
  width:100%;
  max-width:none!important;
  height:100%;
  min-height:100%!important;
  margin:0;
  box-sizing:border-box!important;
  pointer-events:none!important;
  background-color:transparent;
  background-repeat:no-repeat;
  background-position:center;
  background-size:cover;
}
body.ft-layout-v5>.site-header.ft-global-header-container.ft-header-photo>.ft-global-header-background-object{
  background-image:
    linear-gradient(
      90deg,
      rgba(255,255,255,.76) 0%,
      rgba(255,255,255,.42) 20%,
      rgba(255,255,255,.16) 38%,
      rgba(255,255,255,.06) 50%,
      rgba(255,255,255,.16) 62%,
      rgba(255,255,255,.42) 80%,
      rgba(255,255,255,.76) 100%
    ),
    var(--ft-header-image)!important;
  background-position:center center!important;
  background-size:cover!important;
}
body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-inner{
  position:relative!important;
  z-index:1!important;
}


/* v5.2.4 — fixed global main-content background object.
   Separate from header and sidebar, vertically seamless on long pages. */
body.ft-layout-v5>.shell.layout>main{
  position:relative!important;
  isolation:isolate!important;
  background-image:none!important;
  background-color:transparent!important;
  overflow:hidden!important;
}
body.ft-layout-v5>.shell.layout>main>.ft-global-main-background-object{
  position:absolute!important;
  inset:0!important;
  z-index:0!important;
  width:100%!important;
  max-width:none!important;
  height:100%!important;
  min-height:100%!important;
  margin:0!important;
  pointer-events:none!important;
  background-image:
    linear-gradient(rgba(255,255,255,.28),rgba(255,255,255,.28)),
    var(--ft-main-background-image)!important;
  background-repeat:repeat-y!important;
  background-position:center top!important;
  background-size:100% auto!important;
}
body.ft-layout-v5>.shell.layout>main>*:not(.ft-global-main-background-object){
  position:relative;
  z-index:1;
}



/* Horizontal top menu hotfix, 2026-10-05.
   Keep the two navigation groups intrinsic-width instead of 100% each. */
body.ft-layout-v5 .ft-global-menu-field {
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:12px!important;
  min-width:0!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:thin;
}
body.ft-layout-v5 .ft-global-menu-field>.ft-global-header-text {
  flex:0 0 auto!important;
  width:auto!important;
  white-space:nowrap!important;
  overflow-wrap:normal!important;
}
body.ft-layout-v5 .ft-global-menu-field>.ft-global-menu-tools {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex:0 0 auto!important;
  width:max-content!important;
  min-width:0!important;
  margin-left:auto!important;
  gap:12px!important;
  padding:6px 2px!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons,
body.ft-layout-v5 .ft-global-menu-tools .ft-global-top-links {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  gap:8px!important;
  white-space:nowrap!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons>* ,
body.ft-layout-v5 .ft-global-menu-tools .ft-global-top-links>* {
  flex:0 0 auto!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icon {
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  width:42px!important;
  height:42px!important;
  margin:0!important;
  vertical-align:middle!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-logout {
  display:flex!important;
  align-items:center!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icon-image {
  width:24px!important;
  height:24px!important;
  object-fit:contain!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-global-top-links a {
  display:inline-flex!important;
  align-items:center!important;
  min-height:42px;
  white-space:nowrap!important;
}


/* Compact icon spacing: 24px icons with 8px (about two spaces) between them. */
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons {
  gap:8px!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons .ft-top-icon {
  width:24px!important;
  min-width:24px!important;
  max-width:24px!important;
  padding-left:0!important;
  padding-right:0!important;
  border-left-width:0!important;
  border-right-width:0!important;
}

/* Match dashboard tile gutters; old per-icon X offsets are ignored by both engines. */
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons {
  gap:clamp(14px,2.2vw,28px)!important;
}
body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons>* {
  margin-left:0!important;
}
@media(max-width:700px){
  body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons {gap:12px!important;}
}


/* Size the right-hand menu to its contents, rather than a fixed half-header. */
body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-inner {
  display:flex!important;
  flex-direction:row!important;
  flex-wrap:nowrap!important;
  justify-content:space-between!important;
  align-items:center!important;
  gap:12px!important;
}
body.ft-layout-v5 .ft-global-header-inner>.ft-global-logo-field {
  flex:1 1 auto!important;
  min-width:0!important;
}
body.ft-layout-v5 .ft-global-header-inner>.ft-global-menu-field {
  flex:0 0 auto!important;
  width:auto!important;
  min-width:0!important;
  justify-content:flex-start!important;
  overflow:visible!important;
}
body.ft-layout-v5 .ft-global-menu-field>.ft-global-menu-tools {
  margin-left:0!important;
  padding-left:0!important;
  padding-right:0!important;
  justify-content:flex-start!important;
}
/* With very little room use a full-width menu row, showing every item. */
@media(max-width:700px){
  body.ft-layout-v5>.site-header.ft-global-header-container>.ft-global-header-inner {
    flex-direction:column!important;
    align-items:stretch!important;
  }
  body.ft-layout-v5 .ft-global-header-inner>.ft-global-menu-field {
    flex:0 1 auto!important;
    flex-wrap:wrap!important;
  }
  body.ft-layout-v5 .ft-global-menu-field>.ft-global-menu-tools {
    flex:1 1 auto!important;
    width:auto!important;
    flex-wrap:wrap!important;
  }
  body.ft-layout-v5 .ft-global-menu-tools .ft-top-icons,
  body.ft-layout-v5 .ft-global-menu-tools .ft-global-top-links {
    flex:0 1 auto!important;
    flex-wrap:wrap!important;
  }
}
