/* ===== Kholase Summary Box — Frontend Style ===== */

.kholase-summary-box {
    position: relative;
    margin: 2em 0 2.5em;
    padding: 2.2em 2em 1.8em;
    background: linear-gradient(135deg, #fffbea 0%, #fff8d6 60%, #fef3c7 100%);
    border: 2px solid #f5c842;
    border-radius: 4px;
    font-family: inherit;
    direction: rtl;
    box-shadow:
        4px 4px 0 #f5c842,
        inset 0 0 60px rgba(245, 200, 66, 0.08);
}

/* Corner accents — the signature element */
.kholase-corner {
    position: absolute;
    width: 14px;
    height: 14px;
    border-color: #d4a017;
    border-style: solid;
}
.kholase-corner--tl { top: -2px;    right: -2px;  border-width: 3px 0 0 3px; border-radius: 0 0 0 3px; }
.kholase-corner--tr { top: -2px;    left: -2px;   border-width: 3px 3px 0 0; border-radius: 0 3px 0 0; }
.kholase-corner--bl { bottom: -2px; right: -2px;  border-width: 0 0 3px 3px; border-radius: 3px 0 0 0; }
.kholase-corner--br { bottom: -2px; left: -2px;   border-width: 0 3px 3px 0; border-radius: 0 0 3px 0; }

/* Badge — floated label */
.kholase-badge {
    position: absolute;
    top: -16px;
    right: 50%;
    transform: translateX(50%);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 4px 16px;
    background: #f5c842;
    border-radius: 20px;
    font-size: 0.82em;
    font-weight: 700;
    color: #5a3e00;
    letter-spacing: 0.04em;
    white-space: nowrap;
    box-shadow: 0 2px 6px rgba(180, 130, 0, 0.25);
}

.kholase-badge__icon {
    font-size: 0.7em;
    opacity: 0.7;
}

/* Content */
.kholase-content {
    font-size: 1em;
    line-height: 1.9;
    color: #3a2a00;
    margin: 0;
}

.kholase-content p {
    margin: 0 0 0.6em;
}

.kholase-content p:last-child {
    margin-bottom: 0;
}

.kholase-content ul,
.kholase-content ol {
    padding-right: 1.4em;
    padding-left: 0;
    margin: 0.4em 0;
}

.kholase-content li {
    margin-bottom: 0.35em;
}

/* Responsive */
@media (max-width: 600px) {
    .kholase-summary-box {
        padding: 2em 1.2em 1.5em;
        margin: 1.5em 0 2em;
    }
    .kholase-badge {
        font-size: 0.78em;
        padding: 3px 12px;
    }
}