/* Код-блоки у статтях (додано разом з кнопкою Копіювати) */
.cont_in pre {
    position: relative;
    background: #1e1e1e;
    color: #d4d4d4;
    font-family: "Consolas", "Monaco", "Courier New", monospace;
    font-size: 14px;
    line-height: 1.5;
    padding: 14px 16px;
    padding-right: 80px;
    margin: 16px 0;
    border-radius: 6px;
    overflow-x: auto;
    white-space: pre;
    border: 1px solid #333;
}
.cont_in pre code { background: none; color: inherit; padding: 0; }
.cont_in code {
    background: #f4f4f4;
    color: #c7254e;
    padding: 1px 5px;
    border-radius: 3px;
    font-family: "Consolas", "Monaco", "Courier New", monospace;
    font-size: 0.92em;
}

/* Кнопка Copy */
.copy-btn {
    position: absolute;
    top: 8px;
    right: 8px;
    padding: 4px 10px;
    font-size: 12px;
    font-family: inherit;
    background: #3a3a3a;
    color: #d4d4d4;
    border: 1px solid #555;
    border-radius: 4px;
    cursor: pointer;
    opacity: 0.7;
    transition: opacity 0.15s, background 0.15s;
    user-select: none;
}
.copy-btn:hover { opacity: 1; background: #4a4a4a; }
.copy-btn.copied { background: #2d7a2d; border-color: #3a9a3a; color: #fff; opacity: 1; }

/* ============================================================
   Callout-блоки для статей (додано 2026-04-09)
   ============================================================ */
.cont_in .callout {
    margin: 18px 0;
    padding: 12px 16px 12px 20px;
    border-left: 4px solid #999;
    background: #f7f7f8;
    border-radius: 0 4px 4px 0;
    line-height: 1.55;
}
.cont_in .callout > .callout-label {
    display: block;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.6px;
    margin-bottom: 6px;
    color: #666;
}
.cont_in .callout p:last-child,
.cont_in .callout ul:last-child,
.cont_in .callout ol:last-child { margin-bottom: 0; }
.cont_in .callout p:first-of-type { margin-top: 0; }

.cont_in .callout-tip     { border-left-color: #2d7a2d; background: #f1f8f1; }
.cont_in .callout-tip     > .callout-label { color: #2d7a2d; }

.cont_in .callout-warning { border-left-color: #b8860b; background: #fdf9ee; }
.cont_in .callout-warning > .callout-label { color: #8b6508; }

.cont_in .callout-danger  { border-left-color: #c0392b; background: #fbf1f0; }
.cont_in .callout-danger  > .callout-label { color: #a02a1c; }

.cont_in .callout-note    { border-left-color: #2c6fb8; background: #f0f5fa; }
.cont_in .callout-note    > .callout-label { color: #2c6fb8; }

.cont_in .callout-req     { border-left-color: #555; background: #f5f5f5; }
.cont_in .callout-req     > .callout-label { color: #555; }

.cont_in .callout-check   { border-left-color: #2d7a2d; background: #f1f8f1; }
.cont_in .callout-check   > .callout-label { color: #2d7a2d; }
.cont_in .callout-check ul {
    list-style: none;
    padding-left: 0;
    margin: 0;
}
.cont_in .callout-check li {
    position: relative;
    padding-left: 26px;
    margin: 6px 0;
}
.cont_in .callout-check li::before {
    content: "✓";
    position: absolute;
    left: 4px;
    top: 0;
    color: #2d7a2d;
    font-weight: 700;
    font-size: 16px;
}