/* 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 alignment — works outside the .ql-editor context */
.ql-align-center { text-align: center; }
.ql-align-right { text-align: right; }
.ql-align-justify { text-align: justify; }

/* Quill v2 list rendering — works on public pages where Quill HTML is rendered
   via Html.Raw. The admin editor already styles these via the .ql-editor-scoped
   rules in quill.css; these unscoped rules let the same markup render correctly
   on storefronts. Scoped to li[data-list] so non-Quill <ol>/<ul> lists 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) '. '; }