/* === EasyLink Variables (scoped) === */ #easylink-search{ --b1:#2563eb;--b2:#9333ea;--b3:#fb7185; --ok:#1f9254;--warn:#b66a00;--danger:#b42318; --border:#d9d9d9;--radius:12px;--shadow:0 6px 18px rgba(0,0,0,.08); --bg:transparent;--text:#2f2f2f;--muted:#6b7280; } #easylink-search :where(.el-inline){display:flex;flex-wrap:wrap;align-items:center;gap:.45rem;margin-bottom:.5rem} #easylink-search :where(.el-badge){display:inline-flex;align-items:center;padding:3px 10px;border:1px solid var(--border);border-radius:999px;font-weight:600;font-size:13px;background:var(--bg);color:var(--text);box-shadow:var(--shadow)} #easylink-search :where(.el-badge.-ok){color:var(--ok)} #easylink-search :where(.el-badge.-warn){color:var(--warn)} #easylink-search :where(.el-badge.-danger){color:var(--danger)} #easylink-search :where(.el-badge.el-branch.-b1){color:var(--b1)} #easylink-search :where(.el-badge.el-branch.-b2){color:var(--b2)} #easylink-search :where(.el-badge.el-branch.-b3){color:var(--b3)} #easylink-search :where(.el-bubble){padding:12px 14px;background:white;border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 12px 28px rgba(0,0,0,.10);margin:.45rem 0} #easylink-search :where(.el-compact-upgrade){display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;padding:12px 14px;border:1px dashed var(--border);border-radius:var(--radius);background:linear-gradient(180deg,#fff 0%,#fffdf8 100%)} #easylink-search :where(.el-compact-upgrade strong){margin:0 .25ch} #easylink-search :where(.el-actions){margin-top:.35rem} #easylink-search :where(.chip-grid){display:flex;flex-wrap:wrap;gap:8px;margin-top:10px} #easylink-search :where(.el-chip){display:inline-block;padding:2px 8px;border:1px solid var(--border);border-radius:12px;font-weight:600;font-size:14px;color:var(--text);background:var(--bg);box-shadow:var(--shadow);line-height:1.35;cursor:pointer} #easylink-search :where(.coll-count){display:inline-flex;align-items:center;justify-content:center;min-width:28px;height:24px;padding:0 8px;border-radius:999px;border:1px solid #b8b8b8;font-size:12px;font-weight:700;color:#333;background:#fff;margin-left:.5rem} #easylink-search :where(.el-others-title){color:#111827!important} #easylink-search :where(details.el-coll){border:1px solid var(--border);border-radius:12px;background:white;padding:12px 14px;box-shadow:var(--shadow)} #easylink-search :where(details.el-coll>summary){list-style:none;cursor:pointer;display:flex;align-items:center;gap:10px;font-weight:700} #easylink-search :where(details.el-coll>summary::-webkit-details-marker){display:none} #easylink-search :where(.el-actions){display:flex;flex-wrap:wrap;gap:10px;align-items:center;padding:6px 0} #easylink-search :where(.el-btn){display:inline-block;padding:10px 16px;border-radius:22px;font-weight:600;text-decoration:none;color:#fff!important;box-shadow:0 1px 2px rgba(0,0,0,.06)} #easylink-search :where(.el-btn.-primary){background:#0d6efd} #easylink-search :where(.el-btn.-primary:hover){background:#0b5ed7} #easylink-search :where(.el-btn.-wa){background:#e9f7ef;color:#1c7c3d!important;border:1px solid #bfe7cf} #easylink-search :where(.el-btn.-wa:hover){background:#dff3e9} @media (prefers-color-scheme:dark){ #easylink-search :where(.el-btn){box-shadow:none} #easylink-search :where(.el-btn.-wa){background:#143d2a;color:#c0f0d6!important;border-color:#245b3c} #easylink-search :where(.el-btn.-wa:hover){background:#184630} } #easylink-search :where(.ico){display:inline-block;width:.9em;height:.9em;border-radius:50%;margin-right:.5ch;vertical-align:-0.12em;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)} #easylink-search :where(.ico.-ok){background:var(--ok)} #easylink-search :where(.ico.-warn){background:#e2b100} #easylink-search :where(.ico.-danger){background:#e11d48} /* Input */ #easylink-search :where(.el-input-wrap){position:relative;max-width:420px} #easylink-search :where(.el-input){width:100%;padding:12px 40px 12px 14px;border-radius:14px;border:1px solid var(--border);box-shadow:0 2px 14px rgba(0,0,0,.05);outline:none;font-size:15px} #easylink-search :where(.el-clear){position:absolute;right:10px;top:50%;transform:translateY(-50%);border:none;background:transparent;font-size:20px;color:#888;cursor:pointer;padding:4px} #easylink-search :where(#resultVersion){scroll-margin-top:12px} /* Suggestions dropdown */ #easylink-search :where(#el-suggestions){ position:fixed;left:8px;top:0;background:#fff;border:1px solid rgba(0,0,0,.08); box-shadow:0 10px 30px rgba(0,0,0,.12);border-radius:12px;z-index:2147483646;overflow:auto;max-height:320px; } #easylink-search :where(#el-suggestions .item){padding:8px 12px;cursor:pointer;font-size:14px;line-height:1.3;background:transparent} #easylink-search :where(#el-suggestions .item+.item){border-top:1px solid rgba(0,0,0,.06)} #easylink-search :where(#el-suggestions .item:hover), #easylink-search :where(#el-suggestions .item.active){background:#f2f7ff} /* Popover */ #easylink-search :where(#el-pop-global){position:fixed;top:0;left:0;z-index:2147483647;display:none} #easylink-search :where(#el-pop-global.open){display:block} #easylink-search :where(#el-pop-global .el-pop){background:var(--bg);border:1px solid var(--border);border-radius:12px;box-shadow:0 12px 30px rgba(0,0,0,.14);padding:6px;min-width:200px; background: rgba(255,255,255,.18); -webkit-backdrop-filter: blur(14px) saturate(140%) contrast(105%); backdrop-filter: blur(14px) saturate(140%) contrast(105%); border: 1px solid rgba(255,255,255,.35); box-shadow: 0 8px 24px rgba(0,0,0,.18); border-radius:14px; overflow:hidden; } #easylink-search :where(#el-pop-global .pop-item){display:flex;align-items:center;width:100%;background:transparent;border:none;cursor:pointer;font:inherit;color:#333;text-align:left;padding:9px 10px;border-radius:10px} #easylink-search :where(#el-pop-global .pop-item:hover){background:#f7f9ff} #easylink-search :where(#el-pop-global .pop-ico){width:20px;text-align:center;margin-right:8px;opacity:.8} /* Toast */ #easylink-search :where(.el-toast){position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:rgba(0,0,0,.8);color:#fff;padding:10px 14px;border-radius:10px;font-size:13px;box-shadow:0 6px 16px rgba(0,0,0,.10);opacity:0;pointer-events:none;transition:opacity .2s ease,transform .2s ease;z-index:2147483646} #easylink-search :where(.el-toast.show){opacity:1;transform:translateX(-50%) translateY(-4px)} #easylink-search :where(.el-nowrap){white-space:nowrap} #easylink-search :where(.el-inline){margin-bottom:.35rem} #easylink-search :where(.chip-grid){margin-top:6px} #easylink-search :where(#loader){display:none!important} #easylink-search :where(.el-others-title .label){font-weight:600} /* moins gras que (700) */ #easylink-search :where(.el-others-title .el-icon){width:16px;height:16px;margin-right:6px;vertical-align:-2px;opacity:.9} /* 1.1.3: Force visible input text + caret, robust to theme overrides */ #easylink-search{color:var(--text)} #easylink-search :where(.el-input){ background:#fff!important; color:#111!important; caret-color:#111!important; -webkit-text-fill-color:#111!important; /* iOS/Safari */ } #easylink-search :where(#resultVersion){scroll-margin-top: var(--rm-elc-anchor-offset, 120px);} #easylink-search :where(#resultVersionAnchor){scroll-margin-top: var(--rm-elc-anchor-offset, 120px);} /* === RenoMods ELC 2.0.76 — WCAG semantic colors + FECC0B accent === */ #easylink-search{ --accent:#FECC0B; --ok-bg:#ECFDF5; --ok-bd:#BBF7D0; --ok-ink:#065F46; --warn-bg:#FFFBEB;--warn-bd:#FDE68A;--warn-ink:#92400E; --bad-bg:#FEF2F2; --bad-bd:#FECACA; --bad-ink:#991B1B; } /* Badges: add backgrounds + borders + spacing for icon/text */ #easylink-search :where(.el-badge){ display:inline-flex; align-items:center; gap:.42em; border:1px solid var(--border); border-radius:999px; padding:.35rem .65rem; background:var(--bg); color:var(--text); } #easylink-search :where(.el-badge svg){ width:1.05em; height:1.05em; flex:0 0 auto; vertical-align:middle; } /* Tones */ #easylink-search :where(.el-badge.-ok){ background:var(--ok-bg); border-color:var(--ok-bd); color:var(--ok-ink); } #easylink-search :where(.el-badge.-warn){ background:var(--warn-bg); border-color:var(--warn-bd); color:var(--warn-ink); } #easylink-search :where(.el-badge.-danger){background:var(--bad-bg); border-color:var(--bad-bd); color:var(--bad-ink); } /* Primary action accent */ #easylink-search :where(.el-btn.-primary){ background:var(--accent); border-color:var(--accent); color:#1a1a1a; font-weight:700; box-shadow:0 0 0 0 transparent; } #easylink-search :where(.el-btn.-primary:hover){ box-shadow:0 0 0 3px rgba(254,204,11,.22); } /* === 2.0.76.1 SVG icon sizing fix === */ #easylink-search :where(.el-bubble svg, .el-btn svg, .el-chip svg, .el-compact-upgrade svg){ width:1.05em; height:1.05em; flex:0 0 auto; display:inline-block; vertical-align:middle; } /* === 2.0.76.2 — spacing & branch chip color fix === */ /* 1) Add breathing room before text in info bubbles */ #easylink-search :where(.el-bubble svg){ margin-right:.5em; } /* 2) Restore branch chip colors (our generic .el-badge color overrode them) */ #easylink-search :where(.el-badge.el-branch.-b1){ color:var(--b1) !important; } #easylink-search :where(.el-badge.el-branch.-b2){ color:var(--b2) !important; } #easylink-search :where(.el-badge.el-branch.-b3){ color:var(--b3) !important; } /* === 2.0.76.3 — Contact/WhatsApp buttons SVG === */ #easylink-search :where(.el-actions .el-btn svg){ width:1.1em; height:1.1em; vertical-align:middle; margin-right:.5em; flex:0 0 auto; display:inline-block; } /* === 2.0.76.5 — Popover icons (link/info) size & spacing === */ #easylink-search :where(.el-pop .pop-item .pop-ico svg){ width:1.05em; height:1.05em; vertical-align:middle; margin-right:.5em; display:inline-block; flex:0 0 auto; } /* === 2.0.76.7 — el-compact-upgrade restyle === */ #easylink-search :where(.el-compact-upgrade){ display:flex; align-items:flex-start; gap:.6rem; padding:.75rem 1rem; border:1px solid var(--border); border-radius: var(--radius); background: linear-gradient(180deg, rgba(255,255,255,.85), rgba(255,255,255,.75)); backdrop-filter: blur(8px); box-shadow: 0 6px 16px rgba(0,0,0,.06); color: var(--ink); } #easylink-search :where(.el-compact-upgrade svg){ width:1.05em; height:1.05em; flex:0 0 auto; margin-top:.15em; } #easylink-search :where(.el-compact-upgrade .title){ font-weight: 700; margin:0; padding:0; } #easylink-search :where(.el-compact-upgrade .text){ margin:0; padding:0; color: var(--muted); } #easylink-search :where(.el-compact-upgrade .cta){ margin-left:auto; display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; } #easylink-search :where(.el-compact-upgrade .cta .el-btn){ padding:.5rem .75rem; } @media (max-width: 560px){ #easylink-search :where(.el-compact-upgrade){ flex-direction: column; align-items: stretch; gap:.55rem; } #easylink-search :where(.el-compact-upgrade .cta){ margin-left:0; } } /* === 2.0.76.8 — Spacing tune (UI breathing) === */ #easylink-search{ --s-1:.5rem; /* 8px */ --s-2:.75rem; /* 12px */ --s-3:1rem; /* 16px */ --s-4:1.25rem;/* 20px */ --s-5:1.5rem; /* 24px */ } #easylink-search .el-headline{ margin:0 0 var(--s-3); } #easylink-search .el-subhead{ margin:0 0 var(--s-4); line-height:1.6; } #easylink-search .el-field{ margin:0 0 var(--s-3); } #easylink-search .el-chips{ display:flex; flex-wrap:wrap; gap:.5rem .6rem; margin:var(--s-1) 0 var(--s-3); } #easylink-search .el-badge{ padding:.45rem .75rem; } #easylink-search .el-compact-upgrade{ margin:0 0 var(--s-4); padding:.9rem 1rem; } #easylink-search .el-actions{ margin:var(--s-4) 0 var(--s-5); gap:.75rem; } #easylink-search .el-actions .el-btn{ padding:.7rem 1rem; } #easylink-search .el-accordion{ margin-top:var(--s-3); } #easylink-search .el-stack > * + *{ margin-top:var(--s-3); } @media (min-width: 992px){ #easylink-search .el-subhead{ margin-bottom:var(--s-5); } #easylink-search .el-chips{ margin-bottom:var(--s-4); } #easylink-search .el-compact-upgrade{ margin-bottom:var(--s-5); } #easylink-search .el-actions{ margin:var(--s-5) 0 calc(var(--s-5) + .25rem); } } /* === 2.0.76.9 — Mobile polish (≤ 480px) === */ @media (max-width: 480px){ /* Container breathing & max width */ #easylink-search{ padding-left:.5rem; padding-right:.5rem; } /* Headline and subhead tighter */ #easylink-search .el-headline{ margin-bottom:.75rem; } #easylink-search .el-subhead{ margin-bottom:1rem; font-size:1rem; line-height:1.5; } /* Field */ #easylink-search .el-field{ margin-bottom:.85rem; } /* Chips row: wrap & smaller paddings */ #easylink-search .el-chips{ gap:.4rem .45rem; margin:.35rem 0 .85rem; } #easylink-search .el-badge{ padding:.35rem .6rem; font-size:.95em; } #easylink-search .el-badge svg{ width:1em; height:1em; } /* Compact upgrade bubble: reduce spacing & font size slightly */ #easylink-search .el-compact-upgrade{ padding:.75rem .85rem; margin-bottom:1rem; } #easylink-search .el-compact-upgrade .text{ line-height:1.5; } /* Actions: stack full-width with smaller height */ #easylink-search .el-actions{ margin:1rem 0 1.1rem; gap:.6rem; } #easylink-search .el-actions .el-btn{ display:flex; width:100%; justify-content:center; align-items:center; padding:.6rem .85rem; font-size:1rem; border-radius:16px; } #easylink-search .el-actions .el-btn svg{ width:1em; height:1em; margin-right:.45em; } /* Accordion spacing */ #easylink-search .el-accordion{ margin-top: .85rem; } } /* Slightly larger phones 481–640px */ @media (min-width: 481px) and (max-width: 640px){ #easylink-search .el-actions .el-btn{ padding:.65rem .9rem; } #easylink-search .el-compact-upgrade{ margin-bottom:1.25rem; } } /* === 2.0.76.10 — Tighten spacing around action buttons === */ #easylink-search .el-compact-upgrade{ margin-bottom: 1rem; } #easylink-search .el-actions{ margin: 1rem 0 1.1rem; } @media (min-width: 992px){ #easylink-search .el-actions{ margin: 1rem 0 1.25rem; } #easylink-search .el-compact-upgrade{ margin-bottom: 1rem; } } /* === 2.0.76.11 — Extra-tight spacing around action buttons === */ #easylink-search .el-compact-upgrade{ margin-bottom: .85rem; } #easylink-search .el-actions{ margin: .85rem 0 .95rem; } @media (min-width: 992px){ #easylink-search .el-actions{ margin: .9rem 0 1rem; } #easylink-search .el-compact-upgrade{ margin-bottom: .9rem; } } /* === 2.0.77 — Known versions (grouped list + filters) === */ #easylink-search .kv-toolbar{display:flex;flex-wrap:wrap;gap:.6rem;align-items:center;margin:.6rem 0 .8rem} #easylink-search .kv-filter{flex:1 1 220px;position:relative} #easylink-search .kv-filter input{width:100%;border:1px solid var(--border);border-radius:999px;padding:.5rem .9rem .5rem 2rem;outline:0;background:#fff;box-shadow:0 2px 8px rgba(0,0,0,.03)} #easylink-search .kv-filter .ico{position:absolute;left:.7rem;top:50%;transform:translateY(-50%);opacity:.6} #easylink-search .kv-pills{display:flex;gap:.4rem;align-items:center} #easylink-search .kv-pill{border:1px solid var(--border);border-radius:999px;padding:.35rem .6rem;background:#fff;cursor:pointer;user-select:none} #easylink-search .kv-pill[aria-pressed="true"]{border-color:#FECC0B;box-shadow:0 0 0 3px rgba(254,204,11,.18)} #easylink-search .kv-list{display:block;border-radius:12px;background:rgba(255,255,255,.6)} #easylink-search .kv-year{position:sticky;top:0;background:linear-gradient(180deg,rgba(255,255,255,.95),rgba(255,255,255,.88));backdrop-filter:blur(6px);padding:.5rem .75rem;border-bottom:1px solid var(--border);font-weight:700} #easylink-search .kv-month{padding:.6rem .75rem .3rem;font-weight:600;color:var(--muted)} #easylink-search .kv-grid{display:flex;flex-wrap:wrap;gap:.45rem .55rem;padding:.2rem .75rem .9rem} #easylink-search .kv-chip{display:inline-flex;align-items:center;gap:.45rem;border:1px solid var(--border);border-radius:999px;padding:.42rem .7rem;background:#fff;cursor:pointer;transition:box-shadow .15s,border-color .15s} #easylink-search .kv-chip:hover{border-color:#FECC0B;box-shadow:0 0 0 3px rgba(254,204,11,.14)} #easylink-search .kv-chip:focus{outline:2px solid #FECC0B;outline-offset:2px} #easylink-search .kv-dot{width:.5rem;height:.5rem;border-radius:50%} #easylink-search .kv-dot.-ok{background:var(--ok-ink)} #easylink-search .kv-dot.-warn{background:var(--warn-ink)} #easylink-search .kv-dot.-danger{background:var(--bad-ink)} #easylink-search .kv-badge-new{font-size:.75em; padding:.12rem .3rem;border:1px solid var(--border);border-radius:6px;background:#eef5ff;color:#3b82f6} #easylink-search details.el-coll > summary{scroll-margin-top:1rem} @media (max-width: 560px){ #easylink-search .kv-filter input{padding:.45rem .8rem .45rem 2rem} #easylink-search .kv-grid{gap:.4rem .5rem} #easylink-search .kv-chip{padding:.38rem .65rem} } /* === 2.0.77.1 — Known versions compact (year-only) + hover fixes === */ #easylink-search .kv-toolbar{ margin:.4rem 0 .6rem; } #easylink-search .kv-year{ padding:.45rem .75rem; border-bottom:1px solid var(--border); background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.9)); } #easylink-search .kv-grid{ gap:.4rem .5rem; padding:.5rem .75rem 1rem; } #easylink-search .kv-chip{ padding:.38rem .62rem; } #easylink-search .kv-pill{ background:#fff; color:inherit; } #easylink-search .kv-pill:hover{ background:#fff; color:inherit; border-color:#FECC0B; box-shadow:0 0 0 3px rgba(254,204,11,.12); } #easylink-search .kv-pill[aria-pressed="true"]{ background:#fff; color:inherit; } #easylink-search .kv-chip:hover{ color:inherit; } /* === 2.0.77.7.1 — Mobile fix: keep icon + text on one row in el-compact-upgrade === */ @media (max-width: 560px){ #easylink-search .el-compact-upgrade{ flex-direction: row !important; align-items: flex-start; gap: .6rem; font-size: 1rem; line-height: 1.5; } #easylink-search .el-compact-upgrade svg{ width: 1.05em; height: 1.05em; margin-right: .55em; margin-top: .15em; display: inline-block; vertical-align: middle; flex: 0 0 auto; } #easylink-search .el-compact-upgrade .text{ margin: 0; } } /* === 2.0.78 — Quick Compare Card === */ #easylink-search .qc-card{ border:1px solid var(--border); border-radius: 14px; background: #fff; box-shadow: 0 6px 16px rgba(0,0,0,.06); padding: .9rem 1rem; margin: .85rem 0 1rem; } #easylink-search .qc-head{ font-weight: 700; margin-bottom:.6rem; } #easylink-search .qc-grid{ display:grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap:.85rem 1.25rem; align-items:start; } #easylink-search .qc-title{ font-weight:600; color: var(--muted); margin-bottom:.25rem; } #easylink-search .qc-row{ display:flex; align-items:center; gap:.5rem; font-size:1.05rem; } #easylink-search .qc-sub{ color: var(--muted); font-size:.95rem; } #easylink-search .qc-dot{ width:.55rem; height:.55rem; border-radius:50%; flex:0 0 auto; } #easylink-search .qc-dot.tone-ok{ background: var(--ok-ink); } #easylink-search .qc-dot.tone-warn{ background: var(--warn-ink); } #easylink-search .qc-dot.tone-bad{ background: var(--bad-ink); } @media (max-width: 640px){ #easylink-search .qc-grid{ grid-template-columns: repeat(2, minmax(0,1fr)); gap:.5rem .75rem; } #easylink-search .qc-row{ font-size:.95rem; } #easylink-search .qc-title{ font-size:.9rem; } #easylink-search .qc-sub{ font-size:.85rem; } } /* === 2.0.78.11 — Remove legacy recommendation bubble in favor of Quick comparison === */ #easylink-search .el-compact-upgrade{ display:none !important; } /* === 2.0.78.12 — Quick Compare tooltip & cleanup === */ #easylink-search .qc-title .qc-tip{ display:inline-flex; align-items:center; margin-left:.45em; opacity:.75; cursor:help; } #easylink-search .qc-title .qc-tip:hover{ opacity:1; } #easylink-search .qc-title .qc-tip svg{ width:1em; height:1em; } /* === 2.0.78.13 — Accessible tooltip for Quick Compare === */ #easylink-search .qc-title .qc-tip{ position:relative; display:inline-flex; align-items:center; margin-left:.45em; opacity:.8; cursor:help; outline:0; } #easylink-search .qc-title .qc-tip:focus{ outline: 2px solid #FECC0B; outline-offset: 2px; } #easylink-search .qc-title .qc-tip:hover{ opacity:1; } #easylink-search .qc-tooltip{ position:absolute; left:0; bottom:125%; background:#111; color:#fff; padding:.4rem .55rem; border-radius:6px; font-size:.85rem; line-height:1.25; max-width: 280px; box-shadow:0 8px 20px rgba(0,0,0,.25); opacity:0; visibility:hidden; transform: translateY(6px); transition: opacity .14s ease, transform .14s ease, visibility .14s; pointer-events:none; z-index:50; } #easylink-search .qc-tooltip::after{ content:""; position:absolute; top:100%; left:10px; border:6px solid transparent; border-top-color:#111; } #easylink-search .qc-tip.is-open .qc-tooltip, #easylink-search .qc-title .qc-tip:hover .qc-tooltip, #easylink-search .qc-title .qc-tip:focus .qc-tooltip{ opacity:1; visibility:visible; transform: translateY(0); pointer-events:auto; } @media (max-width:560px){ #easylink-search .qc-tooltip{ left:auto; right:0; max-width: 86vw; } #easylink-search .qc-tooltip::after{ left:auto; right:10px; } } /* 2.0.78.18 — QC: wrap long version strings */ #easylink-search .qc-row strong{ word-break: break-word; overflow-wrap: anywhere; } /* 2.0.78.19 — Keep tooltip icon with the title on one line */ #easylink-search .qc-title{ display:flex; align-items:center; column-gap:.35rem; flex-wrap:nowrap; min-width:0; white-space:nowrap; } #easylink-search .qc-title .qc-tip{ flex:0 0 auto; } /* 2.0.78.20 — Tooltip text wrapping fix */ #easylink-search .qc-title{ white-space:nowrap; } /* keep title+icon on one line */ #easylink-search .qc-title .qc-tooltip{ white-space: normal !important; /* override parent nowrap */ display: inline-block; max-width: 280px; word-break: break-word; overflow-wrap: anywhere; } @media (max-width:560px){ #easylink-search .qc-title .qc-tooltip{ max-width: 86vw; } } /* 2.0.78.21 — Tooltip width & wrapping fix */ #easylink-search .qc-title .qc-tooltip{ white-space: normal !important; word-break: normal; overflow-wrap: break-word; width: max-content; min-width: 180px; max-width: 320px; } @media (max-width:560px){ #easylink-search .qc-title .qc-tooltip{ min-width: 160px; max-width: 86vw; } } /* 2.0.78.22 — Tooltip alignment & width clamp */ #easylink-search .qc-title .qc-tip{ position:relative; } #easylink-search .qc-title .qc-tooltip{ position:absolute; right:0; /* anchor to icon */ left:auto; /* do not stretch from the left */ bottom: calc(100% + 8px); max-width: clamp(200px, 60vw, 320px); min-width: 200px; width: auto; white-space: normal !important; word-break: normal; overflow-wrap: break-word; line-height: 1.3; letter-spacing: normal; text-align: left; z-index: 9999; } #easylink-search .qc-title .qc-tooltip::after{ left: auto; right: 10px; /* arrow near the icon */ } @media (max-width:560px){ #easylink-search .qc-title .qc-tooltip{ max-width: 86vw; min-width: 180px; right: 0; left: auto; } } /* 2.0.78.24 — Harmonize “Other known versions” bubble look & width */ #easylink-search .el-known-versions, #easylink-search details.el-known-versions, #easylink-search details.known-versions, #easylink-search details[data-known-versions]{ display:block; width:100%; background: var(--elc-bubble-bg, #f6f7f9); border: 1px solid var(--elc-bubble-border, rgba(0,0,0,.06)); border-radius: 12px; padding: .85rem 1rem; box-shadow: var(--elc-bubble-shadow, 0 1px 2px rgba(0,0,0,.03)); margin: .85rem 0; } /* Summary line inside the bubble */ #easylink-search details.el-known-versions > summary, #easylink-search details.known-versions > summary, #easylink-search details[data-known-versions] > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:.75rem; font-weight:600; margin:-.35rem -0.5rem .5rem -0.5rem; /* pull to match bubble padding */ padding:.35rem .5rem .25rem .5rem; border-radius:8px; } #easylink-search details.el-known-versions[open] > summary, #easylink-search details.known-versions[open] > summary, #easylink-search details[data-known-versions][open] > summary{ background: var(--elc-bubble-head, rgba(0,0,0,.035)); } /* Content spacing */ #easylink-search .el-known-versions .kv-grid, #easylink-search details.el-known-versions .kv-grid, #easylink-search details.known-versions .kv-grid, #easylink-search details[data-known-versions] .kv-grid{ margin-top:.35rem; } /* Mobile tightening */ @media (max-width:640px){ #easylink-search details.el-known-versions, #easylink-search details.known-versions, #easylink-search details[data-known-versions]{ padding:.75rem .85rem; border-radius:10px; margin:.65rem 0; } } /* 2.0.78.25 — Known versions bubble parity */ #easylink-search details.el-known-versions, #easylink-search details[data-known-versions], #easylink-search details.known-versions, #easylink-search details[aria-label="Autres versions connues de cette branche"], #easylink-search details[aria-label="Other known versions in this branch"]{ display:block; width:100%; border-radius: 14px; background: linear-gradient(180deg, #ffffff 0%, #fbfbf9 100%); border: 1px solid rgba(0,0,0,.08); box-shadow: 0 1px 2px rgba(0,0,0,.04); padding: .85rem 1rem; margin: .85rem 0; } #easylink-search details.el-known-versions > summary, #easylink-search details[data-known-versions] > summary, #easylink-search details.known-versions > summary, #easylink-search details[aria-label="Autres versions connues de cette branche"] > summary, #easylink-search details[aria-label="Other known versions in this branch"] > summary{ list-style:none; cursor:pointer; font-weight: 700; display:flex; align-items:center; justify-content:space-between; gap:.75rem; margin:-.25rem -0.25rem .5rem -0.25rem; padding:.35rem .25rem .25rem .25rem; border-radius: 10px; } #easylink-search details.el-known-versions[open] > summary, #easylink-search details[data-known-versions][open] > summary, #easylink-search details.known-versions[open] > summary, #easylink-search details[aria-label="Autres versions connues de cette branche"][open] > summary, #easylink-search details[aria-label="Other known versions in this branch"][open] > summary{ background: rgba(0,0,0,.035); } /* 2.0.78.26 — Parity for "Other known versions" bubble: padding, background & shadow */ #easylink-search details.el-known-versions, #easylink-search details[data-known-versions], #easylink-search details.known-versions, #easylink-search details[aria-label="Autres versions connues de cette branche"], #easylink-search details[aria-label="Other known versions in this branch"]{ padding: 12px 14px !important; /* explicit padding parity */ border-radius: 14px; background: var(--elc-info-bg, linear-gradient(180deg, #ffffff 0%, #fbfbf9 100%)) !important; border: 1px solid var(--elc-info-border, rgba(0,0,0,.08)) !important; /* dual subtle shadow like info bubble */ box-shadow: 0 1px 2px rgba(0,0,0,.06), 0 8px 20px rgba(0,0,0,.03) !important; } #easylink-search details.el-known-versions > summary, #easylink-search details[data-known-versions] > summary, #easylink-search details.known-versions > summary, #easylink-search details[aria-label="Autres versions connues de cette branche"] > summary, #easylink-search details[aria-label="Other known versions in this branch"] > summary{ margin: -2px -4px 8px -4px; padding: 6px 6px 4px 6px; border-radius: 10px; } #easylink-search details.el-known-versions[open] > summary, #easylink-search details[data-known-versions][open] > summary, #easylink-search details.known-versions[open] > summary, #easylink-search details[aria-label="Autres versions connues de cette branche"][open] > summary, #easylink-search details[aria-label="Other known versions in this branch"][open] > summary{ background: var(--elc-info-head, rgba(0,0,0,.035)); }