/* Rm.Ui.Core — Shared public-facing UI base styles */

.backdrop-spinner {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9999;
}

.backdrop-spinner.hidden {
    display: none;
}

.clickable {
    cursor: pointer !important;
}

/* Language picker — compact pill trigger (mobile) / dropdown (desktop) */
.lang-mobile { display: none; }

.lang-picker-trigger {
    display: inline-flex; align-items: center; gap: 5px;
    padding: 5px 10px; border-radius: 20px;
    border: 1px solid #dee2e6; background: #fff;
    font-size: .8125rem; font-weight: 600; color: #495057;
    text-decoration: none; line-height: 1;
    transition: border-color .15s, box-shadow .15s;
}
.lang-picker-trigger:hover,
.lang-picker-trigger:focus { border-color: #adb5bd; color: #495057; text-decoration: none; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.lang-picker-trigger::after { display: none; } /* hide Bootstrap's default caret */

.lang-picker-active { font-weight: 600; color: #a68b3c; }

@media (max-width: 575.98px) {
    .lang-mobile { display: block !important; }
    .lang-desktop { display: none !important; }
}

/* >>> quill-content:start
   HOW QUILL'S OUTPUT RENDERS ONCE IT LEAVES THE EDITOR.

   Everything Quill's own stylesheet does is scoped to .ql-editor, so a block that looks correct in
   the admin has NO rules at all on the published page. This region is that missing half, and it is
   duplicated on purpose: core.css serves the per-app storefronts (memorial, kidoo, rtriga, burtini)
   and sections.css serves managed sites, which never load core.css. QuillContentCssContractTests
   fails the build when the two drift.

   Every selector is qualified by a class Quill or quill-table-up emits — .ql-align-*, li[data-list],
   .ql-table — so a theme's own tables, cart tables and account tables are untouched by construction. */

/* Alignment. */
.ql-align-center { text-align: center; }
.ql-align-right { text-align: right; }
.ql-align-justify { text-align: justify; }

/* Quill v2 lists. The marker is a real element (li[data-list] > .ql-ui), not a list-style, so
   without these rules a published bullet list renders with no bullets and a numbered list with no
   numbers. Scoped to li[data-list] so ordinary <ol>/<ul> are untouched. */
ol:has(> li[data-list]) { list-style: none; padding-left: 1.5em; counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9; }
li[data-list] { list-style: none; }
li[data-list] > .ql-ui { display: inline-block; min-width: 1.2em; margin-left: -1.5em; padding-right: .3em; text-align: right; }
li[data-list=bullet]  > .ql-ui::before { content: '\2022'; }
li[data-list=checked] > .ql-ui::before { content: '\2611'; }
li[data-list=unchecked] > .ql-ui::before { content: '\2610'; }
li[data-list=ordered] { counter-increment: list-0; }
li[data-list=ordered] > .ql-ui::before { content: counter(list-0, decimal) '. '; }

/* Quill indents — public render only goes one or two levels deep in practice. */
.ql-indent-1:not(.ql-direction-rtl) { padding-left: 3em; }
.ql-indent-2:not(.ql-direction-rtl) { padding-left: 6em; }
.ql-indent-3:not(.ql-direction-rtl) { padding-left: 9em; }
li.ql-indent-1[data-list=ordered] { counter-increment: list-1; }
li.ql-indent-1[data-list=ordered] > .ql-ui::before { content: counter(list-1, lower-alpha) '. '; }
li.ql-indent-2[data-list=ordered] { counter-increment: list-2; }
li.ql-indent-2[data-list=ordered] > .ql-ui::before { content: counter(list-2, lower-roman) '. '; }

/* Tables (quill-table-up). Borders and padding come from CLASSES, not inline styles, so a table
   published without this region is a grid of unruled, unpadded text — which is what a comparison
   table looked like on every storefront before this existed. */
.ql-table-wrapper { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
table.ql-table { border-collapse: collapse; table-layout: fixed; width: auto; margin: 1em 0; }
table.ql-table[data-full] { width: 100%; }
table.ql-table td,
table.ql-table th { border: 1px solid #d4d4d8; padding: 8px 12px; vertical-align: top; text-align: left; }
table.ql-table th { background: #f4f4f5; font-weight: 600; }
table.ql-table caption { caption-side: top; text-align: left; padding-bottom: .5em; font-size: .9em; opacity: .75; }
/* The cell's content lives one level down; it must not become an inline island. */
.ql-table-cell-inner { display: block; }
.ql-table-cell-inner > :first-child { margin-top: 0; }
.ql-table-cell-inner > :last-child { margin-bottom: 0; }

@media (max-width: 640px) {
    /* A min-width is what makes the wrapper's scroll DO anything. Without it a full-width
       fixed-layout table simply squashes its columns to unreadable slivers and never overflows,
       so the overflow-x above never engages. */
    table.ql-table { min-width: 480px; }
}
/* <<< quill-content:end */
