/**
 * Everything is scoped to #lei-single. Generic class names (.container,
 * .button, .section, .panel) therefore cannot collide with the theme or
 * with Elementor, in either direction.
 */

html { scroll-behavior: smooth; }

#lei-single {
  --primary: #0868f5;
  --primary-dark: #045bdc;
  --navy: #071d57;
  --text: #243661;
  --muted: #5f7095;
  --line: #dbe7f7;
  --surface: #ffffff;
  --soft: #f5f9ff;
  --success: #079b68;
  --success-bg: #def7eb;
  --warn: #b7791f;
  --warn-bg: #fdf3dc;
  --radius: 10px;
  --shadow: 0 5px 18px rgba(19, 73, 143, .05);
  --lei-container: 1350px;
  color: var(--text);
  background: #fff;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  line-height: 1.55;
}

#lei-single, #lei-single * { box-sizing: border-box; }
#lei-single a { color: inherit; text-decoration: none; }
#lei-single button, #lei-single input { font: inherit; }
#lei-single .svg-sprite { position: absolute; width: 0; height: 0; overflow: hidden; }
#lei-single svg { width: 1.25em; height: 1.25em; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
#lei-single .lei-container { width: min(calc(100% - 40px), var(--lei-container)); margin-inline: auto; }
#lei-single .section { padding-top: 20px; }
#lei-single .panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); }
#lei-single h1, #lei-single h2, #lei-single h3, #lei-single p { margin-top: 0; }
#lei-single h1, #lei-single h2, #lei-single h3, #lei-single strong { color: var(--navy); }
#lei-single h1 { margin-bottom: 0; font-size: clamp(2rem, 3.4vw, 3.1rem); line-height: 1.05; letter-spacing: -.035em; }
#lei-single h2 { margin-bottom: 20px; font-size: 1.35rem; line-height: 1.2; }
#lei-single h3 { margin-bottom: 14px; font-size: 1.08rem; }
#lei-single .lei-empty { color: var(--muted); }

#lei-single .button { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 24px; border: 1px solid transparent; border-radius: 6px; font-weight: 700; line-height: 1.2; transition: .2s ease; }
#lei-single .button:hover { transform: translateY(-1px); }
#lei-single .button-primary { color: #fff; background: var(--primary); box-shadow: 0 7px 15px rgba(8,104,245,.16); }
#lei-single .button-primary:hover { background: var(--primary-dark); color: #fff; }
#lei-single .button-outline { color: var(--primary); background: #fff; border-color: var(--primary); }
#lei-single .button-outline:hover { background: #f3f8ff; }
#lei-single .button.compact { min-width: 145px; min-height: 40px; padding: 8px 18px; }
#lei-single .button.tiny { min-height: 34px; padding: 7px 18px; font-size: .88rem; }

#lei-single .entity-shell { padding: 14px 0 0; background: linear-gradient(180deg, #f9fbff 0%, #fff 100%); }
#lei-single .entity-hero { display: grid; grid-template-columns: 1fr 285px; gap: 42px; padding: 32px; }
#lei-single .title-row { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; }
#lei-single .status-tag { display: inline-flex; align-items: center; justify-content: center; padding: 5px 10px; color: #05774f; background: var(--success-bg); border: 1px solid #9fe2c5; border-radius: 5px; font-size: .78rem; font-weight: 800; }
#lei-single .status-tag.warn { color: #8a5a00; background: var(--warn-bg); border-color: #eccd8a; }
#lei-single .status-tag.small { padding: 4px 8px; font-size: .7rem; }
#lei-single .lei-code { min-width: 465px; margin: 25px 0 36px; display: inline-flex; align-items: center; justify-content: space-between; gap: 24px; padding: 15px 18px; color: var(--navy); background: #f8fbff; border: 1px solid var(--line); border-radius: 8px; cursor: pointer; text-align: left; }
#lei-single .lei-code.is-static { cursor: default; }
#lei-single .lei-code strong { display: block; font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace; font-size: 1.55rem; letter-spacing: .035em; }
#lei-single .lei-code small { display: block; margin-top: 4px; color: var(--muted); }
#lei-single .lei-code.copied { border-color: var(--success); }
#lei-single .lei-code.copied > svg { color: var(--success); }
#lei-single .hero-meta { display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr)); gap: 20px; margin: 0; }
#lei-single .hero-meta dt { margin-bottom: 4px; color: var(--muted); font-size: .75rem; font-weight: 600; }
#lei-single .hero-meta dd { margin: 0; color: var(--navy); font-weight: 500; }
#lei-single .flag { margin-right: 4px; }
#lei-single .source-note { display: flex; align-items: center; gap: 8px; margin: 30px 0 0; padding-top: 18px; color: var(--muted); border-top: 1px solid var(--line); font-size: .8rem; }
#lei-single .source-note svg { color: var(--primary); }
#lei-single .hero-actions { display: flex; flex-direction: column; gap: 10px; padding-top: 10px; }
#lei-single .hero-actions .button { width: 100%; }

#lei-single .overview-section h2 { margin: 8px 0 30px 3px; font-size: 1.55rem; }
#lei-single .overview-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }
#lei-single .overview-card { min-height: 220px; padding: 30px; }
#lei-single .overview-card p { color: var(--muted); }
#lei-single .metric { min-height: 52px; display: flex; align-items: center; gap: 12px; margin: 12px 0 4px; }
#lei-single .metric strong { font-size: 1.6rem; }
#lei-single .success-text strong { color: var(--success); }
#lei-single .warn-text strong { color: var(--warn); }
#lei-single .round-icon { flex: 0 0 auto; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; }
#lei-single .round-icon.success { color: #fff; background: var(--success); }
#lei-single .round-icon.warn { color: #fff; background: var(--warn); }
#lei-single .round-icon.primary { width: 32px; height: 32px; color: #fff; background: var(--primary); }
#lei-single .renew-metric { display: flex; align-items: center; gap: 14px; margin: 9px 0 2px; }
#lei-single .renew-metric > svg { width: 40px; height: 40px; color: var(--primary); }
#lei-single .renew-metric span { display: flex; flex-direction: column; color: var(--muted); }
#lei-single .renew-metric strong { font-size: 1.65rem; line-height: 1.2; }
#lei-single .timeline { position: relative; display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 20px; padding: 22px 30px 18px; overflow: hidden; }
#lei-single .timeline::before { content: ""; position: absolute; top: 28px; left: 16.5%; right: 16.5%; height: 2px; background: #4ab88e; }
#lei-single .timeline > div { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; text-align: center; }
#lei-single .timeline-dot { width: 28px; height: 28px; display: inline-flex; align-items: center; justify-content: center; margin-bottom: 8px; color: #fff; background: var(--success); border: 4px solid #fff; border-radius: 50%; }
#lei-single .timeline-dot.warn { background: var(--warn); }
#lei-single .timeline-dot svg { width: 12px; height: 12px; }
#lei-single .timeline small { color: var(--muted); }
#lei-single .timeline strong { margin-top: 4px; font-size: 1rem; }

#lei-single .data-grid { display: grid; grid-template-columns: 1fr 1.08fr; gap: 20px; }
#lei-single .data-card { padding: 28px; }
#lei-single .data-list { margin: 0; }
#lei-single .data-list > div { min-height: 43px; display: grid; grid-template-columns: minmax(185px, .9fr) 1.2fr; align-items: center; gap: 16px; padding: 8px 0; border-bottom: 1px solid #e5edf8; }
#lei-single .data-list > div:last-child { border-bottom: 0; }
#lei-single .data-list dt { color: var(--muted); font-size: .84rem; }
#lei-single .data-list dd { margin: 0; overflow-wrap: anywhere; color: var(--navy); font-weight: 500; }
#lei-single .data-list dd a { color: var(--primary); }
#lei-single .registration-list .renew-row { grid-template-columns: minmax(185px, .9fr) 1fr 180px; }
#lei-single .renew-row aside { grid-row: span 2; display: flex; flex-direction: column; gap: 8px; padding: 13px; background: var(--soft); border: 1px solid var(--line); border-radius: 8px; text-align: center; color: var(--primary); font-size: .8rem; }

#lei-single .stack { display: grid; gap: 20px; }
#lei-single .address-card { min-height: 180px; display: flex; align-items: stretch; justify-content: space-between; gap: 30px; padding: 24px 28px; }
#lei-single .address-card address { color: var(--navy); font-style: normal; font-size: .86rem; line-height: 1.55; }
#lei-single .map-visual { position: relative; width: 270px; min-height: 125px; align-self: center; overflow: hidden; border-radius: 8px; background-color: #edf4fd; background-image: linear-gradient(30deg, transparent 48%, #fff 49%, #fff 52%, transparent 53%), linear-gradient(-30deg, transparent 48%, #fff 49%, #fff 52%, transparent 53%); background-size: 60px 60px; }
#lei-single .map-visual.is-leaflet { width: 500px;}
#lei-single .map-visual:not(.is-leaflet) span { position: absolute; inset: 50% auto auto 50%; width: 48px; height: 48px; display: grid; place-items: center; transform: translate(-50%, -50%); color: #fff; background: var(--primary); border-radius: 50%; transition: transform .18s ease, box-shadow .18s ease; }
#lei-single .map-visual svg { width: 27px; height: 27px; }
#lei-single a.map-visual { display: block; cursor: pointer; }

/* Leaflet mode: the slot keeps the same footprint as the static illustration,
   so switching modes does not move anything else on the card. */
#lei-single .map-visual.is-leaflet { background-image: none; min-height: 300px; z-index: 0; }
#lei-single .map-visual.is-leaflet .leaflet-control-attribution { font-size: .62rem; }
#lei-single .map-visual.is-leaflet .leaflet-control-zoom a { color: var(--navy); }
#lei-single .lei24-pin span { display: block; width: 34px; height: 34px; background: var(--primary); border: 3px solid #fff; border-radius: 50%; box-shadow: 0 3px 10px rgba(8,104,245,.45); }
#lei-single .map-visual.is-leaflet .lei24-pin span { display: block; width: 28px; height: 28px; }
#lei-single a.map-visual:hover span { transform: translate(-50%, -62%); box-shadow: 0 9px 20px rgba(8,104,245,.38); }
#lei-single a.map-visual:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
#lei-single .same-address { min-width: 270px; align-self: center; display: flex; align-items: center; justify-content: center; gap: 12px; padding: 30px 20px; color: var(--navy); background: var(--soft); border: 1px solid var(--line); border-radius: 8px; font-weight: 600; }

#lei-single .related-card { padding: 24px 28px; }
#lei-single .related-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
#lei-single .related-grid section { padding: 20px; border: 1px solid var(--line); border-radius: 8px; }
#lei-single .related-grid h3 { display: flex; align-items: center; gap: 9px; }
#lei-single .related-grid h3 svg { color: var(--primary); }
#lei-single .related-grid p { margin-left: 34px; color: var(--muted); }
#lei-single .related-grid small { margin-left: 34px; color: var(--muted); }
#lei-single .related-list { margin: 0 0 10px 34px; padding: 0; list-style: none; }
#lei-single .related-list li { margin-bottom: 8px; }
#lei-single .related-list a { color: var(--primary); font-weight: 600; }
#lei-single .related-list small { display: block; margin: 0; color: var(--muted); font-size: .78rem; }
#lei-single .related-more { margin: 0 0 10px 34px; color: var(--muted); font-size: .82rem; font-style: italic; }
#lei-single .related-list li.is-extra { display: none; }
#lei-single .related-list.is-open li.is-extra { display: list-item; }
/* Large groups have hundreds of members - the opened list gets its own
   scroll area so it does not stretch the whole page. */
#lei-single .related-list.is-open { max-height: 420px; overflow-y: auto; padding-right: 10px; }
#lei-single .related-toggle { margin: 4px 0 10px 34px; cursor: pointer; }

#lei-single .certificate-wrap { padding: 24px 28px; }
#lei-single .certificate-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 48px; align-items: center; }
#lei-single .certificate-preview { padding: 8px; background: #f8fbff; border: 1px solid #b7cff2; border-radius: 8px; }
#lei-single .cert-border { min-height: 400px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 34px; color: var(--navy); border: 6px double #82ace7; outline: 2px solid #bcd2ef; background-color: #fff; background-image: radial-gradient(circle at 10% 15%, #e7f1ff 0 1px, transparent 2px), radial-gradient(circle at 80% 80%, #e7f1ff 0 1px, transparent 2px); background-size: 12px 12px; text-align: center; font-family: Georgia, "Times New Roman", serif; }
#lei-single .mini-brand { display: flex; align-items: center; color: var(--primary); font-family: Inter, sans-serif; font-size: 1.45rem; font-weight: 800; }
#lei-single .brand-mark { position: relative; display: grid; grid-template-columns: repeat(2, 16px); grid-template-rows: repeat(2, 16px); gap: 2px; width: 34px; transform: rotate(30deg); }
#lei-single .brand-mark i { display: block; background: linear-gradient(135deg, #3b8cff, #0058e9); border: 1px solid rgba(255,255,255,.85); border-radius: 3px; }
#lei-single .brand-mark.mini { grid-template-columns: repeat(2, 10px); grid-template-rows: repeat(2, 10px); width: 22px; margin-right: 8px; }
#lei-single .cert-border h3 { margin: 18px 0 14px; font-family: Georgia, serif; font-size: 1.35rem; text-transform: uppercase; }
#lei-single .cert-border p { margin-bottom: 8px; color: #536995; font-size: .83rem; }
#lei-single .cert-border > strong { font-size: 1.25rem; }
#lei-single .cert-border > b { margin: 20px 0 35px; font-family: ui-monospace, monospace; font-size: 1.45rem; letter-spacing: .04em; color: var(--navy); }
#lei-single .cert-bottom { width: 100%; display: grid; grid-template-columns: 1fr 1fr 82px; align-items: end; gap: 16px; text-align: left; font-family: Inter, sans-serif; }
#lei-single .cert-bottom span:not(.qr) { color: var(--muted); font-size: .72rem; }
#lei-single .cert-bottom span strong { display: block; margin-top: 5px; color: var(--success); font-size: .95rem; }
#lei-single .cert-bottom span:nth-child(2) strong { color: var(--navy); }
#lei-single .qr { width: 76px; height: 76px; border: 7px solid #111; background: repeating-conic-gradient(#111 0 25%, #fff 0 50%) 0 0 / 14px 14px; box-shadow: inset 0 0 0 5px #fff; }
#lei-single .certificate-copy h2 { font-size: 1.55rem; }
#lei-single .certificate-copy > p { color: var(--muted); }
#lei-single .check-list { display: grid; gap: 13px; margin: 24px 0; padding: 0; list-style: none; }
#lei-single .check-list li { display: flex; align-items: center; gap: 10px; }
#lei-single .check-list svg { width: 19px; height: 19px; padding: 2px; color: var(--primary); border: 2px solid currentColor; border-radius: 50%; }
#lei-single .certificate-actions { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; }
#lei-single .certificate-actions .button { min-width: 230px; }

#lei-single .bulk-section { padding-bottom: 20px; }
#lei-single .bulk-cta { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 20px 35px; background: linear-gradient(90deg, #f7fbff, #fff); }
#lei-single .bulk-copy { display: flex; align-items: center; gap: 20px; }
#lei-single .bulk-copy > span:last-child { display: flex; flex-direction: column; }
#lei-single .bulk-copy small { margin-top: 3px; color: var(--muted); }
#lei-single .bulk-icon { width: 48px; height: 48px; display: grid; place-items: center; color: var(--primary); }
#lei-single .bulk-icon svg { width: 42px; height: 42px; }
#lei-single .bulk-actions { display: flex; gap: 18px; }

@media (max-width: 1050px) {
  #lei-single .entity-hero { grid-template-columns: 1fr 240px; }
  #lei-single .hero-meta { grid-template-columns: 1fr 1fr; }
  #lei-single .data-grid { grid-template-columns: 1fr; }
  #lei-single .certificate-grid { gap: 28px; }
}

@media (max-width: 760px) {
  #lei-single { font-size: 14px; }
  #lei-single .lei-container { width: min(calc(100% - 24px), var(--lei-container)); }
  #lei-single .entity-hero { grid-template-columns: 1fr; padding: 22px 18px; }
  #lei-single .title-row { align-items: flex-start; }
  #lei-single .title-row h1 { flex-basis: 100%; }
  #lei-single .lei-code { width: 100%; min-width: 0; margin-bottom: 26px; }
  #lei-single .lei-code strong { font-size: clamp(.95rem, 4vw, 1.3rem); overflow-wrap: anywhere; }
  #lei-single .hero-meta { grid-template-columns: 1fr 1fr; }
  #lei-single .hero-actions { display: grid; grid-template-columns: 1fr 1fr; padding-top: 0; }
  #lei-single .hero-actions .button:first-child { grid-column: 1 / -1; }
  #lei-single .overview-grid { grid-template-columns: 1fr; }
  #lei-single .overview-card { min-height: auto; padding: 22px; }
  #lei-single .timeline { padding-inline: 10px; }
  #lei-single .timeline::before { left: 17%; right: 17%; }
  #lei-single .timeline small, #lei-single .timeline strong { font-size: .75rem; }
  #lei-single .data-card { padding: 22px 18px; }
  #lei-single .data-list > div { grid-template-columns: 1fr; gap: 3px; }
  #lei-single .data-list dt { font-size: .76rem; }
  #lei-single .registration-list .renew-row { grid-template-columns: 1fr; }
  #lei-single .renew-row aside { grid-row: auto; margin-top: 8px; }
  #lei-single .address-card { flex-direction: column; padding: 22px 18px; }
  #lei-single .map-visual, #lei-single .same-address { width: 100%!important; min-width: 0; }
  #lei-single .related-grid, #lei-single .certificate-grid { grid-template-columns: 1fr; }
  #lei-single .related-grid p, #lei-single .related-grid small, #lei-single .related-list { margin-left: 0; }
  #lei-single .related-toggle { margin-left: 0; }
  #lei-single .certificate-wrap { padding: 22px 16px; }
  #lei-single .cert-border { min-height: 350px; padding: 20px 12px; }
  #lei-single .cert-border > b { font-size: .9rem; }
  #lei-single .cert-bottom { grid-template-columns: 1fr 1fr; }
  #lei-single .qr { display: none; }
  #lei-single .bulk-cta { flex-direction: column; align-items: stretch; padding: 20px; }
  #lei-single .bulk-actions { display: grid; grid-template-columns: 1fr 1fr; }
}

@media (max-width: 470px) {
  #lei-single h1 { font-size: 1.85rem; }
  #lei-single .hero-meta, #lei-single .hero-actions { grid-template-columns: 1fr; }
  #lei-single .hero-actions .button:first-child { grid-column: auto; }
  #lei-single .timeline { grid-template-columns: 1fr; gap: 20px; }
  #lei-single .timeline::before { top: 30px; bottom: 30px; left: 23px; right: auto; width: 2px; height: auto; }
  #lei-single .timeline > div { min-height: 55px; align-items: flex-start; padding-left: 45px; text-align: left; }
  #lei-single .timeline-dot { position: absolute; left: 0; top: 0; }
  #lei-single .certificate-actions .button, #lei-single .certificate-actions { width: 100%; }
  #lei-single .bulk-actions { grid-template-columns: 1fr; }
}
