/* BrogdelPad 2003 — responsive image-only smilie arsenal; GPL-3.0. */
/* Restrained old-web chrome: preserve familiar CKEditor controls and post editor. */
.cke.cke_chrome {border:1px solid #7d6dac !important; border-radius:6px !important; overflow:hidden; box-shadow:0 2px 0 #cbc1df !important;}
.cke .cke_top {background:linear-gradient(#f9f8ff,#ded7ed) !important; border-bottom:1px solid #b4a6d0 !important;}
.cke .cke_bottom {background:linear-gradient(#ece8f7,#d6cce9) !important; border-top:1px solid #b4a6d0 !important;}
.cke .cke_toolgroup {border-radius:4px;}

.cke .cke_button__smiley { display:none !important; }
.cke .brogdelpad-toolbar { float:right; padding:2px 6px 2px 0; }
.cke .brogdelpad-trigger {
    display:inline-flex; align-items:center; justify-content:center; gap:7px;
    min-height:30px; padding:5px 11px; cursor:pointer;
    font: bold 11px/1.2 Verdana,Arial,sans-serif; letter-spacing:.4px;
    color:#ebffc0; background:linear-gradient(#6e5aa9 0%, #49346f 50%, #32254e 51%,#554185 100%);
    border:1px solid #332451; border-top-color:#c1addd; border-left-color:#c1addd;
    box-shadow:inset 1px 1px rgba(255,255,255,.22),1px 1px 0 rgba(0,0,0,.2);
    border-radius:4px;
}
.cke .brogdelpad-trigger:hover { background:linear-gradient(#8569c0,#493569); color:#d6ff8d; }
.cke .brogdelpad-trigger:focus-visible { outline:3px solid #caff64; outline-offset:2px; }
.cke .brogdelpad-trigger-icon {font: bold 19px/16px Arial,sans-serif; color:#caff64;}
.brogdelpad-backdrop[hidden] { display:none !important; }
.brogdelpad-backdrop {
    position:fixed; inset:0; z-index:2147483500; box-sizing:border-box;
    display:flex; align-items:center; justify-content:center;
    padding:clamp(8px,3vw,24px);
    background:rgba(9,8,29,.72); backdrop-filter:blur(3px); -webkit-backdrop-filter:blur(3px);
}
.brogdelpad-modal, .brogdelpad-modal * {box-sizing:border-box;}
.brogdelpad-modal {
    width:min(740px,100%); max-height:calc(100vh - 22px); max-height:calc(100dvh - 22px);
    display:flex; flex-direction:column; overflow:hidden;
    color:#252137; background:#ecebf1; border:2px solid #c5b9e8; border-radius:12px;
    box-shadow:0 0 0 1px #34294e,0 24px 65px rgba(0,0,0,.5),inset 1px 1px rgba(255,255,255,.85);
    font:13px/1.45 Verdana,Arial,sans-serif;
}
.brogdelpad-titlebar {
    display:flex; align-items:center; justify-content:space-between; gap:8px;
    padding:15px 18px; flex:0 0 auto;
    background:linear-gradient(180deg,#7365b7,#48336f 52%,#211a3f 53%,#34245c);
    border-bottom:4px solid #b7f747; box-shadow:inset 0 2px rgba(255,255,255,.26);
}
.brogdelpad-heading-wrap {min-width:0;}
.brogdelpad-titlebar h2 {
    margin:0 !important; color:#fff !important; font:bold 17px/1.25 Verdana,Arial,sans-serif !important;
    letter-spacing:.6px; text-shadow:1px 1px #140d27;
}
.brogdelpad-micro { color:#d8ffc1; font:10px/1.45 'Courier New',monospace; letter-spacing:.4px; margin-top:2px; }
.brogdelpad-close {
    appearance:none; display:grid; place-items:center; flex:0 0 auto;
    width:34px; height:34px; border:1px solid #d0c3eb; border-radius:5px;
    background:linear-gradient(#fbfbff,#d8d1ec); color:#2b2047;
    font:25px/24px Arial,sans-serif; cursor:pointer;
    box-shadow:1px 2px rgba(0,0,0,.25);
}
.brogdelpad-close:hover {background:#d2ff80;}
.brogdelpad-close:focus-visible,.brogdelpad-tile:focus-visible,.brogdelpad-search:focus-visible {
    outline:3px solid #85b900; outline-offset:2px;
}
.brogdelpad-tools {
    display:flex; gap:12px; align-items:center; padding:13px 17px;
    border-bottom:1px solid #c9c4d5; background:#f6f5fa; flex:0 0 auto;
}
.brogdelpad-search {
    display:block; min-width:0; flex:1; width:100%; height:38px;
    font:13px Verdana,Arial,sans-serif; padding:0 12px;
    color:#262139; background:#fff;
    border:1px solid #aaa1c1; border-radius:6px; box-shadow:inset 0 1px 2px #dfdeea;
}
.brogdelpad-count {
    flex:0 0 auto; text-align:right; white-space:nowrap;
    color:#605777; font:700 10px/1.4 'Courier New',monospace;
}
.brogdelpad-content {
    overflow:auto; overscroll-behavior:contain; min-height:110px;
    flex:1 1 auto; padding:15px 16px 20px; background:#efedf4;
    scrollbar-color:#8574a9 #eeecf3;
}
.brogdelpad-grid {
    display:grid; grid-template-columns:repeat(auto-fill,minmax(70px,1fr)); gap:10px;
    width:100%; margin:0;
}
.brogdelpad-tile {
    display:grid; place-items:center; aspect-ratio:1/1;
    min-width:0; padding:7px; background:#fff;
    border:1px solid #c9c3d4; border-radius:7px;
    box-shadow:0 2px 0 #e2dfe8; cursor:pointer;
    transition:transform .12s ease,border-color .12s ease,background .12s ease;
}
.brogdelpad-tile:hover {
    border-color:#99c948; background:#eaffcf; transform:translateY(-2px);
    box-shadow:0 3px 0 #b9ce9c;
}
.brogdelpad-image {display:block; max-width:100%; max-height:56px; width:auto; height:auto; object-fit:contain;}
.brogdelpad-tile-missing {background:repeating-linear-gradient(135deg,#f7f4f4,#f7f4f4 7px,#e8e1e9 7px,#e8e1e9 14px);}
.brogdelpad-tile-missing:before {content:'?'; font-size:22px; color:#897b9c;}
.brogdelpad-tile-missing img {display:none;}
.brogdelpad-empty {padding:30px 10px; text-align:center; font:bold 12px 'Courier New',monospace; color:#645875;}
.brogdelpad-footer {
    display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px;
    padding:10px 17px; border-top:1px solid #c9c4d5; background:#f8f7fc;
    color:#544a68; font:bold 10px/1.4 'Courier New',monospace;
}
.brogdelpad-footer-hint {color:#7a728c;}
@media (max-width:540px) {
    .brogdelpad-backdrop {padding:0; align-items:stretch;}
    .brogdelpad-modal {width:100%; max-height:100dvh; height:100dvh; border-radius:0; border:0;}
    .brogdelpad-titlebar {padding:15px 14px;}
    .brogdelpad-titlebar h2 {font-size:15px !important;}
    .brogdelpad-micro {font-size:9px;}
    .brogdelpad-tools {padding:10px 12px; gap:8px;}
    .brogdelpad-content {padding:12px;}
    .brogdelpad-grid {grid-template-columns:repeat(auto-fill,minmax(60px,1fr)); gap:8px;}
    .brogdelpad-tile {padding:6px;}
    .brogdelpad-image {max-height:46px;}
    .brogdelpad-footer {padding:9px 12px;}
}
@media (prefers-reduced-motion:reduce) { .brogdelpad-tile {transition:none;} }

/* Suppress MyBB's legacy code/text-based smilie list while the image picker runs. */
body.brogdelpad-ready #smilieinserter,
body.brogdelpad-ready .smilieinserter,
body.brogdelpad-ready .smilieinsert {
    display: none !important;
}