:root{
    --dralys-aibcc-primary:#ff5a14;
    --dralys-aibcc-primary-dark:#e64d0b;
    --dralys-aibcc-text:#1f2937;
    --dralys-aibcc-muted:#6b7280;
    --dralys-aibcc-border:#e9e9e9;
    --dralys-aibcc-soft:#fff3ec;
    --dralys-aibcc-bg:#ffffff;
    --dralys-aibcc-light:#f7f7f7;
    --dralys-aibcc-shadow:0 10px 25px rgba(0,0,0,.05);
    --dralys-aibcc-shadow-hover:0 14px 30px rgba(0,0,0,.08);
}

/* Main engagement box */
.dralys-aibcc-box{
    margin:24px 0;
    padding:18px;
    background:var(--dralys-aibcc-bg);
    border:1px solid var(--dralys-aibcc-border);
    border-radius:18px;
    box-shadow:var(--dralys-aibcc-shadow);
    transition:.25s ease;
    color:var(--dralys-aibcc-text);
}

.dralys-aibcc-box:hover{
    box-shadow:var(--dralys-aibcc-shadow-hover);
}

.dralys-aibcc-row,
.dralys-aibcc-top{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:15px;
    flex-wrap:wrap;
}

.dralys-aibcc-like-count,
.dralys-aibcc-share-count,
.dralys-aibcc-score,
.dralys-aibcc-mini{
    color:var(--dralys-aibcc-muted);
    font-size:14px;
}

.dralys-aibcc-mini{
    margin-top:12px;
    display:flex;
    gap:10px;
    flex-wrap:wrap;
}

/* Buttons */
.dralys-aibcc-btn,
.dralys-aibcc-copy{
    border:none;
    background:var(--dralys-aibcc-primary);
    color:#fff;
    border-radius:999px;
    padding:11px 18px;
    font-size:14px;
    font-weight:700;
    cursor:pointer;
    transition:.25s;
    line-height:1;
}

.dralys-aibcc-btn:hover,
.dralys-aibcc-copy:hover{
    background:var(--dralys-aibcc-primary-dark);
    transform:translateY(-2px);
}

.dralys-aibcc-btn.active,
.dralys-aibcc-copy.active{
    background:#111827;
    color:#fff;
}

.dralys-aibcc-btn:focus,
.dralys-aibcc-copy:focus,
.dralys-aibcc-reacts button:focus,
.dralys-aibcc-share a:focus{
    outline:3px solid rgba(255,90,20,.25);
    outline-offset:2px;
}

/* Loading */
.dralys-aibcc-btn.is-loading,
.dralys-aibcc-reacts button.is-loading,
.dralys-aibcc-copy.is-loading{
    opacity:.75;
    pointer-events:none;
    position:relative;
}

.dralys-aibcc-btn.is-loading::after,
.dralys-aibcc-copy.is-loading::after{
    content:"";
    display:inline-block;
    width:12px;
    height:12px;
    margin-left:8px;
    border:2px solid rgba(255,255,255,.45);
    border-top-color:#fff;
    border-radius:50%;
    animation:dralys-aibcc-spin .7s linear infinite;
}

@keyframes dralys-aibcc-spin{
    to{transform:rotate(360deg);}
}

/* Reactions */
.dralys-aibcc-reacts{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.dralys-aibcc-reacts button{
    background:#fafafa;
    border:1px solid #e5e5e5;
    border-radius:999px;
    padding:8px 14px;
    cursor:pointer;
    transition:.25s;
    font-weight:600;
    color:#333;
}

.dralys-aibcc-reacts button:hover{
    background:var(--dralys-aibcc-soft);
    border-color:var(--dralys-aibcc-primary);
}

.dralys-aibcc-reacts button.active{
    background:var(--dralys-aibcc-primary);
    color:#fff;
    border-color:var(--dralys-aibcc-primary);
}

.dralys-aibcc-reacts button span{
    font-size:12px;
    opacity:.8;
}

/* Share */
.dralys-aibcc-share{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-top:14px;
}

.dralys-aibcc-share a,
.dralys-aibcc-share button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:8px 14px;
    border-radius:999px;
    background:#f5f5f5;
    color:#333;
    border:0;
    text-decoration:none;
    font-weight:700;
    transition:.25s;
    cursor:pointer;
}

.dralys-aibcc-share a:hover,
.dralys-aibcc-share button:hover{
    background:var(--dralys-aibcc-primary);
    color:#fff;
    transform:translateY(-1px);
}

/* Toast */
.dralys-aibcc-toast{
    pointer-events:none;
}

/* Reading progress */
.dralys-aibcc-progress{
    box-shadow:0 1px 8px rgba(255,90,20,.35);
}

/* Status badges */
.dralys-aibcc-score,
.dralys-aibcc-trending-count,
.dralys-aibcc-bookmark-count{
    font-weight:700;
}

/* Success animation */
.dralys-aibcc-btn.active,
.dralys-aibcc-reacts button.active{
    animation:dralys-aibcc-pop .22s ease;
}

@keyframes dralys-aibcc-pop{
    0%{transform:scale(.96);}
    70%{transform:scale(1.04);}
    100%{transform:scale(1);}
}

/* Admin/front shared utility */
.dralys-aibcc-hidden{
    display:none!important;
}

.dralys-aibcc-center{
    text-align:center;
}

/* Tablet */
@media (max-width:1024px){
    .dralys-aibcc-box{
        padding:16px;
    }

    .dralys-aibcc-share a,
    .dralys-aibcc-share button,
    .dralys-aibcc-reacts button{
        font-size:13px;
    }
}

/* Mobile */
@media (max-width:768px){
    .dralys-aibcc-box{
        margin:18px 0;
        padding:15px;
        border-radius:16px;
    }

    .dralys-aibcc-row,
    .dralys-aibcc-top{
        flex-direction:column;
        align-items:flex-start;
    }

    .dralys-aibcc-btn,
    .dralys-aibcc-copy{
        width:100%;
        text-align:center;
        justify-content:center;
    }

    .dralys-aibcc-share{
        width:100%;
    }

    .dralys-aibcc-share a,
    .dralys-aibcc-share button{
        flex:1 1 calc(50% - 8px);
        text-align:center;
        min-width:120px;
    }

    .dralys-aibcc-reacts{
        width:100%;
    }

    .dralys-aibcc-reacts button{
        flex:1 1 calc(50% - 8px);
        text-align:center;
    }

    .dralys-aibcc-mini{
        flex-direction:column;
        gap:4px;
    }
}

/* Small mobile */
@media (max-width:420px){
    .dralys-aibcc-share a,
    .dralys-aibcc-share button,
    .dralys-aibcc-reacts button{
        flex:1 1 100%;
    }
}

/* Dark mode support */
@media (prefers-color-scheme:dark){
    .dralys-aibcc-box{
        background:#111827;
        border-color:#263244;
        color:#f9fafb;
        box-shadow:0 10px 25px rgba(0,0,0,.25);
    }

    .dralys-aibcc-like-count,
    .dralys-aibcc-share-count,
    .dralys-aibcc-score,
    .dralys-aibcc-mini{
        color:#cbd5e1;
    }

    .dralys-aibcc-reacts button,
    .dralys-aibcc-share a,
    .dralys-aibcc-share button{
        background:#1f2937;
        color:#f9fafb;
        border-color:#374151;
    }

    .dralys-aibcc-reacts button:hover,
    .dralys-aibcc-share a:hover,
    .dralys-aibcc-share button:hover{
        background:var(--dralys-aibcc-primary);
        color:#fff;
    }
}