/* "Under construction" banner — marks pages that are not yet complete.
   Included at the top of a chapter via {{#include ../includes/under-construction.md}}.

   One amber-orange across every theme. Orange sits on the blue-yellow axis, so
   it stays distinguishable under red-green colour blindness where a red would
   not; this hue also keeps enough luminance contrast to read on both the light
   (white) and dark backgrounds. The label text and both icons draw from the
   same --uc-color; the SVG icons use currentColor so they match it exactly. */

.under-construction {
    --uc-color: #d97706;              /* amber-orange, all themes */
    margin: 1.6rem 0 2rem;
}

/* the thick rules above and below the label */
.under-construction hr {
    border: none;
    height: 0;
    border-top: 4px solid var(--uc-color);
    background: none;                 /* some themes draw hr as a filled bar — suppress it */
    margin: 0.5rem 0;
}

.under-construction .uc-label {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5em;
    margin: 0;
    color: var(--uc-color);
    font-weight: 700;
    font-size: 3rem;                  /* deliberately large so the flag is unmissable */
    letter-spacing: 0.14em;
    text-transform: uppercase;
}

.under-construction .uc-icon {
    width: 1.25em;                    /* scales with the label's font-size */
    height: 1.25em;
    flex: none;                       /* keep the triangles from squashing at narrow widths */
}