/* =========================================
   MDM ARCHIVES (filters UI)
========================================= */

/* IMPORTANT: This form now sits inside a hero-like surface,
   so we do NOT want an extra border-top inside it. */
.mdm-archives-filters{
  margin-top: 0;
  padding-top: 0;
  border-top: 0;
}

/* Top row: labels aligned */
.mdm-archives-filter-row{
  display: grid;
  gap: .85rem;
}

.mdm-archives-filter-row-top{
  grid-template-columns: 1.25fr 1.45fr;
  align-items: start;
}

/* Search row (standalone, between inputs and Apply) */
.mdm-archives-filter-row-search{
  grid-template-columns: 1fr;
  margin-top: .65rem;
}

/* Buttons row */
.mdm-archives-filter-row-actions{
  grid-template-columns: 1fr;
  margin-top: .85rem; /* a little more breathing room */
}

.mdm-archives-actions{
  display: flex;
  gap: .5rem;
  align-items: center;
}

/* Fields */
.mdm-archives-field{
  position: relative;
  display: flex;
  flex-direction: column;
}

.mdm-archives-label{
  display: block;
  font-weight: 850;
  letter-spacing: -.01em;
  font-size: .9rem;
  color: rgba(18,20,23,.78);
  margin: 0 0 .4rem 0;
}

/* =========================================
   CATEGORY MULTISELECT
========================================= */

.mdm-archives-multiselect{
  width: 100%;
  min-height: 46px;
  padding: .55rem .9rem;
  border-radius: 14px;
  border: 1px solid var(--mdm-gray-200);
  background: var(--mdm-white);
  box-shadow: 0 1px 0 rgba(18,20,23,.02);

  display: flex;
  align-items: center;
  gap: .5rem;

  cursor: pointer;
  text-align: left;
}

.mdm-archives-multiselect:hover{ background: var(--mdm-gray-100); }

.mdm-archives-multiselect:focus{ outline: none; }

.mdm-archives-multiselect:focus-visible{
  border-color: rgba(179, 25, 31, .35);
  box-shadow: 0 0 0 4px rgba(179, 25, 31, .08);
}

.mdm-archives-multiselect-pills{
  display: flex;
  flex-wrap: wrap;
  gap: .35rem;
  align-items: center;
}

.mdm-archives-multiselect-placeholder{
  color: var(--mdm-gray-600);
  font-weight: 650;
  font-size: .95rem;
}

.mdm-archives-chevron{
  margin-left: auto;
  width: 18px;
  height: 18px;
  display: inline-block;
  opacity: .7;
  background: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/%3E%3C/svg%3E") no-repeat center / contain;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.41 8.59 12 13.17l4.59-4.58L18 10l-6 6-6-6z'/%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform .14s ease;
}

.mdm-archives-multiselect[aria-expanded="true"] .mdm-archives-chevron{ transform: rotate(180deg); }

.mdm-archives-pill.mdm-single-kicker-link{
  font-size: .85rem;
  padding: .26rem .58rem;
  border-radius: 999px;
}

/* Dropdown: anchored to left edge of input, can be wider, clamped to viewport */
.mdm-archives-dropdown{
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 30;

  background: var(--mdm-white);
  border: 1px solid var(--mdm-gray-150);
  border-radius: 14px;
  box-shadow: var(--mdm-shadow-soft);

  display: none;

  min-width: 100%;
  width: 760px;
  max-width: calc(100vw - 24px);
}

.mdm-archives-dropdown.is-open{ display: block; }

.mdm-archives-dropdown-inner{ padding: .65rem; }

/* All categories at once, multi-column */
.mdm-archives-dropdown-scroll{
  overflow: visible;
  max-height: none;

  column-count: 3;
  column-gap: .9rem;

  padding: .15rem .15rem .35rem .15rem;
}

.mdm-archives-dropdown-scroll .mdm-archives-check{
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
}

/* Checkbox rows */
.mdm-archives-check{
  display: grid;
  grid-template-columns: 18px 1fr;
  gap: .55rem;
  align-items: center;

  padding: .5rem .55rem;
  border-radius: 12px;
  cursor: pointer;
  width: 100%;
}

.mdm-archives-check:hover{ background: var(--mdm-gray-100); }

.mdm-archives-check input{
  position: absolute;
  opacity: 0;
  pointer-events: none;
}

.mdm-archives-check-box{
  width: 18px;
  height: 18px;
  border-radius: 6px;
  border: 1px solid rgba(18,20,23,.18);
  background: #fff;
  box-shadow: 0 1px 0 rgba(18,20,23,.02);
  position: relative;
}

.mdm-archives-check input:checked + .mdm-archives-check-box{
  border-color: rgba(179, 25, 31, .35);
  background: rgba(179, 25, 31, .10);
}

.mdm-archives-check input:checked + .mdm-archives-check-box::after{
  content: "";
  position: absolute;
  inset: 3px;
  border-radius: 4px;
  background: rgba(179, 25, 31, .75);
}

.mdm-archives-check-label{
  font-weight: 750;
  font-size: .90rem; /* slightly smaller */
  color: rgba(18,20,23,.86);
  line-height: 1.25;
}

/* Dropdown actions */
.mdm-archives-dropdown-actions{
  display: flex;
  justify-content: space-between;
  gap: .5rem;
  padding: .7rem .25rem .1rem .25rem;
  border-top: 1px solid rgba(18,20,23,.08);
  margin-top: .5rem;
}

.mdm-archives-mini-btn{
  background: var(--mdm-gray-100);
  border: 1px solid var(--mdm-gray-200);
  border-radius: 12px;
  padding: .45rem .8rem;
  font-weight: 850;
  letter-spacing: -.01em;
  cursor: pointer;
  height: 42px;
}

.mdm-archives-mini-btn:hover{ background: var(--mdm-gray-150); }

#mdmArchivesCatsDone{
  background: var(--mdm-red);
  color: var(--mdm-white);
  border: 1px solid var(--mdm-red);
  box-shadow: 0 10px 24px rgba(179, 25, 31, .14);
}

#mdmArchivesCatsDone:hover{
  background: var(--mdm-red-hover);
  border-color: var(--mdm-red-hover);
  color: var(--mdm-white);
}

/* =========================================
   DATE RANGE CONTROLS
========================================= */

.mdm-archives-dategrid{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .65rem;
}

.mdm-archives-datebox{
  padding: .6rem .65rem;
  border-radius: 14px;
  border: 1px solid var(--mdm-gray-200);
  background: var(--mdm-white);
}

.mdm-archives-datehead{
  font-size: .86rem;
  font-weight: 850;
  color: rgba(18,20,23,.72);
  margin-bottom: .45rem;
}

.mdm-archives-daterow{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
}

.mdm-archives-daterow.mdm-archives-daterow-stacked{
  grid-template-columns: 1fr !important;
  gap: .45rem;
}

.mdm-archives-select{
  width: 100%;
  height: 40px;
  border-radius: 12px;
  border: 1px solid var(--mdm-gray-200);
  background: var(--mdm-gray-100);
  padding: 0 .65rem;
  font-weight: 750;
  color: rgba(18,20,23,.84);
}

.mdm-archives-select:focus{ outline: none; }

.mdm-archives-select:focus-visible{
  border-color: rgba(179, 25, 31, .35);
  box-shadow: 0 0 0 4px rgba(179, 25, 31, .08);
  background: #fff;
}

/* =========================================
   SEARCH INPUT
========================================= */

.mdm-archives-searchwrap{
  position: relative;
}

.mdm-archives-search{
  width: 100%;
  height: 46px;
  border-radius: 14px;
  border: 1px solid var(--mdm-gray-200);
  background: var(--mdm-white);
  padding: .6rem .9rem;
  padding-right: 2.2rem;
  font-weight: 700;
  color: rgba(18,20,23,.88);
  box-shadow: 0 1px 0 rgba(18,20,23,.02);
}

.mdm-archives-search:focus{ outline: none; }

.mdm-archives-search:focus-visible{
  border-color: rgba(179, 25, 31, .35);
  box-shadow: 0 0 0 4px rgba(179, 25, 31, .08);
}

.mdm-archives-search-clear{
  position: absolute;
  right: .6rem;
  top: 50%;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  background: var(--mdm-gray-100);
  border: 1px solid var(--mdm-gray-200);
  color: rgba(18,20,23,.70);
  font-weight: 900;
  line-height: 1;
}

.mdm-archives-search-clear:hover{
  background: var(--mdm-gray-150);
  color: rgba(18,20,23,.88);
}

/* =========================================
   RESPONSIVE
========================================= */

@media (max-width: 991.98px){
  .mdm-archives-filter-row-top{
    grid-template-columns: 1fr;
  }

  .mdm-archives-dategrid{
    grid-template-columns: 1fr;
  }

  .mdm-archives-actions{
    flex-wrap: wrap;
  }

  .mdm-archives-dropdown-scroll{
    column-count: 2;
  }

  .mdm-archives-dropdown{
    width: min(720px, calc(100vw - 24px));
  }
}

@media (max-width: 575.98px){
  .mdm-archives-dropdown{
    width: calc(100vw - 16px);
    max-width: calc(100vw - 16px);
    left: 0;
  }

  .mdm-archives-dropdown-scroll{
    column-count: 1;
  }

  .mdm-archives-check-label{
    font-size: .88rem;
  }
}

/* =========================================
   ARCHIVES: Form container surface
   - keep “hero” shape but NOT the big beige fill + red bar
========================================= */

.mdm-archives-form-hero{
  margin-top: .9rem;
  margin-bottom: 1.05rem;

  /* override mdm-hero fill */
  background: #fff;
  border-color: rgba(18,20,23,.10);
  box-shadow:
    0 14px 34px rgba(18,20,23,.06),
    0 2px 10px rgba(18,20,23,.03);
}

/* kill the front-hero red rule for archives (too loud here) */
.mdm-archives-form-hero::before{
  display: none !important;
}

/* subtle internal “editorial rule” */
.mdm-archives-form-hero .mdm-archives-form-hero-inner{
  padding: 1rem;
  position: relative;
}

.mdm-archives-form-hero .mdm-archives-form-hero-inner::before{
  content: "";
  display: block;
  height: 2px;
  border-radius: 999px;
  background: rgba(179,25,31,.70);
  margin: 0 0 .9rem 0;
  opacity: .35; /* much quieter than the hero bar */
}

/* Mobile: slightly tighter */
@media (max-width: 575.98px){
  .mdm-archives-form-hero{
    margin-top: .75rem;
    margin-bottom: .9rem;
  }
  .mdm-archives-form-hero .mdm-archives-form-hero-inner{
    padding: .85rem;
  }
}

#mdmSearchList{ margin-top: .35rem; }

/* =========================================
   ARCHIVES: allow dropdowns to escape hero
========================================= */

/* front-hero.css sets .mdm-hero { overflow:hidden; } which clips the dropdown */
.mdm-archives-form-hero{
  overflow: visible !important;
}

/* also ensure inner wrapper doesn't clip */
.mdm-archives-form-hero-inner{
  overflow: visible !important;
}

/* make sure the field anchors the dropdown */
#mdmArchivesCats{
  position: relative;
}

/* keep dropdown above everything */
#mdmArchivesCatsDropdown{
  z-index: 9999;
}
