/*** archive */
    
    .guide-archive-header {
        background-repeat: no-repeat;
        background-image: url(https://en.qrtranslator.net/wp-content/uploads/2025/08/footer_bg.png);
        background-size: auto;
        background-position: top 50px;
        background-color: #1a3c71;
    }

    /*** Single pages ***/
    
    /* Make page full width */
    .single-user_guide .site-content {
        max-width: 100%;
        padding: 0;
    }
    
    /* Reset generatepress padding */
    .single-user_guide .content-area,
    .single-user_guide .site-main {
        padding: 0;
        margin: 0;
    }
    
    /* Set header offset */
    :root {
        --qrt-header-height: 70px;
    }
    
    /* Sidebar + Article Grid container */
    .qrt-docs-container {
        display: grid;
        grid-template-columns: 320px 1fr;
        gap: 30px;
    
        /* full width */
        width: 100%;
        max-width: 100%;
    
        box-sizing: border-box;
    
    }
    
    /* Article / Content area */
    .qrt-docs-article {
        padding: 0 40px 60px 0;
    }
    
    /* Content should span full width */
    /* .guide-typography article {
      padding: 0 20px;
    } */


/*** Category (Section) archive page (section overview) card grid */

    .guide-archive-header h1 {
        color: white;
        margin-bottom: 0.4em
    }

    .guide-section-overview-card-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(200px, 200px
        ));
        gap: clamp(16px, 4vw, 32px);   
        width: min(100%, 800px);
    }
    
    .guide-section-list {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: clamp(16px, 4vw, 32px);   
    }

    .guide-article-searchbar {
        background: #1a3c71;
        padding-top: 20px;
        padding-bottom: 18px;
        margin-bottom: 0;
    }

    .guide-article-container {
        padding: 0 50px 0 50px !important;
        max-width: 1200px;
    }

    .guide-article-searchbar-grid {
        display: grid; 
        grid-template-columns: max-content max-content; gap: 30px;
        align-items: center;
    }

    @media (max-width: 1024px) {

        .guide-section-list {
            grid-template-columns: 1fr 1fr;
        }


    }

    @media (max-width: 768px) {
        .guide-section-list {
            grid-template-columns: 100%;
        }
        .guide-article-padding { 
            padding-top: clamp(100px, 10vw, 113px) !important; /* Add padding to top of article/section on mobile (search bar is invisible so padding disappears) */
         }
    }

    .guide-article-inner {
        max-width: 664px; /* fits three cards horizontally (desktop) on section overview */
    }

    @media (min-width: 769px) {
        .guide-sidebar-nav, .guide-article-inner {
            padding-top: 18px;
        }

    }

    .guide-section-articles {
        list-style: none;
        margin-left: 0;
    }

    article .guide-section-overview-card, article.guide-archive-card {
        background: white;
        padding: 18px;
        border-radius: 10px;   
        border: 1px solid #00266130; 
    }
    article .guide-section-overview-card h2, .guide-archive-card h2 {
        font-size: 16px;
    }
    article.guide-archive-card p {
        font-size: 15px;
    }
    .guide-section-overview-card-meta {
        font-size: 12px;
        color: #00266191;
        line-height: 1.4;
    }

    .guide-archive-card ul, ul.guide-nav-children {
        margin-left: 1em;
        font-size: 15px;
    }

    ul.guide-nav-children {
        margin-top: 3px !important;
    }

    .guide-archive-card ul li .link-text,  ul.guide-nav-children li .link-text {
        display: inline-block;
        transition: transform 0.25s ease;
    }

    @media (min-width: 1024px) {
        .guide-archive-card ul li a:hover .link-text, ul.guide-nav-children a:hover .link-text {
            transform: translateX(4px);
        }
    }
   
    .guide-archive-card ul li::marker, ul.guide-nav-children li::marker {
        color: #1a3c7138;
    }
    .guide-archive-card ul li:has(a:hover)::marker, ul.guide-nav-children li:has(a:hover)::marker{
        color: #1a3b71;
    }

    

    article .guide-section-overview-card h2 a {
        color: #c73b00;
        font-weight: 700;
        text-decoration: none;
    }

    article .guide-archive-card h2 a {
        color: #c73b00;
        font-weight: 700;
        text-decoration: none;
    }
    
    /* term page (category overview */
    .guide-section-overview-wrapper {
        padding: 30px;
        border-radius: 30px;
        background: #002661;
        color: #d9dfe8;
    }

    /* term page (category overview */
    .guide-section-overview-wrapper p:last-child {
        margin-bottom: 0 !important;
    }
                
    .guide-bg-icon {
    opacity: 0.6;
    pointer-events: none;
    line-height: 1;
    }

  /* keep content above icon */
  .guide-archive-card > *:not(.guide-bg-icon) {
    position: relative;
    z-index: 1;
    }

/* search results */

.guide-search-input {
    border-radius: 30px !important; /* same on single and archive */
}

.guide-search-single, .guide-search-archive {
    display: flex;
    column-gap: 12px;
}

.guide-search-archive {
    margin-bottom: 2em;
    margin-left: -4px; /* adjust to h1 */
}

.guide-search-archive input[type=search] {
    font-size: 22px;
    padding: 10px 24px;
}

.guide-search-archive .guide-search-button {
    font-size: 28px;
}


.post-type-archive-user_guide.search-results .guide-search-button {
    height: unset;
    width: unset;
}

.guide-search-button {
    background: transparent !important;

} input[type="button"], input[type="reset"], .guide-search input[type="submit"], .guide-search a.button, .guide-search a.wp-block-button__link:not(.has-background) {
    background: transparent;
}

.guide-search button:hover, html .guide-search input[type="button"]:hover {
    color: white;
    background-color: transparent;
}

.guide-search button:focus, html .guide-search input[type="button"]:focus {
    color: white;
    background-color: #00317a;
}

.no-results .guide-search button:hover, .search-results .guide-search button:hover, .error404 .guide-search button:hover {
    color: white;
    background-color: #00317a;
}


.guide-search-results {
    background: white;
    padding: 18px;
    border-radius: 10px;
    border: 1px solid #00266130;
}
.search-results-wrapper {
    display: grid;
    grid-template-columns: 1fr 1fr;
    justify-content: center;

}

.guide-search-results h2, .guide-search-results h3 {
    font-size: 19px;
    font-weight: 700;
}

.guide-search-results a {
    font-size: 15px;
}

.guide-search-results p {
    margin-top: 0px;
    margin-bottom: 12px;
    line-height: 1.4;
    font-size: 15px;
}

    /* Sidebar css */

        
    /* Sidebar sticky until the footer */
    .guide-sidebar {
        top: calc(var(--qrt-header-height) + 20px);
        position: sticky;
        max-height: calc(100vh - var(--qrt-header-height) - 19px);
        overflow-y: visible;
        /* padding-right: 20px; */
        border-right: 1px solid #e0e0e0;
    
        /* Hide scrollbar  */
        -ms-overflow-style: none;
        scrollbar-width: none;
    }
    
    .guide-sidebar-inner {
      height: 100%;
      overflow-y: auto;
    
      -ms-overflow-style: none;
      scrollbar-width: none;
    }
    
    .guide-sidebar-inner::-webkit-scrollbar {
      display: none;
    }
    
    .guide-sidebar::-webkit-scrollbar {
        width: 0px;
        background: transparent;
    }
    
    /* The fade + arrow overlay */
    .qrt-sidebar-fade {
        position: sticky;
        bottom: 0;
        height: 40px;
        pointer-events: none;
    
        background: linear-gradient(
            to bottom,
            rgba(255,255,255,0) 0%,
            rgba(255,255,255,1) 70%
        );
    
        display: flex;
        justify-content: center;
        align-items: flex-end;
        padding-bottom: 6px;
        font-size: 10px;
        color: #999;
        opacity: 0.7;
    }
    
    /* The arrow itself */
    .qrt-sidebar-fade::after {
        content: "▼";
        font-size: 11px;
    }

    .guide-sidebar-inner > .guide-typography ul, .guide-sidebar-inner >.guide-typography ol {
        font-weight: 500;
        letter-spacing: 0.02em;
        margin-bottom: 16px;
        font-size: 15px;
        line-height: 1.2;
     }
    
    .guide-sidebar-inner >.guide-typography ol {
        font-size: 14px;
     }
    
    .guide-nav-group {
        border-bottom: 1px solid #d7d7d7;
        padding-top: 14px;
    }
    
    .guide-nav-group a {
        font-size: 14px;
        font-weight: 500;
        text-decoration: none;
    }

    .guide-nav-group a.guide-nav-parent {
        font-weight: 700;
        text-transform: uppercase;
    }
    
    .guide-nav-children a.current-term,
    .guide-nav-children a[aria-current="page"] {
        color: #c73b00;
        font-weight: 700;
    }


    ul.guide-nav-children li:has(a:hover)::marker{
        color: #1a3b71;
    }

    ul.guide-nav-children li:has(a.current-term)::marker, .guide-nav-children li:has(a[aria-current="page"])::marker {
        color: #1a3c71;
    }

    .guide-sidebar-nav-title {
        font-size: 18px;
        font-weight: bold;
    }
    
    /* Post-it handle */
    .guide-drawer-handle {
        display: none;
    }
    
    /* =========================
       MOBILE / TABLET DRAWER
    ========================= */
    @media (max-width: 1024px) {
    
    /* Collapse grid */
    .qrt-docs-container {
      grid-template-columns: 1fr;
      gap: 0;
    }
    
    
    /* Sidebar becomes drawer */
    .guide-sidebar {
      position: fixed;
      top: 0;
      left: 0;
      overflow: visible; /* must NOT scroll */
    
      width: 280px;
      height: calc(100vh - var(--qrt-header-height));
    
      background: #fff;
      z-index: 999;
    
      transform: translateX(-100%);
      transition: transform 0.3s ease;
    
      border-right: 1px solid #e0e0e0;
      padding: 20px;
    }
    
    .guide-sidebar-inner {
      height: 100%;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
    
      padding-right: 12px; /* space for hidden scrollbar */
      padding-top: 68px;
    }
    
    
    .guide-sidebar.is-open {
      transform: translateX(0);
      box-shadow: 3px 8px 7px 0px #0000004f;
      border-radius: 0px 00px 30px 0px;
    }
    
    /* Post-it handle */
    button.guide-drawer-handle {
        display: flex;
        align-items: center;
      position: absolute;
      top: 96px;
      right: -40px;
    
      width: 47px;
      height: 56px;
    
      background: #c73b00;
      border: none;
      border-radius: 0 6px 6px 0;
      box-shadow: 2px 2px 6px rgba(0,0,0,0.15);
    
      cursor: pointer;
      font-size: 18px;
      font-weight: bold;
    
      z-index: 10001; /* higher than sidebar + article */
      pointer-events: auto;
      padding-left: 17px;
    
      
    }
    }
    
    button.guide-drawer-handle:active,button.guide-drawer-handle:hover {
        background: #c73b00;
    }


    nav.guide-prev-next {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        column-gap: 20px;
        row-gap: 20px;
    }

    nav.guide-prev-next a {
        background: #002161;
        padding: 8px 14px;
        border-radius: 19px;
        color: white;
        font-size: 14px;
        display: flex;
        align-items: center;
        text-decoration: none;
    }

    nav.guide-prev-next a span {
        font-size: 14px; /* match link text */
    }

    nav.guide-prev-next a.guide-prev span {
        padding-right: 10px;
    }

    nav.guide-prev-next a.guide-next span {
        padding-left: 10px;
    }