/* ======= VARIÁVEIS ESPECÍFICAS DO BUSCADOR DE EMOJIS ======= */
:root{
--emoji-picker-bg:#fff;
--emoji-picker-border:#e9ecef;
--emoji-picker-text:#000;
--emoji-picker-input-bg:#f8f9fa;
--emoji-section-bg:#f8f9fa;
--emoji-item-bg:#fff;
--emoji-feedback-bg:#d4edda;
--emoji-feedback-border:#28a745;
--emoji-feedback-text:#155724;
--emoji-empty-text:#6c757d;
--emoji-loader-bg:rgba(255,255,255,0.95);
--emoji-loader-text:#343a40;
}
[data-theme="dark"]{
--emoji-picker-bg:#2d2d2d;
--emoji-picker-border:#495057;
--emoji-picker-text:#e9ecef;
--emoji-picker-input-bg:#1a1a1a;
--emoji-section-bg:#1a1a1a;
--emoji-item-bg:#3d3d3d;
--emoji-feedback-bg:rgba(40,167,69,0.15);
--emoji-feedback-border:#28a745;
--emoji-feedback-text:#4cd964;
--emoji-empty-text:#adb5bd;
--emoji-loader-bg:rgba(45,45,45,0.95);
--emoji-loader-text:#e9ecef;
}
.busca-emojis-container{background:var(--emoji-picker-bg);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,0.08);padding:2rem;transition:all 0.3s ease;overflow:hidden;position:relative;max-width:1000px;margin:0 auto;}
.busca-emojis-container:hover{transform:translateY(-2px);box-shadow:0 15px 35px rgba(0,0,0,0.1);}
emoji-picker{--border-radius:12px;--background:var(--emoji-picker-bg);--border-color:var(--emoji-picker-border);--input-border-color:var(--emoji-picker-border);--input-border-color-focus:#00a651;--button-hover-background:rgba(0,166,81,0.1);--button-active-background:rgba(0,166,81,0.2);--category-emoji-size:1.375rem;--emoji-size:1.375rem;--indicator-color:#00a651;--outline-color:#00a651;--input-background:var(--emoji-picker-input-bg);--input-color:var(--emoji-picker-text);--input-font-color:var(--emoji-picker-text);--input-placeholder-color:#6c757d;--num-columns:8;width:100%;max-width:100%;height:100%;border:2px solid var(--emoji-picker-border);border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,0.05);transition:all 0.3s ease;}
emoji-picker::part(search){color:var(--emoji-picker-text)!important;font-weight:500!important;}
:host([data-js-focus-visible]) emoji-picker::shadow input[type="search"]{color:var(--emoji-picker-text)!important;}
emoji-picker:focus-within{border-color:#00a651;box-shadow:0 4px 16px rgba(0,166,81,0.15);}
.busca-emojis-feedback{margin-top:1.5rem;padding:1rem;background:var(--emoji-feedback-bg);border:2px solid var(--emoji-feedback-border);border-radius:8px;text-align:center;display:none;animation:fadeInUp 0.5s ease-out;position:relative;overflow:hidden;}
.busca-emojis-feedback.show{display:block;}
.busca-emojis-feedback::before{content:'';position:absolute;top:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,#00a651,#0072bc);}
.busca-emojis-copiado{font-size:1rem;font-weight:600;color:var(--emoji-feedback-text);display:flex;align-items:center;justify-content:center;gap:0.5rem;margin:0;position:relative;z-index:1;flex-direction:column;}
.busca-emojis-copiado svg{width:20px;height:20px;fill:#28a745;flex-shrink:0;}
.busca-emojis-copiado small{font-size:0.85rem;font-weight:400;color:#6c757d;margin-top:0.25rem;}
@keyframes fadeInUp{from{opacity:0;transform:translateY(20px);}to{opacity:1;transform:translateY(0);}}
@keyframes pulse{0%,100%{transform:scale(1);}50%{transform:scale(1.05);}}
.busca-emojis-feedback.animate{animation:pulse 0.6s ease-in-out;}
.busca-emojis-stats{margin-top:1.5rem;padding:1rem;background:var(--emoji-section-bg);border-radius:8px;border:1px solid var(--emoji-picker-border);text-align:center;display:none;}
.busca-emojis-stats.show{display:block;animation:fadeInUp 0.5s ease-out;}
.busca-emojis-stats-title{font-size:0.9rem;font-weight:600;color:var(--emoji-picker-text);margin-bottom:0.5rem;display:flex;align-items:center;justify-content:center;gap:0.5rem;}
.busca-emojis-stats-count{font-size:1.1rem;font-weight:700;color:#00a651;display:flex;align-items:center;justify-content:center;gap:0.25rem;}
.emoji-sections{margin-bottom:1.5rem;border-radius:8px;overflow:hidden;border:1px solid var(--emoji-picker-border);display:none;}
.emoji-section{background:var(--emoji-section-bg);border-bottom:1px solid var(--emoji-picker-border);}
.emoji-section:last-child{border-bottom:none;}
.emoji-section-header{padding:0.75rem 1rem;background:var(--emoji-picker-bg);border-bottom:1px solid var(--emoji-picker-border);font-weight:600;color:var(--emoji-picker-text);display:flex;align-items:center;gap:0.5rem;cursor:pointer;transition:all 0.3s ease;}
.emoji-section-header:hover{background:var(--emoji-section-bg);}
.emoji-section-header svg{width:18px;height:18px;stroke:#00a651;flex-shrink:0;}
.emoji-section-content{padding:1rem;display:none;max-height:100%;overflow-y:auto;}
.emoji-section.expanded .emoji-section-content{display:block;}
.emoji-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(40px,1fr));gap:0.5rem;align-items:center;}
.emoji-item{width:40px;height:40px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;background:var(--emoji-item-bg);border:1px solid var(--emoji-picker-border);border-radius:6px;cursor:pointer;transition:all 0.2s ease;position:relative;}
.emoji-item:hover{transform:scale(1.1);box-shadow:0 4px 12px rgba(0,166,81,0.2);border-color:#00a651;z-index:2;}
.emoji-empty{grid-column:1/-1;text-align:center;color:var(--emoji-empty-text);font-style:italic;padding:1rem;}
.emoji-loader-container{position:absolute;top:0;left:0;right:0;bottom:0;background-color:var(--emoji-loader-bg);display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:100;border-radius:12px;backdrop-filter:blur(3px);transition:opacity 0.3s ease-in-out,visibility 0.3s ease-in-out;}
.emoji-loader-spinner{position:relative;width:60px;height:60px;}
.emoji-loader-spinner::before,.emoji-loader-spinner::after{content:'';position:absolute;border-radius:50%;}
.emoji-loader-spinner::before{width:100%;height:100%;background-image:linear-gradient(90deg,#00a651 0%,#0072bc 100%);animation:pulse-ring 1.25s cubic-bezier(0.215,0.61,0.355,1) infinite;}
.emoji-loader-spinner::after{width:80%;height:80%;background-color:var(--emoji-picker-bg);top:10%;left:10%;animation:pulse-dot 1.25s cubic-bezier(0.455,0.03,0.515,0.955) -0.4s infinite;}
.emoji-loader-emoji{position:absolute;font-size:1.8rem;transform-origin:center center;top:50%;left:50%;animation:orbit 3s infinite linear;}
.emoji-loader-text{margin-top:24px;font-size:1rem;font-weight:600;color:var(--emoji-loader-text);background-image:linear-gradient(90deg,#00a651,#0072bc);background-size:100%;background-clip:text;-webkit-background-clip:text;-moz-background-clip:text;-webkit-text-fill-color:transparent;-moz-text-fill-color:transparent;position:relative;}
.emoji-loader-text::after{content:'...';position:absolute;right:-12px;animation:loadingDots 1.5s infinite;}
.emoji-loader-hidden{opacity:0;visibility:hidden;}
@keyframes pulse-ring{0%{transform:scale(0.7);opacity:0.5;}50%{transform:scale(1);opacity:1;}100%{transform:scale(0.7);opacity:0.5;}}
@keyframes pulse-dot{0%{transform:scale(0.9);}50%{transform:scale(1);}100%{transform:scale(0.9);}}
@keyframes orbit{0%{transform:translate(-50%,-50%) rotate(0deg) translateX(30px) rotate(0deg);}100%{transform:translate(-50%,-50%) rotate(360deg) translateX(30px) rotate(-360deg);}}
@keyframes loadingDots{0%{content:'.';}33%{content:'..';}66%{content:'...';}100%{content:'.';}}
@media (min-width:769px){
emoji-picker{--num-columns:12;--emoji-size:1.5rem;--category-emoji-size:1.5rem;height:100%;}
.busca-emojis-container{padding:2.5rem;}
.emoji-grid{grid-template-columns:repeat(auto-fill,minmax(45px,1fr));gap:0.75rem;}
.emoji-item{width:45px;height:45px;font-size:1.75rem;}
}
@media (max-width:768px){
.busca-emojis-container{padding:1.5rem;margin:0 -0.5rem;}
emoji-picker{--num-columns:8;--emoji-size:1.25rem;--category-emoji-size:1.25rem;height:100%;}
.busca-emojis-feedback{margin-top:1.25rem;padding:0.875rem;}
.busca-emojis-copiado{font-size:0.95rem;}
.busca-emojis-actions{margin-top:0.875rem;gap:0.75rem;}
.busca-emojis-btn{padding:0.625rem 1.25rem;font-size:0.85rem;min-width:120px;}
.emoji-grid{grid-template-columns:repeat(auto-fill,minmax(35px,1fr));gap:0.5rem;}
.emoji-item{width:35px;height:35px;font-size:1.25rem;}
}
@media (max-width:480px){
.busca-emojis-container{padding:1rem;margin:0 -0.5rem;}
emoji-picker{--num-columns:6;--emoji-size:1.125rem;--category-emoji-size:1.125rem;height:100%;border-radius:8px;}
.busca-emojis-feedback{padding:0.75rem;margin-top:1rem;}
.busca-emojis-copiado{font-size:0.9rem;flex-direction:column;gap:0.25rem;}
.busca-emojis-copiado svg{width:18px;height:18px;}
.save-indicator{top:10px;right:10px;left:10px;width:auto;}
.save-indicator-content{padding:0.5rem 0.75rem;font-size:0.85rem;min-width:auto;}
.busca-emojis-actions{flex-direction:column;align-items:center;margin-top:0.75rem;}
.busca-emojis-btn{width:100%;max-width:200px;padding:0.75rem 1rem;font-size:0.85rem;}
.busca-emojis-stats{padding:0.75rem;margin-top:1rem;}
.busca-emojis-stats-title{font-size:0.85rem;}
.busca-emojis-stats-count{font-size:1rem;}
}
.busca-emojis-container.loading{pointer-events:none;opacity:0.7;}
.busca-emojis-container.loading::after{content:'';position:absolute;top:50%;left:50%;width:32px;height:32px;border:3px solid var(--emoji-picker-border);border-top:3px solid #00a651;border-radius:50%;animation:spin 1s linear infinite;transform:translate(-50%,-50%);z-index:10;}
@keyframes spin{0%{transform:translate(-50%,-50%) rotate(0deg);}100%{transform:translate(-50%,-50%) rotate(360deg);}}