/**
 * @file
 * overrides.css
 *
 * Overrides for Rinrin theme core styles.
 * Use this file to override any default Rinrin/Olivero CSS.
 */

img, .feed-icon__icon, .pager__item--active, .pager__link:hover, .pager__link:focus, .node__author-image img, .button, .fieldset__wrapper, input[type="checkbox"], [type="text"], select{
  border-radius: 7px;
}
.form-item--editor-format .form-element--editor-format, .ck-rounded-corners .ck.ck-editor__main>.ck-editor__editable, .ck.ck-editor__main>.ck-editor__editable.ck-rounded-corners {
    border-radius: 7px;
}
.node .field--type-image .field__item img{
  margin: var(--sp0-5) 0;
}

.field:not(:last-child) {
    margin-block-end: var(--sp0-5);
}
.field--tags__item a:hover {color: var(--color--primary-50);}

/*site-branding*/
.site-branding__text h1, .site-branding__text h1 a, .site-branding__text h2, .site-branding__text h2 a{
  color: var(--color--primary-70);
  font-weight: bold;
  letter-spacing: 0.02em;
  font-size: var(--sp2);
  line-height: var(--sp2);
  margin: 0;
  padding: 0;
  margin-block: 0;
}
.site-branding--bg-white .site-branding__text h1, .site-branding--bg-white .site-branding__text h1 a, .site-branding--bg-white .site-branding__text h2, .site-branding--bg-white .site-branding__text h2 a{color: inherit;}
.site-branding--bg-gray .site-branding__text h1, .site-branding--bg-gray .site-branding__text h1 a, .site-branding--bg-gray .site-branding__text h2, .site-branding--bg-gray .site-branding__text h2 a{color: inherit;}


.node--view-mode-full .node__content .field--tags {
  margin-block-start: var(--sp0-5);
  margin-block-end: var(--sp0-5);padding-block: var(--sp0-5);
  padding-inline-start: var(--sp1);padding-inline-end: var(--sp1);
  border-radius: 7px;
}
.node--view-mode-full .node__content ul.links.inline li:first-child a {
    font-weight: 700;
}

.breadcrumb__link{color: var(--color-text-primary-medium);}
.node__title a {color: var(--color-text-primary-medium);}
.node__title a:hover, .node__title a:focus {color: var(--color--primary-50);}
.node__content .text-content a:not(.button) {color: var(--color-text-primary-medium);}


/* teaser__content Container: Enable Flex and Wrap */
.node--view-mode-teaser .teaser__content {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--sp0-75); /* Space between image and body */
  row-gap: 0;    /* Space between category and content below */
  align-items: flex-start;
}

/* Category: Force to its own line (Full Width) */
.node--view-mode-teaser .teaser__content .field--name-field-category {
  flex: 0 0 100%;
  width: 100%;
}
.node--view-mode-teaser .teaser__content .field--type-image, .node--view-mode-teaser .teaser__content .field--name-body {
  flex: 0 0 100%;
  max-width: 100%;
}
/* Ensure the image scales correctly within its half */
.node--view-mode-teaser .teaser__content .field--type-image img {
  width: 100%;
  height: auto;
  display: block;
}
.node--view-mode-teaser .node__meta {
    margin-block-end: var(--sp0-5);
}
.node__meta {
  justify-content: flex-end;
  text-align: right;
  margin-block-end: var(--sp0-5);				 
}

/* related teaser__content Container: Enable Flex and Wrap */
.node--view-mode-related .teaser__content {
  display: flex;
  flex-wrap: wrap;
  column-gap: var(--sp0-75); /* Space between image and body */
  row-gap: 0;    /* Space between category and content below */
  align-items: flex-start;
}
.node--view-mode-related .teaser__content .field--name-field-category {
  flex: 0 0 100%;
  width: 100%;
}
.node--view-mode-related .teaser__content .field--type-image, .node--view-mode-related .teaser__content .field--name-body {
  flex: 0 0 100%;
  max-width: 100%;
}
/* Ensure the image scales correctly within its half */
.node--view-mode-related .teaser__content .field--type-image img {
  width: 100%;
  height: auto;
  display: block;
}

  .text-content blockquote, .cke_editable blockquote {
    font-size: 1.5rem;
    line-height: var(--sp2);
  }
  
@media (min-width: 31.25rem) {

}

@media (min-width: 62.5rem) {
  .sidebar-grid .wide-content {
    width: calc(10 * var(--grid-col-width) + 11 * var(--grid-gap));
  }
  .node__content {
      padding-block-end: var(--sp0-5);
  }
  /* Image Gallery: "Almost a half" aligned left */
  .node--view-mode-teaser .teaser__content .field--type-image {
    flex: 0 0 33%; /* Adjust this percentage to your preference */
    max-width: 33%;
  }
  /* Body: "The other half" aligned right */
  .node--view-mode-teaser .teaser__content .field--name-body {
    flex: 1; /* Takes up all remaining space on the right */
    min-width: 0; /* Prevents text from pushing flex container width */
  }

  /* related Image : "Almost a half" aligned left */
  .node--view-mode-related .teaser__content .field--type-image {
    flex: 0 0 28%; /* Adjust this percentage to your preference */
    max-width: 28%;
  }
  /* related Body: "The other half" aligned right */
  .node--view-mode-related .teaser__content .field--name-body {
    flex: 1; /* Takes up all remaining space on the right */
    min-width: 0; /* Prevents text from pushing flex container width */
  }
  .views-row .node--view-mode-related{padding-block-end: var(--sp0-25);margin-block-end: var(--sp0-25);}
}


/* pager */ 
.pager__items {
  margin-block: var(--sp0-5);
}

.fieldset {
  border: solid 2px var(--color--primary-50);
  border-radius: 7px;
}

.fieldset__legend {background-color: var(--color--primary-50);}

[type="color"], [type="date"], [type="datetime-local"], [type="email"], [type="file"], [type="month"], [type="number"], [type="password"], [type="search"], [type="tel"], [type="text"], [type="time"], [type="url"], [type="week"], textarea, input[type="radio"], input[type="checkbox"] {
    border: 1px solid var(--color--primary-50);
}

.form-item__description {
 font-size: var(--font-size-m);
}

.view-more-by-this-author h3 {
  margin-block: var(--sp0-25);font-size: 1rem;line-height: var(--sp1);
}


@media (min-width: 81.25rem) {
  .sidebar-grid .wide-content {
    width: calc(10 * var(--grid-col-width) + 11 * var(--grid-gap));
  }
}

.sidebar-grid .region--sidebar {
    h1, h2, h3, h4, h5, h6 {
    margin-block-start: var(--sp0-25);
    margin-block-end: var(--sp0-75);
  }
}
/* =====================================================
   Sidebar grid — content column positioning
   ===================================================== */
@media (min-width: 43.75rem) {
  .main-content__container {
    padding-block-start: var(--sp1);
  }
  h1.page-title {
    font-size: var(--sp2);
    line-height: var(--sp3);
  }
  .wide-content {
	 margin-block: var(--sp0-5) var(--sp1);
  }
}

@media (min-width: 62.5rem) {

  .sidebar-grid > .site-main {
    grid-column: 2 / 11;
    grid-template-columns: repeat(10, minmax(0, 1fr));
  }

  .sidebar-grid > .site-main > .region--content-above,
  .sidebar-grid > .site-main > .region--content {
    grid-template-columns: repeat(10, minmax(0, 1fr));
    grid-column: 1 / 11;
  }

  .sidebar-grid > .site-main .layout--content-medium,
  .sidebar-grid > .site-main .layout--pass--content-medium > *,
  .sidebar-grid > .site-main .layout--content-narrow,
  .sidebar-grid > .site-main .layout--pass--content-narrow > * {
    grid-column: 1 / 11;
  }
  .layout--content-medium, .layout--pass--content-medium > * {
    grid-column: 1 / 15;
  }
  .region > *:where(:not([data-big-pipe-placeholder-id])) {
    margin-block-end: var(--sp1);
  }
/* Sticky sidebar */
  .sidebar-grid .region--sidebar {
    position: sticky;
    top: 2rem;
    align-self: start;
  }

}

/* =====================================================
   Fix: views display:grid conflict inside sidebar
   ===================================================== */

.sidebar-grid .view,
.sidebar-grid .view-content {
  display: block;
}

.sidebar-grid .view-content > * + * {
  margin-block-start: 0;
}

/* =====================================================
   Footer spacing
   ===================================================== */

@media (min-width: 75rem) {
  .site-footer__inner {
    padding-block: var(--sp1);
  }
}




/*
 * DO NOT EDIT THIS FILE.
 * See the following change record for more information,
 * https://www.drupal.org/node/3084859
 * @preserve
 */
.teaser {
  position: relative; /* Anchor after pseudo-element. */
  padding-block-end: var(--sp0-25);
  margin-block-end: var(--sp0-25);

  &::after {
    position: absolute;
    inset-block-end: 0;
    width: var(--sp6);
    height: 0;
    content: "";
    /* Intentionally not using CSS logical properties. */
    border-top: solid 2px var(--color--gray-95);
  }

  @media (min-width: 62.5rem) {
    padding-block-end: var(--sp0-25);
    margin-block-end: var(--sp0-25);
  }
}
.teaser__content {
  display: grid;
  grid-auto-rows: max-content;
  gap: var(--sp0-5);

  .field:not(:last-child) {
    margin-block-end: 0;
  }

  @media (min-width: 62.5rem) {
    gap: var(--sp0-5);
  }
}
.teaser__image {
  flex-shrink: 0;
  margin: 0;

  &:empty {
    display: none;

    & + .teaser__title {
      flex-basis: auto;
    }
  }

  & a {
    display: block;
  }

  & img {
    width: var(--sp3-5);
    height: var(--sp3-5);
    object-fit: cover;
    border-radius: 7px;

    @media (min-width: 62.5rem) {
      width: var(--grid-col-width);
      height: var(--grid-col-width);
    }
  }
  @media (min-width: 62.5rem) {
    position: absolute;
    inset-block-start: 0;
    inset-inline-start: calc(-1 * ((var(--grid-col-width) + var(--grid-gap))));
    margin: 0;
  }
}
.teaser__top .teaser__image img {
  border-radius: 7px;
}
.teaser__meta {
  margin-block-end: var(--sp0-25);
}
.teaser__title {
  margin-block: 0;
  flex-basis: calc(100% - var(--sp4-5));
  color: var(--color-text-neutral-loud);
  font-size: 1.5rem;
  line-height: var(--line-height-base);

  @media (min-width: 62.5rem) {
    flex-basis: auto;
    font-size: var(--sp2);
    line-height: var(--sp3);
  }
}
.teaser__top {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  margin: 0;
  gap: var(--sp1);
  margin-block-end: var(--sp1);

  @media (min-width: 62.5rem) {
    position: relative; /* Anchor the image */
  }
}
/*
 * END OF TEASER STYLES
 */