/* VSK HTML Section block.
   Clean full-width canvas for trusted HTML sections without Moodle Text/TinyMCE wrappers. */

.block_vskhtmlsection.vskhtmlsection-block,
.block_vskhtmlsection.vskhtmlsection-block.card {
    width: 100% !important;
    max-width: none !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
}

.block_vskhtmlsection.vskhtmlsection-block > .card-body,
.block_vskhtmlsection.vskhtmlsection-block .card-body,
.block_vskhtmlsection.vskhtmlsection-block .card-text,
.block_vskhtmlsection.vskhtmlsection-block .content,
.block_vskhtmlsection.vskhtmlsection-block .no-overflow {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    overflow: visible !important;
}

/* Hide normal visual chrome only outside editing. In edit mode Moodle needs the
   header/actions area for move/configure controls. */
body:not(.editing) .block_vskhtmlsection.vskhtmlsection-block .footer,
body:not(.editing) .block_vskhtmlsection.vskhtmlsection-block .card-title,
body:not(.editing) .block_vskhtmlsection.vskhtmlsection-block .block-header,
body:not(.editing) .block_vskhtmlsection.vskhtmlsection-block .header {
    display: none !important;
}

/* In edit mode keep Moodle's move/configure controls, but do not show a
   visible title bar/border for this content block. */
body.editing .block_vskhtmlsection.vskhtmlsection-block,
body.editing .block_vskhtmlsection.vskhtmlsection-block.card {
    position: relative !important;
}

body.editing .block_vskhtmlsection.vskhtmlsection-block .block-header,
body.editing .block_vskhtmlsection.vskhtmlsection-block .header {
    display: flex !important;
    position: absolute !important;
    top: 8px !important;
    right: 10px !important;
    z-index: 20 !important;
    width: auto !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    align-items: center;
    justify-content: flex-end;
    pointer-events: none;
}

body.editing .block_vskhtmlsection.vskhtmlsection-block .card-title,
body.editing .block_vskhtmlsection.vskhtmlsection-block .block-title,
body.editing .block_vskhtmlsection.vskhtmlsection-block .block-header h2,
body.editing .block_vskhtmlsection.vskhtmlsection-block .block-header h3,
body.editing .block_vskhtmlsection.vskhtmlsection-block .header h2,
body.editing .block_vskhtmlsection.vskhtmlsection-block .header h3 {
    display: none !important;
}

body.editing .block_vskhtmlsection.vskhtmlsection-block .block-controls,
body.editing .block_vskhtmlsection.vskhtmlsection-block .commands,
body.editing .block_vskhtmlsection.vskhtmlsection-block .dropdown,
body.editing .block_vskhtmlsection.vskhtmlsection-block [data-region=block-actions] {
    display: flex !important;
    visibility: visible !important;
    pointer-events: auto;
}

.block_vskhtmlsection.vskhtmlsection-block .vskhtmlsection-canvas {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
    overflow: visible;
    box-sizing: border-box;
}

.block_vskhtmlsection.vskhtmlsection-block .vskhtmlsection-canvas > :first-child {
    margin-top: 0;
}

.block_vskhtmlsection.vskhtmlsection-block .vskhtmlsection-canvas > :last-child {
    margin-bottom: 0;
}

/* Empty blocks stay invisible to normal users, but in edit mode they need a visible grab/edit target. */
.block_vskhtmlsection.vskhtmlsection-is-editing .vskhtmlsection-empty {
    display: block;
    min-height: 56px;
    padding: 18px 22px;
    box-sizing: border-box;
    background: rgba(0, 0, 0, 0.025);
    color: #666;
    font-size: 14px;
    line-height: 1.4;
}

/* Make the otherwise borderless block easier to find while editing, without affecting normal users. */
.block_vskhtmlsection.vskhtmlsection-is-editing:empty,
.block_vskhtmlsection.vskhtmlsection-is-editing .content:empty,
.block_vskhtmlsection.vskhtmlsection-is-editing .card-text:empty {
    min-height: 56px;
}

/* Useful default: media inside this block can fill custom sections without Moodle's Text block behavior. */
.block_vskhtmlsection.vskhtmlsection-block video,
.block_vskhtmlsection.vskhtmlsection-block img,
.block_vskhtmlsection.vskhtmlsection-block iframe {
    max-width: 100%;
}

.block_vskhtmlsection.vskhtmlsection-block video.vsk-cover,
.block_vskhtmlsection.vskhtmlsection-block .vsk-cover video {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
}

body#page-site-index .block_vskhtmlsection.vskhtmlsection-block {
    width: 100% !important;
    max-width: none !important;
}


body.editing .block_vskhtmlsection.vskhtmlsection-block {
    outline: 0 !important;
    min-height: 34px;
}


/* Final safety: Moodle/theme variants can place the block title in different
   elements while editing. Hide only the title/header text, not the content. */
.block_vskhtmlsection.vskhtmlsection-block > .card-body > h2,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > h3,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > h4,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > h5,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > h6,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > .card-title,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > .block-title,
.block_vskhtmlsection.vskhtmlsection-block > .card-body > .blockname,
.block_vskhtmlsection.vskhtmlsection-block > .header .title,
.block_vskhtmlsection.vskhtmlsection-block > .header .block-title,
.block_vskhtmlsection.vskhtmlsection-block > .block-header .title,
.block_vskhtmlsection.vskhtmlsection-block > .block-header .block-title {
    display: none !important;
}