/* =========================================================
   LM UI – Refactor (tokens + wspólna baza + poprawki)
   (wersja z !important pod nadpisanie Bootstrapa)
   ========================================================= */

/* ====== TOKENS / THEME ====== */
:root {
    --lm-font: Roboto, system-ui, -apple-system, Segoe UI, Arial, sans-serif;

    --lm-primary: rgba(17, 14, 179, 1);
    --lm-primary-ink: rgba(17, 14, 179, .9);
    --lm-primary-bg: rgba(17, 14, 179, .08);
    --lm-primary-border: rgba(17, 14, 179, .45);

    --lm-accent: rgba(230, 178, 7, .9);
    --lm-danger: rgba(199, 26, 26, .9);
    --lm-success: rgba(87, 235, 100, .9);
    --lm-white: #fff;
    --lm-white-90: rgba(255, 255, 255, .9);
    --lm-white-75: rgba(255, 255, 255, .75);
    --lm-white-35: rgba(255, 255, 255, .35);
    --lm-white-30: rgba(255, 255, 255, .30);
    --lm-white-25: rgba(255, 255, 255, .25);
    --lm-ink: #212529;

    --lm-rad: .6rem;
    --lm-padY: .34rem;
    --lm-padX: .2rem;
    --lm-gutter: .24rem;

    --lm-col-icon: 2.6rem;
    --lm-col-check: 2.6rem;
    --lm-col-end: 1.2rem;

    --lm-label-sm: .65rem;
    --lm-note-sm: .5rem;
    --lm-input-h: 1.3rem;

    --lm-focus-ring: 0 0 0 .2rem rgba(17, 14, 179, .25);
}



/* ====== BAZA ====== */
.LM_BLOCK {
    display: grid !important;
    column-gap: 0 !important;
    align-items: center !important;
    margin: .2rem var(--lm-gutter) !important;
    padding: var(--lm-padY) var(--lm-padX) !important;
    font-family: var(--lm-font) !important;
    border-left: .15rem solid var(--lm-primary-border) !important;
    background: var(--lm-primary-bg) !important;
    border-radius: var(--lm-rad) !important;
}

.LM_BLOCK--switch {
    grid-template-columns: var(--lm-col-icon) var(--lm-col-check) 1fr var(--lm-col-end) !important;
    column-gap: .2rem !important;
}

.LM_BLOCK--item {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
}

.LM_BLOCK--indented {
    padding-left: 1.44rem !important;
}

.LM_BLOCK--indented-2 {
    padding-left: 2.64rem !important;
}

/* Ikony */
.LM_ICON {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: .8rem !important;
    width: var(--lm-col-icon) !important;
    height: var(--lm-col-icon) !important;
    text-align: center !important;
    color: var(--lm-accent) !important;
}

.LM_ICON--danger {
    color: var(--lm-accent) !important;
}

.LM_ICON--success {
    color: var(--lm-accent) !important;
}

/* Teksty */
.LM_LABEL {
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 .36rem !important;
    padding: 0 !important;
}

.LM_LABEL--strong {
    font-weight: 700 !important;
}

.LM_NOTE {
    margin: 0 .42rem !important;
    padding: 0 !important;
    color: var(--lm-white) !important;
    -webkit-text-fill-color: var(--lm-white) !important;
    -webkit-text-stroke: .1px #000 !important;
    text-shadow: 0 0 5px #000, 0 0 5px #000 !important;
    letter-spacing: .06rem !important;
    opacity: .85 !important;
    font-size: var(--lm-note-sm) !important;
    line-height: 1.1 !important;
    font-family: var(--lm-font) !important;
}

/* Input (bazowy) */
.LM_INPUT,
.LM_INPUT:focus,
.LM_INPUT:focus-visible {
    display: block !important;
    width: 100% !important;
    height: var(--lm-input-h) !important;
    line-height: var(--lm-input-h) !important;
    text-align: left !important;
    margin: 0 !important;
    padding: .125rem .5rem !important;
    font-size: .675rem !important;
    font-weight: 400 !important;
    color: var(--lm-ink) !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    appearance: none !important;
    border-radius: .3rem !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.LM_INPUT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}

/* ====== RADIO ====== */
.LM_RADIO_INPUT,
.LM_RADIO,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT {
    appearance: none !important;
    display: inline-block !important;
    --lm-radio-size: 1rem;
    width: var(--lm-radio-size) !important;
    height: var(--lm-radio-size) !important;
    margin: .34rem 0 .34rem .34rem !important;
    vertical-align: middle !important;
    border-radius: 50% !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    outline: none !important;
    box-shadow: none !important;
    position: relative !important;
    transition: border-color .15s ease, background-color .15s ease, box-shadow .15s ease !important;
}

.LM_RADIO_INPUT:hover,
.LM_RADIO:hover,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:hover {
    background-color: var(--lm-white-35) !important;
    border-color: var(--lm-white-90) !important;
}

.LM_RADIO_INPUT:focus-visible,
.LM_RADIO:focus-visible,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}

.LM_RADIO_INPUT:checked,
.LM_RADIO:checked,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:checked {
    border-color: var(--lm-white-90) !important;
    background-color: var(--lm-white-30) !important;
}

/* „ptaszek” */
.LM_RADIO_INPUT::before,
.LM_RADIO_INPUT::after,
.LM_RADIO::before,
.LM_RADIO::after,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT::before,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT::after {
    content: "" !important;
    position: absolute !important;
    --lm-radio-tick-left: 88%;
    --lm-radio-tick-top: 60%;
    left: var(--lm-radio-tick-left) !important;
    top: var(--lm-radio-tick-top) !important;
    --lm-radio-tick-w: 1.05rem;
    --lm-radio-tick-h: .56rem;
    width: var(--lm-radio-tick-w) !important;
    height: var(--lm-radio-tick-h) !important;
    transform-origin: left center !important;
    transform: translate(-50%, -58%) rotate(-45deg) scale(0) !important;
    transition: transform .16s ease-out !important;
    background: transparent !important;
}

.LM_RADIO_INPUT::before,
.LM_RADIO::before,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT::before {
    border-left: .16rem solid #fff !important;
    border-bottom: .16rem solid #fff !important;
    z-index: 0 !important;
}

.LM_RADIO_INPUT::after,
.LM_RADIO::after,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT::after {
    border-left: .14rem solid var(--lm-accent) !important;
    border-bottom: .14rem solid var(--lm-accent) !important;
    z-index: 5 !important;
}

.LM_RADIO_INPUT:checked::before,
.LM_RADIO_INPUT:checked::after,
.LM_RADIO:checked::before,
.LM_RADIO:checked::after,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:checked::before,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:checked::after {
    transform: translate(-50%, -58%) rotate(-45deg) scale(1.06) !important;
}

.LM_RADIO_INPUT:disabled,
.LM_RADIO:disabled,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:disabled {
    opacity: .45 !important;
    cursor: not-allowed !important;
}

.LM_RADIO_INPUT:disabled::after,
.LM_RADIO:disabled::after,
.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_INPUT:disabled::after {
    border-left-color: rgba(255, 255, 255, .65) !important;
    border-bottom-color: rgba(255, 255, 255, .65) !important;
}

/* ====== KAFLE WSPÓLNE ====== */
.LM_BLOCK_PRIMARY_SWITCH,
.LM_BLOCK_SECONDARY_SWITCH,
.LM_BLOCK_TERTIARY_SWITCH,
.LM_BLOCK_SECONDARY_ITEM_INPUT,
.LM_BLOCK_TERTIARY_ITEM_INPUT,
.LM_BLOCK_SECONDARY_ITEM_RADIO,
.LM_BLOCK_TERTIARY_ITEM_RADIO,
.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE,
.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE {
    display: grid !important;
    column-gap: 0 !important;
    align-items: center !important;
    margin: .2rem var(--lm-gutter) !important;
    padding: var(--lm-padY) var(--lm-padX) !important;
    font-family: var(--lm-font) !important;
    border-left: .15rem solid var(--lm-primary-border) !important;
    background: var(--lm-primary-bg) !important;
    border-radius: var(--lm-rad) !important;
}

/* PRIMARY SWITCH */
.LM_BLOCK_PRIMARY_SWITCH {
    grid-template-columns: var(--lm-col-icon) var(--lm-col-check) 1fr var(--lm-col-end) !important;
    grid-auto-rows: var(--lm-col-icon) !important;
    /* stała wysokość */
    padding-left: 0 !important;
}

.LM_BLOCK_PRIMARY_SWITCH_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    width: var(--lm-col-icon) !important;
    height: var(--lm-col-icon) !important;
    color: var(--lm-accent) !important;
}

/* SECONDARY SWITCH */
.LM_BLOCK_SECONDARY_SWITCH {
    grid-template-columns: var(--lm-col-icon) var(--lm-col-check) 1fr var(--lm-col-end) !important;
    grid-auto-rows: var(--lm-col-icon) !important;
    padding-left: 1.44rem !important;
}

.LM_BLOCK_SECONDARY_SWITCH_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    width: var(--lm-col-icon) !important;
    height: var(--lm-col-icon) !important;
    color: var(--lm-accent) !important;
}

/* TERTIARY SWITCH */
.LM_BLOCK_TERTIARY_SWITCH {
    grid-template-columns: var(--lm-col-icon) var(--lm-col-check) 1fr var(--lm-col-end) !important;
    grid-auto-rows: var(--lm-col-icon) !important;
    padding-left: 2.64rem !important;
}

.LM_BLOCK_TERTIARY_SWITCH_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    width: var(--lm-col-icon) !important;
    height: var(--lm-col-icon) !important;
    color: var(--lm-accent) !important;
}

/* Kol.2 – reset Bootstrapa */
.LM_BLOCK_PRIMARY_SWITCH .form-check,
.LM_BLOCK_SECONDARY_SWITCH .form-check,
.LM_BLOCK_TERTIARY_SWITCH .form-check {
    padding-left: 0 !important;
    margin: 0 !important;
    display: grid !important;
    place-items: center !important;
    height: var(--lm-col-icon) !important;
}

.LM_BLOCK_PRIMARY_SWITCH .form-check-input,
.LM_BLOCK_SECONDARY_SWITCH .form-check-input,
.LM_BLOCK_TERTIARY_SWITCH .form-check-input {
    margin: 0 !important;
    float: none !important;
    position: static !important;
    width: 2.2rem !important;
    height: 1.2rem !important;
    align-self: center !important;
}

/* Kol.3 — label (single-line) — bez min-height */
.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL,
.LM_BLOCK_SECONDARY_SWITCH_COL03_LABEL,
.LM_BLOCK_TERTIARY_SWITCH_COL03_LABEL,
.LM_BLOCK_PRIMARY_SWITCH label,
.LM_BLOCK_SECONDARY_SWITCH label,
.LM_BLOCK_TERTIARY_SWITCH label {
    display: flex !important;
    align-items: center !important;

    /* zamiast min-height — pełna wysokość wiersza grida */
    height: 100% !important;
    align-self: stretch !important;

    margin: 0 .36rem !important;
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
    line-height: 1.1 !important;
    overflow: hidden !important;
}

.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL,
.LM_BLOCK_PRIMARY_SWITCH label {
    font-weight: 700 !important;
}

.LM_BLOCK_SECONDARY_SWITCH_COL03_LABEL,
.LM_BLOCK_SECONDARY_SWITCH label,
.LM_BLOCK_TERTIARY_SWITCH_COL03_LABEL,
.LM_BLOCK_TERTIARY_SWITCH label {
    font-weight: 500 !important;
}

/* Kol.3 — wariant z INFO (label + opis po 50%) */
.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL_INFO,
.LM_BLOCK_SECONDARY_SWITCH_COL03_LABEL_INFO,
.LM_BLOCK_TERTIARY_SWITCH_COL03_LABEL_INFO {
    display: grid !important;
    grid-template-rows: 1fr 1fr !important;
    align-items: center !important;
    justify-items: start !important;
    align-self: stretch !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    row-gap: 0 !important;
}

.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL_INFO_ROW01,
.LM_BLOCK_SECONDARY_SWITCH_COL03_LABEL_INFO_ROW01,
.LM_BLOCK_TERTIARY_SWITCH_COL03_LABEL_INFO_ROW01 {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    font-size: var(--lm-label-sm) !important;
    font-weight: 500 !important;
    line-height: 1.05 !important;
    margin: 0 .36rem !important;
    padding: 0 !important;
}

.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL_INFO_ROW01 {
    font-weight: 700 !important;
}

.LM_BLOCK_PRIMARY_SWITCH_COL03_LABEL_INFO_ROW02,
.LM_BLOCK_SECONDARY_SWITCH_COL03_LABEL_INFO_ROW02,
.LM_BLOCK_TERTIARY_SWITCH_COL03_LABEL_INFO_ROW02 {
    display: flex !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0 .42rem !important;
    padding: 0 !important;
    color: var(--lm-white) !important;
    -webkit-text-fill-color: var(--lm-white) !important;
    -webkit-text-stroke: .1px #000 !important;
    text-shadow: 0 0 5px #000, 0 0 5px #000 !important;
    letter-spacing: .06rem !important;
    opacity: .85 !important;
    font-size: var(--lm-note-sm) !important;
    line-height: 1.05 !important;
    font-family: var(--lm-font) !important;
}

/* ====== SECONDARY ITEM INPUT ====== */
.LM_BLOCK_SECONDARY_ITEM_INPUT {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1.8rem 1.2rem !important;
    padding-left: 1.44rem !important;
    align-items: center !important;
}

.LM_BLOCK_SECONDARY_ITEM_INPUT_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
}

.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}








.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW02_DIV_INPUT {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW02_INPUT,
.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW02_INPUT:focus,
.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW02_INPUT:focus-visible {
    display: block !important;
    width: 100% !important;
    height: 1.4rem !important;
    line-height: 1.4rem !important;
    margin: 0 !important;
    padding: .125rem .5rem !important;
    font-size: .675rem !important;
    font-weight: 400 !important;
    color: var(--lm-ink) !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    appearance: none !important;
    border-radius: .3rem !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW02_INPUT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}






.LM_BLOCK_SECONDARY_ITEM_INPUT_COL02_ROW03_DIV_INFO {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin: 0 .42rem !important;
    padding: 0 !important;
    color: var(--lm-white) !important;
    -webkit-text-fill-color: var(--lm-white) !important;
    -webkit-text-stroke: .1px #000 !important;
    text-shadow: 0 0 5px #000, 0 0 5px #000 !important;
    letter-spacing: .06rem !important;
    opacity: .85 !important;
    font-size: var(--lm-note-sm) !important;
    line-height: 1.15 !important;
    font-family: var(--lm-font) !important;
}

/* Ikona surowca POD strzałką (kol.1, wiersze 2–3) */
.LM_BLOCK_SECONDARY_ITEM_INPUT_COL01_ROW02_IMAGE {
    grid-column: 1 !important;
    grid-row: 2 / span 2 !important;
    justify-self: center !important;
    align-self: center !important;
    display: grid !important;
    place-items: center !important;
    width: var(--lm-col-icon) !important;
    height: 100% !important;
}

.LM_BLOCK_SECONDARY_ITEM_INPUT_COL01_ROW02_IMAGE img {
    display: block !important;
    width: auto !important;
    height: 1.4rem !important;
    object-fit: contain !important;
}

/*--------------------------------------------------------------------*/

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1.8rem !important;
    padding-left: 6.15rem !important;
    align-items: center !important;
}

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
}

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW02_DIV_INPUT_SELECT {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW02_INPUT_SELECT,
.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW02_INPUT_SELECT:focus,
.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW02_INPUT_SELECT:focus-visible {
    display: block !important;
    width: 100% !important;
    height: 1.4rem !important;
    line-height: 1.4rem !important;
    margin: 0 !important;
    padding: .125rem .5rem !important;
    font-size: .675rem !important;
    font-weight: 400 !important;
    color: var(--lm-ink) !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    appearance: none !important;
    border-radius: .3rem !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.LM_BLOCK_QUATERNARY_ITEM_INPUT_SELECT_COL02_ROW02_INPUT_SELECT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}









/* ====== TERTIARY ITEM INPUT ====== */
.LM_BLOCK_TERTIARY_ITEM_INPUT {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1.8rem 1.2rem !important;
    padding-left: 2.64rem !important;
    align-items: center !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW02_DIV_INPUT {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW02_INPUT,
.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW02_INPUT:focus,
.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW02_INPUT:focus-visible {
    display: block !important;
    width: 100% !important;
    height: 1.4rem !important;
    line-height: 1.4rem !important;
    margin: 0 !important;
    padding: .125rem .5rem !important;
    font-size: .675rem !important;
    font-weight: 400 !important;
    color: var(--lm-ink) !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    appearance: none !important;
    border-radius: .3rem !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW02_INPUT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL02_ROW03_DIV_INFO {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin: 0 .42rem !important;
    padding: 0 !important;
    color: var(--lm-white) !important;
    -webkit-text-fill-color: var(--lm-white) !important;
    -webkit-text-stroke: .1px #000 !important;
    text-shadow: 0 0 5px #000, 0 0 5px #000 !important;
    letter-spacing: .06rem !important;
    opacity: .85 !important;
    font-size: var(--lm-note-sm) !important;
    line-height: 1.15 !important;
    font-family: var(--lm-font) !important;
}

/* Ikona surowca pod strzałką (kol.1, wiersze 2–3) – TERTIARY */
.LM_BLOCK_TERTIARY_ITEM_INPUT_COL01_ROW02_IMAGE {
    grid-column: 1 !important;
    grid-row: 2 / span 2 !important;
    justify-self: center !important;
    align-self: center !important;
    display: grid !important;
    place-items: center !important;
    width: var(--lm-col-icon) !important;
    height: 100% !important;
}

.LM_BLOCK_TERTIARY_ITEM_INPUT_COL01_ROW02_IMAGE img {
    display: block !important;
    width: auto !important;
    height: 1.4rem !important;
    object-fit: contain !important;
}














/* ====== QUATERNARY ITEM INPUT ====== */
.LM_BLOCK_QUATERNARY_ITEM_RADIO {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1.8rem 1.2rem !important;
    padding-left: 3.25rem !important;
    align-items: center !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW02_DIV_INPUT {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW02_INPUT,
.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW02_INPUT:focus,
.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW02_INPUT:focus-visible {
    display: block !important;
    width: 100% !important;
    height: 1.4rem !important;
    line-height: 1.4rem !important;
    margin: 0 !important;
    padding: .125rem .5rem !important;
    font-size: .675rem !important;
    font-weight: 400 !important;
    color: var(--lm-ink) !important;
    background-color: var(--lm-white-25) !important;
    border: .0425rem solid var(--lm-white-75) !important;
    appearance: none !important;
    border-radius: .3rem !important;
    outline: none !important;
    box-shadow: none !important;
    transition: border-color .15s ease, box-shadow .15s ease !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW02_INPUT:focus-visible {
    box-shadow: var(--lm-focus-ring) !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL02_ROW03_DIV_INFO {
    grid-column: 2 !important;
    grid-row: 3 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin: 0 .42rem !important;
    padding: 0 !important;
    color: var(--lm-white) !important;
    -webkit-text-fill-color: var(--lm-white) !important;
    -webkit-text-stroke: .1px #000 !important;
    text-shadow: 0 0 5px #000, 0 0 5px #000 !important;
    letter-spacing: .06rem !important;
    opacity: .85 !important;
    font-size: var(--lm-note-sm) !important;
    line-height: 1.15 !important;
    font-family: var(--lm-font) !important;
}

/* Ikona surowca pod strzałką (kol.1, wiersze 2–3) – QUATERNARY */
.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL01_ROW02_IMAGE {
    grid-column: 1 !important;
    grid-row: 2 / span 2 !important;
    justify-self: center !important;
    align-self: center !important;
    display: grid !important;
    place-items: center !important;
    width: var(--lm-col-icon) !important;
    height: 100% !important;
}

.LM_BLOCK_QUATERNARY_ITEM_RADIO_COL01_ROW02_IMAGE img {
    display: block !important;
    width: auto !important;
    height: 1.4rem !important;
    object-fit: contain !important;
}



















/* ====== SECONDARY ITEM RADIO ====== */
.LM_BLOCK_SECONDARY_ITEM_RADIO {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1fr !important;
    padding-left: 1.44rem !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL01_ICON {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
    text-align: center !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL {
    display: grid !important;
    row-gap: .2rem !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_LABEL {
    display: grid !important;
    grid-template-columns: 2rem 1fr !important;
    grid-template-rows: 2rem !important;
    justify-content: flex-start !important;
    align-items: center !important;
}

.LM_BLOCK_SECONDARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_LABEL_SPAN {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    align-self: center !important;
    font-size: .675rem !important;
    font-weight: 500 !important;
    user-select: none !important;
    cursor: pointer !important;
}




/* ====== TERTIARY ITEM RADIO ====== */
.LM_BLOCK_TERTIARY_ITEM_RADIO {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1fr !important;
    padding-left: 3.75rem !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL01_ICON {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    font-size: .8rem !important;
    color: var(--lm-accent) !important;
    width: var(--lm-col-icon) !important;
    height: 1.4rem !important;
    text-align: center !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL {
    display: grid !important;
    row-gap: .2rem !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_LABEL {
    display: grid !important;
    grid-template-columns: 2rem 1fr !important;
    grid-template-rows: 2rem !important;
    justify-content: flex-start !important;
    align-items: center !important;
}

.LM_BLOCK_TERTIARY_ITEM_RADIO_COL02_ROW02_DIV_RADIO_GROUP_COL_LABEL_SPAN {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    align-self: center !important;
    font-size: .675rem !important;
    font-weight: 500 !important;
    user-select: none !important;
    cursor: pointer !important;
}

/* ====== SECONDARY ITEM CHOOSE IMAGE ====== */
.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1fr !important;
    padding-left: 1.44rem !important;
}

.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE_COL02_ROW02_DIV {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE_COL02_ROW02_DIV>img {
    margin: var(--lm-gutter) !important;
    padding: 0 !important;
    height: 2rem !important;
    width: auto !important;
    display: block !important;
}

/* ====== TERTIARY ITEM CHOOSE IMAGE ====== */
.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE {
    grid-template-columns: var(--lm-col-icon) 1fr var(--lm-col-end) !important;
    grid-template-rows: 1.4rem 1fr !important;
    padding-left: 2.64rem !important;
}

.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE_COL02_ROW01_LABEL {
    grid-column: 2 !important;
    grid-row: 1 !important;
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE_COL02_ROW02_DIV {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: flex-start !important;
    align-items: center !important;
    font-weight: 500 !important;
    font-size: var(--lm-label-sm) !important;
    margin: 0 var(--lm-gutter) !important;
    padding: 0 !important;
}

.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE_COL02_ROW02_DIV>img {
    margin: var(--lm-gutter) !important;
    padding: 0 !important;
    height: 2rem !important;
    width: auto !important;
    display: block !important;
}

/* ====== HEROES ====== */
.LM_BLOCK_PRIMARY_HEROES {
    grid-column: 2 !important;
    grid-row: 2 !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    margin: .2rem var(--lm-gutter) !important;
    font-family: var(--lm-font) !important;
}

.LM_BLOCK_PRIMARY_HEROES .LM_HERO_TILE {
    position: relative !important;
    width: 3.2rem !important;
    height: 3.2rem !important;
    margin: .18rem !important;
    flex: 0 0 auto !important;
}

.LM_BLOCK_PRIMARY_HEROES .LM_HERO_TILE{
  position: relative !important;
}

/* ramka pełny obszar */
.LM_BLOCK_PRIMARY_HEROES .LM_HERO_TILE_FRAME{
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  pointer-events: none !important;
  z-index: 2 !important;
  object-fit: contain !important;
}

/* bohater 86% WYŚRODKOWANY absolutem */
.LM_BLOCK_PRIMARY_HEROES .LM_HERO_TILE_IMG{
  position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  width: 86% !important;
  height: 86% !important;
  object-fit: contain !important;
  cursor: pointer !important;
  z-index: 1 !important;
}

/* ====== CHOOSE IMAGE – ikona w kolumnie 1 (secondary / tertiary) ====== */
.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE_COL01_ICON,
.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE_COL01_ICON {
    display: grid !important;
    place-items: center !important;
    width: var(--lm-col-icon) !important;
    height: var(--lm-col-icon) !important;
    line-height: 0 !important;
    font-size: .8rem !important;
}

.LM_BLOCK_SECONDARY_ITEM_CHOOSE_IMAGE_COL01_ICON {
    color: var(--lm-accent) !important;
}

.LM_BLOCK_TERTIARY_ITEM_CHOOSE_IMAGE_COL01_ICON {
    color: var(--lm-accent) !important;
}

/* =========================================================
   Kolory grade + font + obwódka tekstu
   (wkleić na koniec istniejącego CSS)
   ========================================================= */
:root {
    /* Domyślna czcionka */
    --lm-font: Roboto, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;

    /* Kolory nazw dla grade */
    --grade-color-default: #c7c7c7;
    --grade-color-uncommon: #4bd462;
    --grade-color-rare: #74a5ff;
    --grade-color-epic: #c37df9;
    --grade-color-legendary: #f3d84e;
    --grade-color-mythic: #ff8328;

    /* Szerokość obwódki tekstu */
    --text-outline-w: 1.6px;
}

/* Wszystkie napisy w drugim modalu (kuźni) – font + obwódka */
.Forge_Content,
.Forge_Content * {
    font-family: var(--lm-font);
    /* Safari/iOS (primary) */
    -webkit-text-stroke: var(--text-outline-w) #000;
    -webkit-text-fill-color: currentColor;
    /* Fallback (pozostałe przeglądarki) */
    text-shadow:
        0 0.025px 0 #000, 0 -0.025px 0 #000,
        0.025px 0 0 #000, -0.025px 0 0 #000,
        0.025px 0.025px 0 #000, -0.025px 0.025px 0 #000,
        0.025px -0.025px 0 #000, -0.025px -0.025px 0 #000;
}

/* Nazwa itemu – domyślnie kolor Common */
.Forge_Content .Item_Name {
    color: var(--grade-color-default);
}

/* Przełączanie koloru nazwy po grade (sterowane data-grade na .Forge_Content) */
.Forge_Content[data-grade="Common"] .Item_Name {
    color: var(--grade-color-default);
}

.Forge_Content[data-grade="Uncommon"] .Item_Name {
    color: var(--grade-color-uncommon);
}

.Forge_Content[data-grade="Rare"] .Item_Name {
    color: var(--grade-color-rare);
}

.Forge_Content[data-grade="Epic"] .Item_Name {
    color: var(--grade-color-epic);
}

.Forge_Content[data-grade="Legendary"] .Item_Name {
    color: var(--grade-color-legendary);
}

.Forge_Content[data-grade="Mythic"] .Item_Name {
    color: var(--grade-color-mythic);
}



.HEROES_LIST {
    /* border: 1px dashed #CCC; */
    position: relative;
    margin-right: 50px;
}

.HEROES_LIST>div {
    display: flex;
    background: transparent;
    position: absolute;
    height: 48px;
    width: 48px;
    font-size: 0.7em;
    align-items: center;
    align-content: center;
    justify-content: center;
    justify-items: center;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;
}

.HEROES_LIST>div>div {
    display: flex;
    position: absolute;
    height: 40px;
    width: 40px;
    align-items: end;
    align-content: center;
    justify-content: center;
    justify-items: center;
    background-size: 100%;
    background-position: center;
    background-repeat: no-repeat;

}

.HEROES_LIST>.ss-placeholder-child {
    background: transparent;
    border: 0.5px dotted rgba(0, 17, 255, 0.788);
}


.LM_HERO_TILE_FRAME.is-off {
    filter: grayscale(1) !important;
    opacity: 1 !important
}

.LM_HERO_TILE_IMG.is-off {
    filter: grayscale(1) !important;
    opacity: .55 !important
}


/* ukrycie niezależne od cudzych !important */
.lm-hidden { display: none !important; }

/* Stała animacja (zostaje na elemencie na stałe) */
.lm-fade {
  transition: filter .15s linear, opacity .15s linear;
  will-change: filter, opacity;
}

/* Stan wygaszony (włącz/wyłącz – to będzie animowane dzięki .lm-fade) */
.lm-dim {
  filter: grayscale(100%);
  opacity: .55 !important;
}