/*
 * TT Integrity callout adaptive colour layer.
 *
 * A callout must remain readable on both light and dark article canvases.
 * The content therefore inherits the surrounding article text colour, while
 * semantic backgrounds use transparent accent overlays instead of fixed white
 * surfaces. This avoids the former white DANGER/BEST PRACTICE cards on JNews
 * dark pages without relying on a theme-specific dark-mode class.
 */

:root {
    --tti-callout-danger-force: #d21030;
    --tti-callout-success-force: #2f8a5b;
    --tti-callout-warning-force: #b7791f;
    --tti-callout-primary-force: #4f8fc4;
}

/* Shared layout and adaptive base surface. */
body .wp-block-tt-integrity-callout,
.entry-content .wp-block-tt-integrity-callout,
.editor-styles-wrapper .wp-block-tt-integrity-callout,
.block-editor-block-list__layout .wp-block-tt-integrity-callout {
    box-sizing: border-box !important;
    padding: 24px 28px 25px !important;
    border-color: rgba(127, 127, 127, 0.32) !important;
    border-left-color: var(--tti-callout-primary-force) !important;
    background: rgba(127, 127, 127, 0.08) !important;
    color: inherit !important;
}

body .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout__title {
    margin: 0 0 12px !important;
    color: var(--tti-callout-primary-force) !important;
}

body .wp-block-tt-integrity-callout__content,
.entry-content .wp-block-tt-integrity-callout__content,
.editor-styles-wrapper .wp-block-tt-integrity-callout__content {
    margin: 0 !important;
    padding: 0 !important;
    color: inherit !important;
}

/* JNews and Core blocks can assign a fixed paragraph/list colour. */
body .wp-block-tt-integrity-callout__content p,
body .wp-block-tt-integrity-callout__content li,
body .wp-block-tt-integrity-callout__content blockquote,
.entry-content .wp-block-tt-integrity-callout__content p,
.entry-content .wp-block-tt-integrity-callout__content li,
.entry-content .wp-block-tt-integrity-callout__content blockquote,
.editor-styles-wrapper .wp-block-tt-integrity-callout__content p,
.editor-styles-wrapper .wp-block-tt-integrity-callout__content li,
.editor-styles-wrapper .wp-block-tt-integrity-callout__content blockquote {
    color: inherit !important;
}

/* WARNING / ASSUMPTION */
body .wp-block-tt-integrity-callout[data-type="warning"],
body .wp-block-tt-integrity-callout[data-type="assumption"],
.entry-content .wp-block-tt-integrity-callout[data-type="warning"],
.entry-content .wp-block-tt-integrity-callout[data-type="assumption"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="warning"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="assumption"] {
    border-left-color: var(--tti-callout-warning-force) !important;
    background: rgba(183, 121, 31, 0.11) !important;
}

body .wp-block-tt-integrity-callout[data-type="warning"] .wp-block-tt-integrity-callout__title,
body .wp-block-tt-integrity-callout[data-type="assumption"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="warning"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="assumption"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="warning"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="assumption"] .wp-block-tt-integrity-callout__title {
    color: var(--tti-callout-warning-force) !important;
}

/* DANGER / DON'T */
body .wp-block-tt-integrity-callout[data-type="danger"],
body .wp-block-tt-integrity-callout[data-type="dont"],
.entry-content .wp-block-tt-integrity-callout[data-type="danger"],
.entry-content .wp-block-tt-integrity-callout[data-type="dont"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="danger"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="dont"] {
    border: 2px solid var(--tti-callout-danger-force) !important;
    border-left: 8px solid var(--tti-callout-danger-force) !important;
    background: rgba(210, 16, 48, 0.10) !important;
    color: inherit !important;
}

body .wp-block-tt-integrity-callout[data-type="danger"] .wp-block-tt-integrity-callout__title,
body .wp-block-tt-integrity-callout[data-type="dont"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="danger"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="dont"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="danger"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="dont"] .wp-block-tt-integrity-callout__title {
    color: var(--tti-callout-danger-force) !important;
}

/* BEST PRACTICE / DO / INSPECTOR */
body .wp-block-tt-integrity-callout[data-type="best-practice"],
body .wp-block-tt-integrity-callout[data-type="do"],
body .wp-block-tt-integrity-callout[data-type="inspector"],
.entry-content .wp-block-tt-integrity-callout[data-type="best-practice"],
.entry-content .wp-block-tt-integrity-callout[data-type="do"],
.entry-content .wp-block-tt-integrity-callout[data-type="inspector"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="best-practice"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="do"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="inspector"] {
    border-left-color: var(--tti-callout-success-force) !important;
    background: rgba(47, 138, 91, 0.11) !important;
}

body .wp-block-tt-integrity-callout[data-type="best-practice"],
body .wp-block-tt-integrity-callout[data-type="do"],
.entry-content .wp-block-tt-integrity-callout[data-type="best-practice"],
.entry-content .wp-block-tt-integrity-callout[data-type="do"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="best-practice"],
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="do"] {
    border: 2px solid var(--tti-callout-success-force) !important;
    border-left: 8px solid var(--tti-callout-success-force) !important;
}

body .wp-block-tt-integrity-callout[data-type="best-practice"] .wp-block-tt-integrity-callout__title,
body .wp-block-tt-integrity-callout[data-type="do"] .wp-block-tt-integrity-callout__title,
body .wp-block-tt-integrity-callout[data-type="inspector"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="best-practice"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="do"] .wp-block-tt-integrity-callout__title,
.entry-content .wp-block-tt-integrity-callout[data-type="inspector"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="best-practice"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="do"] .wp-block-tt-integrity-callout__title,
.editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="inspector"] .wp-block-tt-integrity-callout__title {
    color: var(--tti-callout-success-force) !important;
}

@media (max-width: 640px) {
    body .wp-block-tt-integrity-callout,
    .entry-content .wp-block-tt-integrity-callout,
    .editor-styles-wrapper .wp-block-tt-integrity-callout,
    .block-editor-block-list__layout .wp-block-tt-integrity-callout {
        padding: 19px 20px 20px !important;
    }

    body .wp-block-tt-integrity-callout[data-type="danger"],
    body .wp-block-tt-integrity-callout[data-type="dont"],
    body .wp-block-tt-integrity-callout[data-type="best-practice"],
    body .wp-block-tt-integrity-callout[data-type="do"],
    .editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="danger"],
    .editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="dont"],
    .editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="best-practice"],
    .editor-styles-wrapper .wp-block-tt-integrity-callout[data-type="do"] {
        border-left-width: 6px !important;
    }
}