/*
Theme Name: LCO
Theme URI: https://frostwp.com/
Template: frost
Version: 1.0
*/


/* ---------- Forms ---------- */

select,
input[type="text"],
input[type="email"],
input[type="search"] {
  padding: 6px 10px;
  border-radius: 4px;
  border: 1px solid #ccc;
  font-size: 1rem;
  appearance: none;
  background-color: #fff;
  color: var(--wp--preset--color--neutral);
}

textarea:focus,
select:focus,
input:focus {
  outline: none;
  border-color: var(--wp--preset--color--primary);
  background-color: #fff;
}

/* -- Ninja Forms -- */
.nf-form-title h2,
.nf-form-title h3 {
    margin: 0 0 1rem;
}

.sign-up-title h2 {
    margin-bottom: 1.5rem;
}

.nf-field-label label {
  font-weight: 300;
}

.label-above .nf-field-label {
    margin-bottom: 0;
}

.nf-field-container {
  margin-bottom: 1rem;
}

.nf-form-fields-required {
  display: none;   
}

/* First name + Last name inline */
/* Make the fields wrapper a flex row */
.nf-form-cont nf-fields-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}

/* Default: each field spans full width */
.nf-form-cont nf-fields-wrap > nf-field {
  flex: 0 0 100%;
}

/* First + Last share the row (uses :has to match the inner container class) */
.nf-form-cont nf-fields-wrap > nf-field:has(.name-first),
.nf-form-cont nf-fields-wrap > nf-field:has(.name-last) {
  flex: 1 1 calc(50% - .5rem);
}

/* Inputs fill their half */
.nf-form-cont nf-fields-wrap > nf-field:has(.name-first) .nf-field-element > *,
.nf-form-cont nf-fields-wrap > nf-field:has(.name-last)  .nf-field-element > * {
  width: 100%;
}

/* Stack on small screens */
@media (max-width: 640px) {
  .nf-form-cont nf-fields-wrap > nf-field:has(.name-first),
  .nf-form-cont nf-fields-wrap > nf-field:has(.name-last) {
    flex-basis: 100%;
  }
}


/* Form on Project pages, featured docs when there are no docs yet
   (scoped to the wrapper you control) */

/* 1) Zero margins */
.project-no-docs__form .nf-form-cont {
  margin: 0;
}

/* 2) Make the form title (Ninja renders an <h2> inside .nf-form-title) look like a paragraph */
.project-no-docs__form .nf-form-title h2 {
  font-size: var(--wp--preset--font-size--medium);
  font-weight: var(--wp--custom--font-weight--light);
  line-height: var(--wp--custom--line-height--body);
  margin: 0 0 0.5rem;
}

/* 3) Tighten vertical rhythm a bit */
.project-no-docs__form .nf-field-container { margin: 0 0 .5rem; }

/* 4) Keep hidden labels accessible (override Ninja’s "label-hidden") */
.project-no-docs__form .label-hidden .nf-field-label {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0);
  white-space: nowrap; border: 0;
}

/* 5) Curb the email input width (not the title/checkbox) */
.project-no-docs__form .email-wrap input[type="email"] {
  width: 100%;
  max-width: 26rem; /* adjust if you want 22–32rem */
}

/* 6) Submit button should size to content, not full width */
.project-no-docs__form .submit-wrap input[type="submit"] {
  width: auto;
  display: inline-block;
}

/* 7) Hide the generic "Fields marked with *..." line if present */
.project-no-docs__form .nf-form-fields-required { display: none; }



/* Button styling & interactivity */
/* Base button */
.nf-form-cont .submit-container .nf-field-element input[type="submit"] {
  -webkit-appearance: none;
  appearance: none;
  display: inline-block;
  padding: 0.75rem 1.25rem;
  border-radius: 4px;
  border: 1px solid transparent;
  background: var(--wp--preset--color--secondary);
  color: var(--wp--preset--color--neutral);
  font-size: 1.1;
  line-height: 1.2;
  cursor: pointer;
}

/* Hover/active only when enabled */
.nf-form-cont .submit-container .nf-field-element input[type="submit"]:not([disabled]):hover {
  background: var(--wp--preset--color--primary);
}


/* Keyboard focus */
.nf-form-cont .submit-container .nf-field-element input[type="submit"]:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

/* Disabled state */
.nf-form-cont .submit-container .nf-field-element input[type="submit"][disabled] {
  opacity: .6;
  cursor: not-allowed;
}




/* ---------- Publication Search ---------- */

.filter-item {
  display: flex;
  flex-direction: column;
  margin-right: 9rem;
  min-width: 200px;
}

.filter-item label {
  margin-bottom: 0.25rem;
}

.search-button-wrapper {
  justify-content: flex-end;
  margin-top: auto;
}

.publication-search-pagination {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: center;
}
.publication-search-pagination .page-numbers {
  display: inline-block;
  padding: .35rem .55rem;
  text-decoration: none;
}
.publication-search-pagination .page-numbers.current {
  font-weight: 700;
  text-decoration: underline;
}

.publication-search-form {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0rem;
  margin-bottom: 4rem;
}

.publication-search-form .facetwp-facet { 
  margin-bottom: 10px !important; 
}

.publication-search-form > div {
  flex: 0 0 auto;
}

.publication-search-form > p {
  margin: 0;
}

.publication-search-form > p:empty {
  display: none;
  margin: 0;
}

.publication-search-form select {
  max-width: 200px;
  width: 100%;
  padding: 0.4rem;
  border-radius: 4px;
}

.publication-search-form button {
  padding: 0.6rem 1rem;
  border-radius: 4px;
  font-size: 1.1rem;
  line-height: 2rem;
}

.publication-search-total {
  font-size:24px;
}

.facetwp-pager {
  text-align: center;
}

.publication-search-pagination {
  text-align: center;
  margin-top: 2rem;
}

@media (max-width: 640px) {
  .publication-search-form {
      flex-direction: column;
      align-items: stretch;
  }

  .publication-search-form > div {
      width: 100%;
  }

  .publication-search-form select,
  .publication-search-form button {
      width: 100%;
      max-width: none;
  }
}


/* ---------- Content Publication (individual Search results) ---------- */

.publication-search-result {
  padding: 2rem 1.5rem;
  margin-bottom: 2rem;
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
  border-radius: 4px;
  border: 1px solid #DDD;
}

.publication-search-result .image-box {
  flex-shrink: 0;
}

.publication-search-result .image-box img {
  width: 170px;
  height: auto;
  display: block;
  border:1px solid black;
  border-radius: 4px;
}

.publication-search-result .publication-info {
  flex-grow: 1;
  min-width: 0;
}

.publication-search-result .publication-info h2 {
  margin: 0 0 0.5rem 0;
}

.publication-search-result .publication-info a {
  text-decoration: none;
}

.publication-search-result .publication-categories {
  line-height: 1.4;
}

.publication-search-result .publication-categories p {
  margin: 0.6rem 0;
}

@media (max-width: 640px) {
  .publication-search-result {
    flex-direction: column;   /* stack instead of side-by-side */
    align-items: flex-start;  /* keep left aligned */
    gap: 1rem;                /* slightly tighter gap when stacked */
  }

  .publication-search-result .image-box {
    /* keep the thumbnail’s current width; adjust if you want it larger */
    margin-bottom: 0.25rem;
  }

  /* if a long title still pushes the layout, allow it to wrap cleanly */
  .publication-search-result .publication-info h2 a {
    word-break: break-word;
  }
}

@media (max-width: 400px) {
  .publication-search-result .image-box img {
    width: 100%;          /* fill the container width on tiny screens */
    max-width: 260px;     /* cap it if you don’t want full-bleed */
  }
}

/* ---------- All Projects page - Active Projects ---------- */

/* grid cards */
.projects-active-grid {
  display: grid;
  gap: 3rem;
}

.projects-active-grid .project-card {
  display: flex;
  flex-direction: column;
}

.projects-active-grid .project-card > p:empty {
  display: none;
  margin: 0;
}

.projects-active-grid .project-title { 
    margin: 2rem 0 1rem; 
}

.projects-active-grid .project-title a {
  text-decoration: none;
  font-size: 1.6rem;
}

.projects-active-grid .project-summary { 
    margin: 0; 
}

.projects-active-grid .project-summary a { 
  text-decoration: none;
}

/* base (3 columns typical) */
.projects-active-grid .project-thumb-link {
  display: block;
  aspect-ratio: 3 / 2;   /* consistent card top area */
  overflow: hidden;
}
.projects-active-grid .project-thumb-link img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: bottom; /* align bottoms in 3-col */
  display: block;
  border: 1px solid var(--wp--preset--color--neutral);
  border-radius: 4px;
}

/* Desktop: honor the shortcode's column count */
.projects-active-grid.cols-1 { grid-template-columns: 1fr; }
.projects-active-grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.projects-active-grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.projects-active-grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }

/* Tablet: force 2 columns regardless */
@media (max-width: 980px) {
  .projects-active-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}

/* Phone: force 1 column regardless */
@media (max-width: 640px) {
  .projects-active-grid { grid-template-columns: 1fr !important; }
}





/* ---------- All Projects page - Completed Projects (facet) ---------- */


/* Grid container */
.projects-completed-grid {
    display: grid;
    grid-template-columns: 1fr;      /* 1 column on mobile */
    gap: 2rem;
}

/* 2 columns on tablets */
@media (min-width: 768px) {
    .projects-completed-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* 3 columns on desktop */
@media (min-width: 1024px) {
    .projects-completed-grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* Each project item is a blocky link */
.projects-completed-grid__item {
    display: block;
    text-decoration: none;
    height: 100%;
}

/* Thumbnail wrapper: enforce 3:2 ratio */
.projects-completed-grid__thumb {
    position: relative;
    width: 100%;
    aspect-ratio: 3 / 2;   /* standard 3:2 box */
    overflow: hidden;
    margin-bottom: 0.5rem;
    border-radius: 4px;
    border: 1px solid var(--wp--preset--color--neutral);
}

.projects-completed-grid__thumb-img {
    width: 100%;
    height: 100%;
    object-fit: cover;     /* fills box, crops as needed */
    display: block;
}

/* Title + year */
.projects-completed-grid__title {
}

.projects-completed-grid__year {
}



/* Only the filter-item that wraps the projects_completed_sort facet, as opposed to anything on other search pages */
.filter-item:has(> .facetwp-facet-projects_completed_sort) {
  margin-left: 0;
  min-width: 0;
  max-width: 260px;
}







/* ---------- All Projects page - Completed Projects (twig) ---------- */






/* Wrapper (optional) */
.projects-completed-list {
    width: 100%;
}

/* Column layout, like your original Twig version */
.projects-completed-list__grid {
    columns: 2;
    column-gap: 2rem;
    list-style: none;
    margin: 0.5rem 0 0;
    padding: 0;
    font-size: 1.5rem;
    line-height: 2rem;
}

/* One column on narrow screens */
@media (max-width: 700px) {
    .projects-completed-list__grid {
        columns: 1;
    }
}

/* Each item stays intact within a column */
.projects-completed-list__item {
    break-inside: avoid;
    margin: 0 0 1.5rem 0;
}

/* Link styling: no underline, slightly more breathing room */
.projects-completed-list__link {
    text-decoration: none;
    display: inline;       /* inline is fine here, columns handle wrapping nicely */
}

/* Keep no underline on hover/focus too */
.projects-completed-list__link:hover,
.projects-completed-list__link:focus {
    text-decoration: none;
}







/* ---------- Featured Projects on home page ---------- */

    /* Wrapper */
.projects-featured { 
    display: grid; 
    gap: 5rem; 
}

/* Row: 2 columns on wide screens, stacks on small */
.projects-featured .pf-row {
  display: grid;
  grid-template-columns: 1fr 1fr; /* tweak ratio */
  align-items: center;
  gap: 2rem;
}
.projects-featured .pf-row.is-reversed .pf-media { 
    order: 2; 
}
.projects-featured .pf-row.is-reversed .pf-body  { 
    order: 1; 
}
.projects-featured .pf-media,
.projects-featured .pf-body {
  margin: 0;
  padding: 0;                    /* remove any theme padding */
  min-width: 0;
}
.projects-featured .pf-body {
  display: flex;                 /* stack title/summary/button */
  flex-direction: column;
  justify-content: center;       /* centers the whole text block vertically */
}
.projects-featured .pf-title { 
  margin-top: 0; 
}

    /* Media (image) */
.projects-featured .pf-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 2;   /* consistent window; adjust if needed */
  overflow: hidden;
  border-radius: 4px;
  border: 1px var(--wp--preset--color--neutral) solid;
}
.projects-featured .pf-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

    /* Text */
.projects-featured .pf-title a { 
  text-decoration: none; 
}
.projects-featured .pf-summary { 
  margin: 0 0 2rem; 
}
.projects-featured .pf-button {
  display: inline-block;
  border: 1px var(--wp--preset--color--neutral) solid; 
  border-radius: 4px;
  padding: .6rem 1rem;
  text-decoration: none;
  font-size: 1.1rem;
}

@media (max-width: 640px) {
  .projects-featured .pf-row {
    grid-template-columns: 1fr;  /* stack image above text */
    align-items: start;          /* avoid vertical centering weirdness */
    gap: 1.25rem;                /* keep space between stacked blocks */
  }
  
  .projects-featured .pf-row.is-reversed .pf-media,
  .projects-featured .pf-row.is-reversed .pf-body { 
    order: initial; 
  }
}

@media (min-width: 981px) {
  /* Make image column narrower */
  .projects-featured .pf-row {
    gap: 5rem;
  }
}


/* ---------- Project page ---------- */

.project-status { margin: 0 0 1rem; }

.project-status__box {
  display: inline-block;
  padding: .25rem .5rem;
  border: 1px solid var(--wp--preset--color--secondary);
  border-radius: 4px;
  max-width: 100%;
  white-space: nowrap;   /* drop if you want wrapping */
}

/* Project banner: shorter on mobile (overrides inline height) */
@media (max-width: 768px) {
  figure.project-banner.wp-block-post-featured-image {
    height: 160px !important;
  }

  figure.project-banner.wp-block-post-featured-image > img.wp-post-image {
    height: 160px !important;
    width: 100% !important;
    object-fit: cover;
  }
}



/* ---------- Project Documents on project page ---------- */

    /* Force children inline on one line (override themes that set block links/spans) */
.entry-content .project-documents-list li > a,
.entry-content .project-documents-list li > .doc-tail {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}

    /* If anything else sneaks in, catch-all for direct children */
.entry-content .project-documents-list li > * {
  display: inline !important;
  margin: 0 !important;
  padding: 0 !important;
}

    /* Safety: if a <br> was injected by content filters, hide it */
.entry-content .project-documents-list li br { 
  display: none; 
}


/* ---------- News Archive and Category pages ---------- */

.category-filter select {
  width: auto; 
  max-width: 100%; 
  padding: 0.5rem;
  border-radius: 4px;
}


/* ---------- Page titles ---------- */

.page-title {
  position: relative;
}

.page-title::after {
  content: "";
  display: block;
  width: 30%;
  border-bottom: 4px solid var(--wp--preset--color--contrast);
  border-radius: 10px;
  position: absolute;
  left: 0;
  bottom: 0;
}


/* ---------- Main navigation menu ---------- */

    /* Bold */
.main-nav a.wp-block-navigation-item__content {
  font-weight: 400;
}

    /* Hover/focus */
.main-nav a.wp-block-navigation-item__content:hover,
.main-nav a.wp-block-navigation-item__content:focus {
  color: var(--wp--preset--color--secondary);
}

.wpml-language-switch li[data-wpml="current-language-item"]{
    display:none!important;
}

/* scope styles only to search form in nav */
.nav-search .wp-block-search__input {
  height: 32px;         /* reduce height */
  padding: 4px 8px;     /* tighter vertical padding */
  font-size: 1rem;    /* optional: smaller text */
}

.nav-search .wp-block-search__button {
  height: 32px;         /* match input height */
  padding-left: 8px;    /* less left padding */
  padding-right: 8px;   /* less right padding */
  line-height: 1.1;       /* keep button compact */
  display: flex;        /* keep icon centered */
  align-items: center;
  justify-content: center;
  background-color: var(--wp--preset--color--neutral);
  color: var(--wp--preset--color--white);
}