/*
Theme Name: Travel Heartland
Theme URI: 
Author: 
Author URI: 
Description: 
Requires at least: 6.9
Tested up to: 6.9
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: travel-heartland
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news

/*
 * IMPORTANT: This file is only served on the frontend when `SCRIPT_DEBUG` is enabled;
 * in most instances, the `style.min.css` file will be served. It is not recommended that you
 * use the Theme File Editor to modify this stylesheet. Instead, add the necessary style
 * overrides via "Additional CSS" in the Site Editor.
 */

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */


a {
  text-decoration: none;
}

a:focus,
a:active {
  outline: none;
}

/* Navbar */
.nav-hover {
  position: relative;
  padding-bottom: 2px;
}

.nav-hover:hover {
  color: #833730;
}

.current-menu-item > a,
.current-menu-ancestor > a,
.current-page-ancestor > a {
  color: #833730 !important;
}

.current-menu-ancestor > a::after,
.current-menu-item > a::after {
  color: #833730 !important;
}

.wp-block-navigation-item.has-child:hover
  > .wp-block-navigation-submenu__toggle
  svg
  path {
  stroke: #833730 !important;
}

.current-menu-ancestor > .wp-block-navigation-submenu__toggle svg path,
.current-menu-item > .wp-block-navigation-submenu__toggle svg path {
  stroke: #833730 !important;
}

.nav-hover::after {
  content: "";
  position: absolute;
  width: 0;
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #8d3b33;
  transition: width 0.3s ease;
}

.nav-hover:hover::after {
  width: 100%;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
  outline-width: 2px;
  outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation
  .wp-block-navigation-submenu
  .wp-block-navigation-item:not(:last-child) {
  margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation
  .wp-block-navigation-item
  .wp-block-navigation-item__content {
  outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation
  .wp-block-navigation-item
  ul.wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  outline-offset: 0;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1,
h2,
h3,
h4,
h5,
h6,
blockquote,
caption,
figcaption,
p {
  text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
  display: block;
}

/*
 * Prevents unnecessary scrollbars while handling long lines of preformatted text.
 * https://core.trac.wordpress.org/ticket/63875
 */
:where(pre) {
  overflow-x: auto;
}

/*------------------------------------------------------------Custom CSS----------------------------------------------------------------------------------*/



/*---Footer---*/


footer {
  margin-top: 0;
}


/* Buttons */

.hero-btn1 a:hover {
  background-color: #465745 !important;
  color: white !important;
}

.hero-btn2 a:hover {
  background-color: #833730 !important;
  color: white !important;
}

header.wp-block-template-part {
  position: sticky;
  top: 0;
  z-index: 9999;
}

@media (max-width: 600px) {
  .resp-column {
    display: flex;
    flex-direction: column-reverse !important;
  }
  .padding-mobile {
    padding-inline: 20px;
  }
  .wp-block-button__link {
    padding-top: 8px !important;
    padding-bottom: 8px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;

    font-size: 16px !important;
    width: auto !important;
  }
}


.equal-height-columns {
    align-items: stretch !important;
}

.equal-height-columns > .wp-block-column {
    display: flex;
    flex-direction: column;
}


.equal-height-columns .wp-block-column > .wp-block-buttons {
    margin-top: auto !important;
}


.equal-height-columns .wp-block-query,
.equal-height-columns .wp-block-post-template,
.equal-height-columns .wp-block-post {
    height: 100%;
    display: flex;
    flex: 1;
    flex-direction: column;
}


.equal-height-columns .wp-block-post > .wp-block-group {
    flex: 1;
    display: flex;
    flex-direction: column;
}

.equal-height-columns .wp-block-post-featured-image {
    max-height: 200px; 
}


/* Responsiv fix för surfplatta och mobil */
@media (min-width: 700px) and (max-width: 1300px) {
    
    /* 1. Tvinga behållaren att stapla kolumnerna vertikalt */
    .wp-block-columns.equal-height-columns {
         display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .wp-block-columns.equal-height-columns > .wp-block-column {
        max-width: 450px !important; 
    }
}

.query-block-js-filters {
  --red: #833730;
  --green: #556a54;
  --lightgreen: #e6e3d9;
  --shade1: #f0ece6;
  --transition-speed: 0.4s;
  --block-spacing: 0.5rem;
}

.query-block-js-filters[data-layout="levels"],
.query-block-js-filters[data-layout="menu"] :is(ul, li, label) {
  display: grid;
}

.query-block-js-filters[data-layout="menu"] {
  background: var(--lightgreen);
  border: 1px solid #c8bdae;
  border-radius: 10px;
  padding: 1rem;
}

.query-block-js-filters ul {
  margin: 0;
  gap: var(--block-spacing);
  list-style: none;
}

.query-block-js-filters ul.sub-filters {
  padding: var(--block-spacing) 1em 0;
  grid-template-columns: 1fr 1fr;
}

.query-block-js-filters[data-layout="menu"] .sub-filters-wrap,
.query-block-js-filters[data-layout="levels"] .filters:not([data-level="1"]) {
  --height: 100px;
  transition:
    max-height var(--transition-speed),
    opacity var(--transition-speed);
  max-height: var(--height);
  overflow: hidden;
}

.query-block-js-filters[data-layout="menu"] .sub-filters-wrap {
  font-size: 0.9em;
}

.query-block-js-filters :is(label, button) {
  --active-bg: var(--red);
  --active-color: #fff;

  cursor: pointer;
  align-items: center;
  transition:
    background-color var(--transition-speed),
    color var(--transition-speed);
  line-height: 1.2;
}

.query-block-js-filters[data-layout="menu"] label {
  background: var(--shade1);
  padding: 0.8em 1em;
  border-radius: 10px;
}

.query-block-js-filters label > :is([type="radio"], [type="checkbox"]),
.query-block-js-filters[data-layout="levels"] ul.filters:not(:has(input:checked)) .clear-filters button {
  display: none;
}

.query-block-js-filter[data-layout="menu"]
  label:not(:has(> input:checked))
  + .sub-filters-wrap,
.query-block-js-filters[data-layout="levels"]
  .filters:not(:has(input:checked))
  + .filters {
  --height: 0 !important;
  opacity: 0;
}

.query-block-js-filters label:has(input:checked) {
  background: var(--active-bg);
  color: var(--active-color);
}

.query-block-js-filters .sub-filters-wrap label,
.query-block-js-filters[data-layout="levels"] ul.filters[data-level="2"] label,
.query-block-js-filters[data-layout="levels"] ul.filters button {
  --active-bg: var(--green);
}

.query-block-js-filters[data-layout="levels"] {
  gap: 1rem;
}

.query-block-js-filters[data-layout="levels"] ul.filters {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  font-size: 20px;
}

.query-block-js-filters[data-layout="levels"] ul.filters label,
.query-block-js-filters[data-layout="levels"] ul.filters button {
  border-radius: 2em;
  padding: 0.6em 1.4em;
  display: flex;
}

.query-block-js-filters[data-layout="levels"]
  ul.filters[data-level="1"]
  label:not(:has(input:checked)) {
  background: var(--lightgreen);
}

.query-block-js-filters[data-layout="levels"]
  ul.filters[data-level="2"]
  label:not(:has(input:checked)) {
  background: var(--shade1);
}

.query-block-js-filters[data-layout="levels"] ul.filters button {
    border: none;
    font-size: inherit;
    font-family: inherit;
}

.query-block-js-filters[data-layout="levels"] ul.filters button:hover {
    background: var(--active-bg);
    color: var(--active-color)
}

/* --- Header mobil --- */
@media (max-width: 782px) {
  /* Centrera allt innehåll */
  .wp-block-navigation__responsive-container
    .wp-block-navigation__responsive-container-content,
  .wp-block-navigation__responsive-container .wp-block-navigation__container,
  .wp-block-navigation__responsive-container .wp-block-navigation-item {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
  }

  /* TOPPKATEGORI (Tjänster) */
  .wp-block-navigation__responsive-container
    .wp-block-navigation-item.has-child
    > .wp-block-navigation-item__content {
    font-weight: 900 !important;
  }

  .wp-block-navigation__responsive-container
    .wp-block-navigation__submenu-container
    .wp-block-navigation-item {
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  /* SORTERING: Tjänster sist */
  .wp-block-navigation__responsive-container
    .wp-block-navigation-item:has(a[href*="service"]) {
    order: 99 !important;
    margin-top: 10px !important;
  }

  /* Alla andra menyval först */
  .wp-block-navigation__responsive-container
    .wp-block-navigation-item:not(:has(a[href*="service"])) {
    order: 1 !important;
  }
}

.wp-block-navigation
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content {
  color: #2d3e2f !important; 
  font-size: 0.95rem !important;
  padding: 12px 25px !important; 
  transition: all 0.3s ease !important; 
  background-color: transparent !important;
}

.wp-block-navigation
  .wp-block-navigation__submenu-container
  .wp-block-navigation-item__content:hover {
  color: #833730 !important; 
  background-color: rgba(
    131,
    55,
    48,
    0.05
  ) !important; 
  padding-left: 32px !important; 
}

/* Tar bort hover-linjen i undermenyer */
.wp-block-navigation__submenu-container .nav-hover::after,
.wp-block-navigation__submenu-container a::after,
.wp-block-navigation__submenu-container::after {
    display: none !important;
    content: none !important;
    width: 0 !important;
}

.wp-block-separator {
    border: none !important;
    border-bottom: 2px solid currentColor !important; 
    opacity: 1 !important;
    height: 1px !important;
    min-height: 1px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-top: 1rem !important; 
    margin-bottom: 1rem !important;
    display: block !important;
}


body.category-nature, 
body.category-nature .wp-site-blocks {
    background-color: #556a54 !important; /* Ljusgrön */
}

body.category-history, 
body.category-history .wp-site-blocks {
    background-color: #c8bdae !important; /* Beige/Gammaldags */
}

/* Om inlägget har kategorin Kultur (Slug: culture) */
body.category-culture, 
body.category-culture .wp-site-blocks {
    background-color: #7b5953  !important; /* Ljuslila */
}

.wp-block-site-logo img, 
.custom-logo-link img {
  width: 250px !important; /* Ersätt 250px med den bredd loggan har på datorn */
  max-width: none !important; 
  height: auto !important;
}


.cat-desc {
    display: none;
    font-size: 1.2rem;
    max-width: 600px;
    text-align: center;
    max-width: 800px;
    margin: 40px auto;
    padding: 30px;
    background-color: #fdf6e9; 
    border-radius: 15px;
    font-size: 1.1rem;
    line-height: 1.7;
    color: #444;
    border: 1px solid #e9decb;
}


/* Skapat för att underlätta för kund när de gör inlägg */

/* Tvinga tomma stycken att ta plats och skapa mellanrum */
p:empty {
    margin-bottom: 1rem; 
}

/* Lägger till ett osynligt mellanslag så att webbläsaren renderar raden */
p:empty::before {
    content: "\00a0";
    visibility: hidden;
}

.gtranslate_wrapper {
	display: flex;
    gap: 10px !important;
}

@media (max-width: 782px) {
    .wp-container-core-column-is-layout-5c12a1d1,
    .wp-container-core-group-is-layout-68f147ce {
        justify-content: flex-start !important;
    }

    .wp-container-core-group-is-layout-68f147ce p {
        text-align: left !important;
        margin-right: 10px !important;
    }
}