@charset "UTF-8";

/* Émoticônes v2 : fenêtre compacte en verre dépoli (s'ajoute à assets/emojis.css de l'extension). */
.esth-emoji-dialog.esth2{
  --e2-ink:#25242b;--e2-muted:#77707c;--e2-line:rgba(37,36,43,.13);--e2-pink:#e50053;
  --e2-glass:rgba(255,255,255,.66);--e2-glass2:rgba(255,246,250,.46);--e2-top:rgba(255,255,255,.74);
  --e2-field:rgba(255,255,255,.6);--e2-hover:rgba(229,0,83,.1);--e2-edge:rgba(255,255,255,.7);
  position:fixed;inset:auto;z-index:2147483000;display:none;overflow:hidden;box-sizing:border-box;
  width:440px;height:480px;max-width:none;max-height:none;margin:0;padding:0;
  border:1px solid var(--e2-edge);border-radius:20px;color:var(--e2-ink);font-family:inherit;
  background:linear-gradient(155deg,var(--e2-glass) 0%,var(--e2-glass2) 100%);
  -webkit-backdrop-filter:blur(22px) saturate(1.6);backdrop-filter:blur(22px) saturate(1.6);
  box-shadow:0 18px 50px rgba(30,10,25,.28),inset 0 1px 0 rgba(255,255,255,.45)
}
.esth-emoji-dialog.esth2[open]{display:block}
.esth-emoji-dialog.esth2:focus{outline:none}
.esth-emoji-dialog.esth2.is-moving{user-select:none;box-shadow:0 26px 70px rgba(30,10,25,.36),inset 0 1px 0 rgba(255,255,255,.45)}
.esth2 *{box-sizing:border-box}
/* Bandeau du haut posé sur la grille : les émoticônes défilent dessous, floutées. */
.esth2 .esth2-top{position:absolute;left:0;right:0;top:0;z-index:2;padding:0 10px 12px;background:var(--e2-top);
  -webkit-backdrop-filter:blur(14px) saturate(1.4);backdrop-filter:blur(14px) saturate(1.4);
  -webkit-mask-image:linear-gradient(#000 calc(100% - 12px),transparent);mask-image:linear-gradient(#000 calc(100% - 12px),transparent)}
.esth2 .esth2-head{position:relative;display:flex;align-items:center;gap:8px;padding:12px 0 8px}
.esth2 .esth2-grip{display:none}
.esth2 .esth2-head>img.esth-emoji{flex:0 0 auto;width:28px!important;height:28px!important;margin:0!important}
.esth2 .esth2-search{position:relative;flex:1 1 auto;min-width:0;margin:0}
.esth2 .esth2-search svg{position:absolute;left:11px;top:50%;width:16px;height:16px;margin-top:-8px;fill:none;stroke:var(--e2-muted);stroke-width:2;stroke-linecap:round;pointer-events:none}
.esth2 .esth2-search input{display:block;width:100%;height:36px;min-height:0;margin:0;padding:0 12px 0 33px;border:1px solid var(--e2-line);border-radius:11px;
  background:var(--e2-field);color:var(--e2-ink);font:inherit;font-size:14px;box-shadow:none;outline:none}
.esth2 .esth2-search input::placeholder{color:var(--e2-muted);opacity:1}
.esth2 .esth2-search input:focus{border-color:rgba(229,0,83,.55);box-shadow:0 0 0 3px rgba(229,0,83,.14)}
.esth2 .esth2-close{flex:0 0 32px;width:32px;height:32px;display:grid;place-items:center;margin:0;padding:0;border:0;border-radius:50%;background:transparent;color:var(--e2-ink);cursor:pointer}
.esth2 .esth2-close svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}
.esth2 .esth2-close:hover{background:var(--e2-hover);color:var(--e2-pink)}
.esth2 .esth2-tabs{display:flex;gap:5px;overflow-x:auto;scrollbar-width:none;padding:2px 24px 2px 0;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent)}
.esth2 .esth2-tabs::-webkit-scrollbar,.esth2 .esth2-favs::-webkit-scrollbar{display:none}
.esth2 .esth2-tabs button{flex:0 0 auto;height:28px;margin:0;padding:0 11px;border:1px solid var(--e2-line);border-radius:999px;background:transparent;
  color:var(--e2-ink);font:inherit;font-size:12px;line-height:26px;white-space:nowrap;cursor:pointer;box-shadow:none}
.esth2 .esth2-tabs button:hover{border-color:rgba(229,0,83,.45);color:var(--e2-pink)}
.esth2 .esth2-tabs button[aria-pressed="true"]{border-color:var(--e2-pink);background:var(--e2-pink);color:#fff}
.esth2.is-searching .esth2-tabs{display:none}
.esth2 .esth2-favs{display:flex;align-items:center;gap:2px;overflow-x:auto;scrollbar-width:none;padding:8px 0 0}
.esth2 .esth2-favs[hidden]{display:none}
.esth2 .esth2-star{flex:0 0 auto;margin:0 4px 0 2px;color:var(--e2-pink);font-size:15px;line-height:1}
.esth2 .esth2-favs .esth2-cell{flex:0 0 42px;width:42px;height:42px}
.esth2 .esth2-favs .esth2-cell>img.esth-emoji{width:34px!important;height:34px!important}
/* Grille */
.esth2 .esth2-results{position:absolute;inset:0;z-index:1;overflow-y:auto;overscroll-behavior:contain;padding:calc(var(--e2-top-h,150px) - 4px) 8px 16px;
  scrollbar-width:thin;scrollbar-color:rgba(229,0,83,.35) transparent}
.esth2 .esth2-results::-webkit-scrollbar{width:6px}
.esth2 .esth2-results::-webkit-scrollbar-thumb{background:rgba(229,0,83,.35);border-radius:6px}
.esth2 .esth2-results::-webkit-scrollbar-track{background:transparent}
.esth2 .esth2-section{padding:0 0 6px}
.esth2 .esth2-section h3{margin:0;padding:8px 6px 4px;color:var(--e2-muted);background:none;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.06em;text-transform:uppercase}
.esth2 .esth2-found:empty{display:none}
.esth2.is-searching .esth2-section:not(.esth2-found){display:none}
.esth2 .esth2-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:2px}
.esth2 .esth2-cell{position:relative;display:grid;place-items:center;width:100%;height:50px;min-height:0;margin:0;padding:0;border:0;border-radius:12px;
  background:transparent;cursor:pointer;box-shadow:none;transition:background-color .12s ease}
.esth2 .esth2-cell>img.esth-emoji{width:40px!important;height:40px!important;margin:0!important;transition:transform .12s ease}
.esth2 .esth2-cell:hover{background:var(--e2-hover)}
.esth2 .esth2-cell:hover>img.esth-emoji{transform:scale(1.14)}
.esth2 .esth2-cell:active>img.esth-emoji{transform:scale(.92)}
.esth2 .esth2-uni{display:block;font-size:33px;line-height:1;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;transition:transform .12s ease}
.esth2 .esth2-cell:hover>.esth2-uni{transform:scale(1.14)}
.esth2 .esth2-favs .esth2-uni{font-size:28px}
.esth2 .esth2-favs .esth2-cell.is-logo{margin-right:4px}
.esth2 .esth2-favs .esth2-cell.is-logo::before{content:"";position:absolute;right:-3px;top:9px;bottom:9px;width:1px;background:var(--e2-line)}
.esth2 .esth2-cell[data-count]::after{content:attr(data-count);position:absolute;top:1px;right:1px;min-width:16px;height:16px;padding:0 4px;display:grid;place-items:center;
  border-radius:99px;background:var(--e2-pink);color:#fff;font:700 10px/1 sans-serif}
.esth2 button:focus-visible,.esth2 input:focus-visible{outline:2px solid rgba(229,0,83,.6);outline-offset:1px}
.esth2 .esth2-resize{display:none}
/* PC : poignée pour déplacer, coin pour agrandir. */
@media (pointer:fine) and (min-width:768px){
  .esth2 .esth2-head{padding-top:16px;cursor:grab}
  .esth2.is-moving .esth2-head{cursor:grabbing}
  .esth2 .esth2-grip{display:block;position:absolute;left:50%;top:5px;width:38px;height:4px;margin-left:-19px;border-radius:4px;background:var(--e2-line)}
  .esth2 .esth2-head:hover .esth2-grip{background:rgba(229,0,83,.45)}
  .esth2 .esth2-resize{display:block;position:absolute;right:3px;bottom:3px;z-index:3;width:18px;height:18px;cursor:nwse-resize;border-radius:0 0 14px 0;
    background:linear-gradient(135deg,transparent 46%,var(--e2-muted) 46%,var(--e2-muted) 54%,transparent 54%,transparent 66%,var(--e2-muted) 66%,var(--e2-muted) 74%,transparent 74%);opacity:.55}
  .esth2 .esth2-resize:hover{opacity:1}
}
@media (max-width:600px){
  .esth-emoji-dialog.esth2{border-radius:18px}
  .esth2 .esth2-grid{grid-template-columns:repeat(auto-fill,minmax(48px,1fr))}
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .esth-emoji-dialog.esth2{--e2-glass:rgba(255,255,255,.97);--e2-glass2:rgba(255,248,251,.97);--e2-top:rgba(255,255,255,.97)}
}
/* Nuit */
html.wp-dark-mode-active .esth-emoji-dialog.esth2{
  --e2-ink:#f5f2f4;--e2-muted:#aaa3ad;--e2-line:rgba(255,255,255,.13);
  --e2-glass:rgba(36,38,46,.72);--e2-glass2:rgba(19,20,25,.56);--e2-top:rgba(27,29,35,.78);
  --e2-field:rgba(255,255,255,.07);--e2-hover:rgba(255,79,143,.16);--e2-edge:rgba(255,255,255,.1)
}
html.wp-dark-mode-active .esth-emoji-dialog.esth2{box-shadow:0 18px 50px rgba(0,0,0,.55),inset 0 1px 0 rgba(255,255,255,.06)}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  html.wp-dark-mode-active .esth-emoji-dialog.esth2{--e2-glass:rgba(30,32,38,.98);--e2-glass2:rgba(24,25,30,.98);--e2-top:rgba(30,32,38,.98)}
}
/*# sourceURL=esthetiqua-emojis-inline-css */
