.icf, .hicf,
.xcf, .hxcf,
.xcf1, .hxcf1,
/* excludes 2 framed */		.xcf2, .hxcf2,
.ncf, .hncf,
.ntf, .hntf,
.caf, .hcaf,
.cff, .hcff,
.uaf, .huaf,
.cawpf, .hcawpf {
	position: relative;
    padding: 18px 12px 8px 0px;
    border: solid #FFFFFF 1px;

    &:is(.icf,.hicf) {
        border-left: solid var(--includes-label-light) 2px;
        background-color: var(--includes);
        &::before {
            content: "Includes";
            background-color: var(--includes-label-light);
        }
    }
    &:is(.xcf,.hxcf) {
        border-left: solid var(--excludes-label-light) 2px;
        background-color: var(--excludes);
        &::before {
            content: "Excludes";
            background-color: var(--excludes-label-light);
        }
    }
    &:is(.xcf1,.hxcf1) {
        border-left: solid var(--excludes-label-light) 2px;
        background-color: var(--excludes);
        &::before {
            content: "Excludes 1";
            background-color: var(--excludes-label-light);
        }
    }
    &:is(.xcf2,.hxcf2) {
        border-left: solid var(--excludes-label-light) 2px;
        background-color: var(--excludes-2);
        &::before {
            content: "Excludes 2"; 
            background-color: var(--excludes-label-light);
        }
    }
    &:is(.ncf,.hncf,.ntf,.hntf) {
		padding-left: 8px;
        border-left: solid var(--note-title-label-light) 2px;
        background-color: var(--note-title);
        &:is(.ntf,.hntf)::before {
            content: "Note";
            background-color: var(--note-title-label-light);
        }
    }
    &:is(.caf,.hcaf,.cff,.hcff,.uaf,.huaf,.cawpf,.hcawpf) {
        border-left: solid var(--code-label-light) 2px;
        background-color: var(--code);
        &::before {
            background-color: var(--code-label-light);
        }
        &:is(.caf,.hcaf)::before { content: "Code also"; }
        &:is(.cff,.hcff)::before { content: "Code first"; }
        &:is(.uaf,.huaf)::before { content: "Use additional"; }
        &:is(.cawpf,.hcawpf)::before { content: "Code also when performed"; }
    }

    &::before {
        text-transform: uppercase;
        width: fit-content;
        font-weight: bold;
        font-family: Arial;
        font-style: italic;
        font-size: 6pt;
        padding-top: 3px;
        padding-right: 4px;
        padding-bottom: 3px;
        padding-left: 4px;
        border-top-right-radius: 5px;
        border-bottom-right-radius: 5px;
        position: absolute;
        left: -1px;
        top: 0;
    }
    /* background-image: url(../cb/images/excludeslabel2.gif); */
    /* background-repeat:no-repeat; */
}

/* min-width for framed notes */ .icf, .xcf, .xcf1, .xcf2, .caf, .cff, .uaf, .cawpf, .hxcf, .hicf, .hcaf, .hcff, .huaf, .hcawpf {
	padding-left: 8px;
	min-width: 120px;

	/* &::before { */
	/* 	left: -10px; */
	/* } */
}

/* text indenting for framed notes */ td.icf, td.uaf, td.xcf, td.cawpf, td.ntf, td.caf, td.cff, td.xcf, td.xcf1, td.xcf2, td.ntf, td.caf, td.cff { list-style-position: inside; padding-left: 38px; }


@media (prefers-color-scheme: dark) {
	    .icf, .hicf,
    .xcf, .hxcf,
    .xcf1, .hxcf1,
    .xcf2, .hxcf2,
    .ncf, .hncf,
    .ntf, .hntf,
    .caf, .hcaf,
    .cff, .hcff,
    .uaf, .huaf,
    .cawpf, .hcawpf {
        background-color: var(--gray-100) !important;
        border-color: var(--gray-90);
        border-top: none;
        border-right: none;
        border-bottom: none;
        border-left: 4px;

        &::before {
            color: black;
        }

        &:is(.icf,.hicf) {
            color: var(--includes-label-light);
            :not(a) {color: var(--includes-label-light);}
            &::before {
                background-color: var(--includes-label-light);
            }
        }
        &:is(.xcf,.hxcf,.xcf1,.hxcf1) {
            color: var(--excludes);
            :not(a) {color: var(--excludes);}
            &::before {
                background-color: var(--excludes);
            }
        }
        &:is(.xcf2,.hxcf2) {
            border-left-color: var(--excludes-2);
            color: var(--excludes-2);
			:not(a) {color: var(--excludes-2);}
            &::before {
                background-color: var(--excludes-2);
            }
        }
        &:is(.ncf,.hncf,.ntf,.hntf) {
            color: var(--note-title-label-light);
			:not(a) {color: var(--note-title-label-light);}
            &::before {
                background-color: var(--note-title-label-light);
            }
        }
        &:is(.caf,.hcaf,.cff,.hcff,.uaf,.huaf,.cawpf,.hcawpf) {
            color: var(--code-label-light);
			:not(a) {color: var(--code-label-light);}
			&::before {
                background-color: var(--code-label-light);
            }
        }

    }
}