/*
Theme Name: Emoji.RRaj
Theme URI: https://rraj.in/
Author: Ranjan Raj
Author URI: https://rraj.in/
Description: A responsive emoji copy-and-paste keyboard with search, categories, favorites, recent emojis, skin tones, emoji combos and dark/light modes.
Version: 1.0.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: emoji-rraj
*/
:root{--bg:#fff;--panel:#fff;--text:#171717;--muted:#666;--line:#e8e8e8;--tile:#fff;--tile-hover:#f4f7f5;--accent:#5A4FCF;--black:#5A4FCF;--shadow:0 8px 30px rgba(0,0,0,.06)}
html[data-theme="dark"]{--bg:#101211;--panel:#181b19;--text:#f3f5f4;--muted:#a6ada8;--line:#303632;--tile:#1d211e;--tile-hover:#29322c;--shadow:0 8px 30px rgba(0,0,0,.22)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.5}a{color:inherit}.ebrr-wrap{max-width:1180px;margin:0 auto;padding:0 18px}.ebrr-top{background:#5A4FCF;color:#fff;position:sticky;top:0;z-index:30;box-shadow:0 3px 14px #0001}.ebrr-brandbar{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;min-height:76px;padding:10px 0}.ebrr-brand{position:absolute;left:50%;transform:translateX(-50%);display:block;text-align:center;white-space:nowrap;font-weight:800;font-size:clamp(24px,3.4vw,34px);letter-spacing:-.7px;text-decoration:none;color:#fff}.ebrr-brand span{color:#fff}.ebrr-actions{position:absolute;right:0;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:8px}.ebrr-iconbtn,.ebrr-smallbtn{border:1px solid #ffffff70;background:#4b41b7;color:#fff;border-radius:10px;padding:9px 12px;cursor:pointer;font-size:14px}.ebrr-iconbtn:hover,.ebrr-smallbtn:hover{background:#4036a6}.ebrr-categorybar{display:flex;gap:5px;overflow-x:auto;padding:0 0 12px;scrollbar-width:thin}.ebrr-catbtn{flex:0 0 auto;min-width:52px;border:0;background:transparent;color:#f1efff;border-radius:10px;padding:8px 10px;cursor:pointer;font-size:21px;line-height:1.2}.ebrr-catbtn small{display:block;font-size:10px;margin-top:4px;white-space:nowrap}.ebrr-catbtn:hover,.ebrr-catbtn.active{background:#4036a6;color:#fff}.ebrr-main{padding-top:24px;padding-bottom:36px}.ebrr-hero{text-align:center;margin:0 auto 22px;max-width:820px}.ebrr-hero h1{font-size:clamp(27px,4vw,42px);line-height:1.15;margin:0 0 9px;letter-spacing:-1px}.ebrr-hero p{color:var(--muted);margin:0 0 20px}.ebrr-searchrow{display:flex;gap:8px;max-width:740px;margin:0 auto 15px}.ebrr-search{width:100%;border:1px solid var(--line);background:var(--panel);color:var(--text);border-radius:14px;padding:15px 17px;font-size:16px;outline:none;box-shadow:var(--shadow)}.ebrr-search:focus{border-color:var(--accent);box-shadow:0 0 0 3px #239b5620}.ebrr-searchclear{border:1px solid var(--line);border-radius:12px;padding:0 16px;background:var(--panel);color:var(--text);cursor:pointer}.ebrr-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:16px 0}.ebrr-sectiontitle{font-size:20px;font-weight:750;margin:0}.ebrr-toolbarright{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.ebrr-select{border:1px solid var(--line);border-radius:9px;padding:8px 10px;background:var(--panel);color:var(--text)}.ebrr-filterbtn{border:1px solid var(--line);border-radius:9px;padding:8px 11px;background:var(--panel);color:var(--text);cursor:pointer}.ebrr-filterbtn.active{background:var(--accent);color:#fff;border-color:var(--accent)}.ebrr-grid{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:7px}.ebrr-emoji{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:0;aspect-ratio:1/1;border:1px solid var(--line);border-radius:10px;background:var(--tile);cursor:pointer;transition:transform .12s,background .12s,border-color .12s;padding:3px;color:var(--text)}.ebrr-emoji:hover{transform:translateY(-2px);background:var(--tile-hover);border-color:#9ad6af}.ebrr-glyph{font-size:clamp(22px,3vw,31px);line-height:1.25}.ebrr-ename{font-size:9px;color:var(--muted);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.ebrr-emoji.is-fav:after{content:"♥";color:#e2556e;font-size:9px;position:absolute;margin:0 0 54px 52px}.ebrr-empty{grid-column:1/-1;padding:36px 15px;text-align:center;border:1px dashed var(--line);border-radius:14px;color:var(--muted)}.ebrr-status{min-height:22px;color:var(--accent);font-size:13px;text-align:center;margin-top:8px}.ebrr-copybar{position:sticky;bottom:0;z-index:20;background:var(--panel);border:1px solid var(--line);box-shadow:0 -6px 24px #0000000c;border-radius:14px;margin:26px 0 10px;padding:10px 12px;display:flex;gap:10px;align-items:center}.ebrr-copyitems{flex:1;min-width:0;display:flex;gap:3px;overflow:auto;font-size:25px;white-space:nowrap}.ebrr-copyitems:empty:after{content:"Tap emojis to build a combo…";font-size:13px;color:var(--muted);padding:5px}.ebrr-primary{border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:700;padding:10px 14px;cursor:pointer}.ebrr-secondary{border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);padding:9px 12px;cursor:pointer}.ebrr-panel{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:15px;margin:20px 0}.ebrr-panelhead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px}.ebrr-panelhead h2{font-size:17px;margin:0}.ebrr-skinrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.ebrr-skin{font-size:21px;border:1px solid var(--line);border-radius:9px;background:var(--tile);padding:6px 9px;cursor:pointer}.ebrr-skin.active{border-color:var(--accent);box-shadow:0 0 0 2px #239b5620}.ebrr-combos{display:flex;flex-wrap:wrap;gap:8px}.ebrr-combo{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:11px;background:var(--tile);padding:8px 10px;cursor:pointer;color:var(--text)}.ebrr-combo span{font-size:22px}.ebrr-about{color:var(--muted);font-size:14px;border-top:1px solid var(--line);padding:24px 0;margin-top:26px}.ebrr-footer{background:#5A4FCF;border-top:0;padding:22px 0 30px;text-align:center;color:#fff;font-size:14px}.ebrr-footer p{margin:6px 0}.ebrr-footer a{color:#fff;text-decoration:underline;text-underline-offset:3px;font-weight:700}.ebrr-hidden{display:none!important}.ebrr-loadmore{display:flex;justify-content:center;margin:18px 0}.ebrr-count{font-size:12px;color:var(--muted)}.ebrr-fallback{padding:30px;text-align:center}@media(max-width:900px){.ebrr-grid{grid-template-columns:repeat(8,minmax(0,1fr))}}@media(max-width:620px){.ebrr-wrap{padding:0 11px}.ebrr-brandbar{min-height:66px;padding-right:0}.ebrr-brand{font-size:22px;max-width:calc(100% - 112px);padding:0.ebrr-actions{right:0}.ebrr-iconbtn{font-size:13px}.ebrr-iconbtn{padding:8px 9px}.ebrr-categorybar{margin:0 -2px}.ebrr-catbtn{min-width:48px;padding:8px 7px}.ebrr-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.ebrr-emoji{border-radius:8px}.ebrr-glyph{font-size:27px}.ebrr-ename{font-size:8px}.ebrr-main{padding-top:19px}.ebrr-hero h1{font-size:29px}.ebrr-toolbar{align-items:flex-start}.ebrr-copybar{bottom:6px;margin-left:-3px;margin-right:-3px}.ebrr-copyitems{font-size:22px}.ebrr-primary{padding:10px}.ebrr-about{padding-top:18px}}@media(max-width:380px){.ebrr-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.ebrr-brand{font-size:18px;max-width:calc(100% - 100px)}.ebrr-iconbtn{padding:7px 8px}}

.ebrr-emoji{position:relative}.ebrr-favmark{position:absolute;top:2px;right:5px;z-index:2;font-size:12px;line-height:1;color:#e2556e;cursor:pointer;opacity:.85}.ebrr-favmark:hover{transform:scale(1.15)}.ebrr-emoji.is-fav .ebrr-favmark{color:#e2556e}
.ebrr-visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.ebrr-caption{color:var(--muted);text-align:center;font-size:14px;margin:0 auto 18px;max-width:760px}.ebrr-brandbar .ebrr-brand{margin-inline:auto}@media(max-width:620px){.ebrr-caption{font-size:13px;padding:0 8px}.ebrr-categorybar{padding-bottom:10px}}
