/*
Theme Name:   Ashe Child
Description:  Child theme for Ashe with a three-column layout (main content + two right sidebar columns).
Author:       Tom
Template:     ashe
Version:      1.0.5
*/

@import url("../ashe/style.css");

/* --- Three-column layout: content + two sidebar columns on the right --- */
.main-content { display: flex; flex-wrap: wrap; }
.main-container { flex: 1 1 0; min-width: 280px; order: 2; }
.sidebar-left-wrap { order: 1; }
.sidebar-right-wrap { order: 3; }
.sidebar-right-wrap-2 { order: 4; width: 195px; }
.sidebar-right-2 { float: right; width: 195px; padding-left: 30px; }

@media screen and ( max-width: 979px ) {
  .main-content { display: block; }
  .sidebar-right-wrap-2, .sidebar-right-2 { width: 100% !important; padding: 0 !important; }
}

/* --- Header title / tagline sizing --- */
.header-logo a, .header-logo-a { font-size: 40px !important; }
.site-description { font-size: 34px !important; }

/* --- Keep header map image at native size (no upscale/blur); add a matching border around the image and put the title in a contiguous bordered box beside it, not overlaid --- */
@media screen and ( min-width: 641px ) {
  .entry-header {
    height: 260px !important;
    background-size: 650px 250px !important;
    background-position: left center !important;
    background-repeat: no-repeat !important;
    position: relative !important;
  }
  .entry-header::before {
    content: "" !important;
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 650px !important;
    height: 250px !important;
    border: 3px solid rgb(52,37,14) !important;
    box-sizing: border-box !important;
    pointer-events: none !important;
    z-index: 2 !important;
  }
  .entry-header-bg-bright {
    position: absolute !important;
    left: 0 !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 650px !important;
    height: 250px !important;
    z-index: 1 !important;
    background-repeat: no-repeat !important;
    filter: brightness(1.4) !important;
    pointer-events: none !important;
  }
  .header-logo {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    width: fit-content !important;
    max-width: calc(100% - 650px) !important;
    margin-left: 650px !important;
    height: 250px !important;
    padding: 0 28px !important;
    border: 3px solid rgb(52,37,14) !important;
    background-color: rgb(216,198,150) !important;
    text-align: center !important;
    box-sizing: border-box !important;
    position: relative !important;
    overflow: hidden !important;
  }
  .header-logo-bg {
    position: absolute !important;
    top: -20px !important;
    left: -20px !important;
    right: -20px !important;
    bottom: -20px !important;
    z-index: 0 !important;
    filter: blur(24px) brightness(1.4) !important;
    background-repeat: no-repeat !important;
    pointer-events: none !important;
  }
  .header-logo > h1,
  .header-logo > p,
  .header-logo-a {
    position: relative !important;
    z-index: 1 !important;
  }
}

/* --- Original "Amazing Grace" theme color palette, applied where possible --- */
a { color: #7f9a42; }
a:hover { color: #000000; }

.widget a,
.sidebar-left-wrap a,
.sidebar-right-wrap a,
.sidebar-right-wrap-2 a,
.sidebar-right-2 a { color: #7f9a42 !important; }

.widget a:hover,
.sidebar-left-wrap a:hover,
.sidebar-right-wrap a:hover,
.sidebar-right-wrap-2 a:hover,
.sidebar-right-2 a:hover { color: #424242 !important; }

.post-meta, .post-meta a, .post-meta span { color: #b3960e !important; }

.sidebar-right-wrap .widget,
.sidebar-right-wrap-2 .widget {
  background: #fcfcfc;
  border: 1px dashed #cccccc;
  padding: 0.9em 1.1em;
  margin-bottom: 1.6em;
}

blockquote { background: #fcfcfc; }