/* AVD Schools and Reviews — Luxury Schools Widget */

.avdsr-sl-wrap {
  --sl-bg:            #ffffff;
  --sl-title-color:   #111111;
  --sl-title-font:    'Georgia', serif;
  --sl-title-size:    2.4rem;
  --sl-body-font:     inherit;
  --sl-desc-color:    #555555;
  --sl-attr-color:    #aaaaaa;
  --sl-tab-bg:        transparent;
  --sl-tab-inactive-bg: transparent;
  --sl-tab-color:     #111111;
  --sl-tab-border:    #cccccc;
  --sl-tab-active-bg: #111111;
  --sl-tab-active-color: #ffffff;
  --sl-tab-radius:    100px;
  --sl-head-color:    #aaaaaa;
  --sl-row-border:    #e8e8e8;
  --sl-name-color:    #111111;
  --sl-name-hover:    #555555;
  --sl-addr-color:    #999999;
  --sl-badge-color:   #555555;
  --sl-badge-border:  #cccccc;
  --sl-grade-color:   #555555;
  --sl-star-empty:    #dddddd;
  --sl-star-full:     #c9a84c;
  --sl-rating-color:  #111111;
  --sl-icon-bg:       #111111;
  --sl-icon-color:    #ffffff;

  background: var(--sl-bg);
  font-family: var(--sl-body-font);
}

/* ── Title ─────────────────────────── */
.avdsr-sl-title {
  font-family: var(--sl-title-font);
  font-size: var(--sl-title-size);
  font-weight: 400;
  color: var(--sl-title-color);
  letter-spacing: .04em;
  text-transform: uppercase;
  line-height: 1.15;
  margin: 0 0 24px;
}

/* ── Filter tabs ─────────────────────── */
.avdsr-sl-tabs {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 24px;
}

.avdsr-sl-tab {
  display: inline-flex;
  align-items: center;
  padding: 8px 18px;
  border-radius: var(--sl-tab-radius);
  border: 1.5px solid var(--sl-tab-border);
  background: var(--sl-tab-inactive-bg, var(--sl-tab-bg));
  color: var(--sl-tab-color);
  font-size: .82rem;
  font-weight: 500;
  cursor: pointer;
  transition: all .2s;
  white-space: nowrap;
}
.avdsr-sl-tab:hover {
  border-color: var(--sl-tab-active-bg);
  color: var(--sl-tab-active-bg);
}
.avdsr-sl-tab--active {
  background: var(--sl-tab-active-bg);
  border-color: var(--sl-tab-active-bg);
  color: var(--sl-tab-active-color);
}

/* ── Description ─────────────────────── */
.avdsr-sl-description {
  margin-bottom: 24px;
}
.avdsr-sl-description p {
  font-size: .875rem;
  color: var(--sl-desc-color);
  line-height: 1.7;
  margin: 0 0 4px;
}
.avdsr-sl-attr {
  color: var(--sl-attr-color) !important;
  font-size: .78rem !important;
}

/* ── Table header ─────────────────────── */
.avdsr-sl-table-head {
  display: grid;
  grid-template-columns: 48px 1fr 110px 100px 160px;
  gap: 0 16px;
  padding: 10px 16px;
  border-top: 1px solid var(--sl-row-border);
  border-bottom: 1px solid var(--sl-row-border);
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .12em;
  color: var(--sl-head-color);
  align-items: center;
}

/* ── Panel ────────────────────────────── */
.avdsr-sl-panel { display: none; }
.avdsr-sl-panel--active { display: block; }

/* ── Row ──────────────────────────────── */
.avdsr-sl-row {
  display: grid;
  grid-template-columns: 48px 1fr 110px 100px 160px;
  gap: 0 16px;
  padding: 20px 16px;
  border-bottom: 1px solid var(--sl-row-border);
  align-items: center;
  transition: background .15s;
}
.avdsr-sl-row:hover { background: #fafafa; }

/* ── Icon ─────────────────────────────── */
.avdsr-sl-col-icon { display: flex; align-items: center; justify-content: center; }
.avdsr-sl-icon {
  width: 36px; height: 36px;
  border-radius: 50%;
  background: var(--sl-icon-bg);
  color: var(--sl-icon-color);
  display: flex; align-items: center; justify-content: center;
  font-size: .9rem;
  flex-shrink: 0;
}

/* ── Name & address ──────────────────── */
.avdsr-sl-col-name { overflow: hidden; }
.avdsr-sl-name {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: .9rem;
  font-weight: 600;
  color: var(--sl-name-color);
  text-decoration: none;
  line-height: 1.3;
  transition: color .18s;
}
.avdsr-sl-name:hover { color: var(--sl-name-hover); }
.avdsr-sl-arrow { flex-shrink: 0; opacity: .5; }
.avdsr-sl-name:hover .avdsr-sl-arrow { opacity: 1; }

.avdsr-sl-address {
  display: block;
  font-size: .75rem;
  color: var(--sl-addr-color);
  margin-top: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ── Badge ────────────────────────────── */
.avdsr-sl-badge {
  display: inline-block;
  font-size: .65rem;
  font-weight: 700;
  letter-spacing: .1em;
  color: var(--sl-badge-color);
  border: 1px solid var(--sl-badge-border);
  border-radius: 4px;
  padding: 3px 8px;
}

/* ── Grades ───────────────────────────── */
.avdsr-sl-col-grades {
  font-size: .82rem;
  color: var(--sl-grade-color);
}

/* ── Stars ────────────────────────────── */
.avdsr-sl-col-rating {
  display: flex;
  align-items: center;
  gap: 6px;
}
.avdsr-sl-stars { display: inline-flex; gap: 2px; }
.avdsr-sl-star path { fill: var(--sl-star-empty); stroke: var(--sl-star-empty); }
.avdsr-sl-star--full path { fill: var(--sl-star-full); stroke: var(--sl-star-full); }
.avdsr-sl-rating-val {
  font-size: .82rem;
  color: var(--sl-rating-color);
  font-weight: 500;
}
.avdsr-sl-no-rating { color: var(--sl-head-color); }

/* ── Hidden rows (Show More) ────────────── */
.avdsr-sl-row--hidden { display: none; }

/* ── Show More / Less button ─────────────── */
.avdsr-sl-footer {
  display: flex;
  justify-content: center;
  padding: 28px 0 4px;
}
.avdsr-sl-showmore {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 14px 40px;
  background: var(--sl-showmore-bg, #7aada0);
  color: var(--sl-showmore-color, #ffffff);
  font-size: .72rem;
  font-weight: 700;
  letter-spacing: .14em;
  border: none;
  border-radius: var(--sl-showmore-radius, 0px);
  cursor: pointer;
  transition: opacity .2s, transform .15s;
}
.avdsr-sl-showmore:hover { opacity: .85; transform: translateY(-1px); }

.avdsr-sl-error {
  padding: 14px 18px;
  background: #fef2f2;
  border: 1px solid #fca5a5;
  border-radius: 8px;
  font-size: .875rem;
  color: #991b1b;
}

/* ── Responsive ─────────────────────── */
@media (max-width: 720px) {
  .avdsr-sl-table-head { display: none; }
  .avdsr-sl-row {
    grid-template-columns: 40px 1fr;
    grid-template-rows: auto auto auto;
    row-gap: 6px;
    padding: 16px 10px;
  }
  .avdsr-sl-col-icon { grid-row: 1 / 3; }
  .avdsr-sl-col-name { grid-column: 2; }
  .avdsr-sl-col-cat  { grid-column: 2; grid-row: 2; }
  .avdsr-sl-col-grades { display: none; }
  .avdsr-sl-col-rating { grid-column: 2; grid-row: 3; }
}
