/** Yusaso Themes Module — shared Widget structure and behavior. */

.public_widget,
.widget_card {
    position: relative;
    display: block;
    isolation: isolate;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    max-width: 100% !important;
    margin: 0;
    padding: 0;
    overflow: hidden;
}

.public_widget_content,
.widget_content {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

/* Canonical reveal-on-interaction scrollbar shared by hydrated Message
   history and every scrollable surface inside a Widget. */
:is(.public_reveal_scrollbar, .public_widget, .public_widget *) {
    scrollbar-color: transparent transparent;
    scrollbar-width: thin;
}

:is(.public_reveal_scrollbar, .public_widget_content, .widget_content, .platform_page_menu_items) {
    scrollbar-gutter: stable;
}

:is(.public_reveal_scrollbar, .public_widget, .public_widget *):is(:hover, :focus-within) {
    scrollbar-color: var(--page-muted-text-color) transparent;
}

:is(.public_reveal_scrollbar, .public_widget, .public_widget *)::-webkit-scrollbar {
    width: .65rem;
}

:is(.public_reveal_scrollbar, .public_widget, .public_widget *)::-webkit-scrollbar-track {
    background-color: transparent;
}

:is(.public_reveal_scrollbar, .public_widget, .public_widget *)::-webkit-scrollbar-thumb {
    background-color: transparent;
    border-radius: 999px;
}

:is(.public_reveal_scrollbar, .public_widget, .public_widget *):is(:hover, :focus-within)::-webkit-scrollbar-thumb {
    background-color: var(--page-muted-text-color);
}

/* KEEP THIS: widget controls may never escape the widget content width. */
.public_widget :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="reset"]):not([type="button"]):not([type="image"]):not([type="range"]):not([type="color"]), select, textarea),
.widget_card :is(input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="reset"]):not([type="button"]):not([type="image"]):not([type="range"]):not([type="color"]), select, textarea) {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
}

/* KEEP THIS: widget inputs use compact readable widths instead of stretching every control. */
.public_widget,
.widget_card {
    --widget-control-small-width: 10rem;
    --widget-control-medium-width: 18rem;
}

.public_widget :is(input[type="date"], input[type="datetime-local"], input[type="time"], input[type="month"], input[type="week"], input[type="number"]),
.widget_card :is(input[type="date"], input[type="datetime-local"], input[type="time"], input[type="month"], input[type="week"], input[type="number"]) {
    width: min(100%, var(--widget-control-small-width));
    max-width: var(--widget-control-small-width);
}

.public_widget :is(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="file"], select),
.widget_card :is(input:not([type]), input[type="text"], input[type="search"], input[type="email"], input[type="password"], input[type="url"], input[type="tel"], input[type="file"], select) {
    width: min(100%, var(--widget-control-medium-width));
    max-width: var(--widget-control-medium-width);
}

.public_widget textarea,
.widget_card textarea {
    width: 100%;
    max-width: 100%;
}

/* Shared advertisement placement geometry; Themes own its presentation. */
.widget_advertisement_placement {
    display: grid;
    box-sizing: border-box;
    min-width: 0;
    height: 15rem;
    min-height: 15rem;
    max-height: 15rem;
    flex: 0 0 15rem;
    padding: 0 !important;
    margin-block-start: 0;
    align-self: start;
    place-items: center;
}

/* KEEP THIS: every non-navigation widget action uses one control geometry. */
.public_widget:not(.widget_communication_connections):not(.messaging_participants):not(.messaging_chat_options_widget) :is(button, input[type="submit"], input[type="reset"], input[type="button"], a.button):not(.widget_navigation_button):not(.public_widget_toggle):not(.widget_toggle),
.widget_card:not(.widget_communication_connections):not(.messaging_participants) :is(button, input[type="submit"], input[type="reset"], input[type="button"], a.button):not(.widget_navigation_button):not(.public_widget_toggle):not(.widget_toggle) {
    display: inline-flex !important;
    box-sizing: border-box !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 2.25rem !important;
    margin: 0 !important;
    padding: .45rem .75rem !important;
    align-items: center !important;
    justify-content: center !important;
    line-height: 1.2 !important;
    white-space: normal !important;
}

.widget_date_range {
    display: grid;
    width: 100%;
    min-width: 0;
    margin: 0;
    gap: .65rem;
}

.widget_date_range_rows,
.persona_date_filter_rows {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
    min-width: 0;
    gap: .3rem;
}

.widget_date_range_rows .widget_form_control + .widget_form_label,
.persona_date_filter_rows .widget_form_control + .widget_form_label {
    margin-top: .35rem;
}

.public_widget .widget_form_label,
.widget_card .widget_form_label {
    box-sizing: border-box;
    min-width: 0;
    margin: 0;
    padding: 0;
    line-height: 1.2;
}

:is(.public_widget, .widget_card) :is(form, fieldset) > .button_bar:last-child {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: .35rem;
}

.public_widget[hidden],
.widget_card[hidden],
.public_widget_content[hidden],
.widget_content[hidden] {
    display: none !important;
}

/* The database default-open setting is authoritative for collapsible widgets. */
details.public_widget:not([open]) > :is(.public_widget_content, .widget_content),
details.widget_card:not([open]) > :is(.public_widget_content, .widget_content) {
    display: none !important;
}

.public_widget_header,
.widget_header {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 2.25rem;
    margin: 0;
    padding: .4rem .55rem;
    align-items: center;
    justify-content: flex-start;
    gap: .5rem;
    list-style: none;
}

summary.public_widget_header,
summary.widget_header,
button.public_widget_header,
button.widget_header,
.widget_toggle {
    cursor: pointer;
}

.public_widget_header::-webkit-details-marker,
.widget_header::-webkit-details-marker {
    display: none;
}

.public_widget_title,
.widget_title {
    min-width: 0;
    margin: 0;
    overflow: hidden;
    font-size: var(--font-md);
    font-weight: var(--font-heading-weight);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Shared widget-heading counts occupy the far edge of the title row. */
:is(.public_widget_title, .widget_title):has(> .counts.align_right) {
    display: flex !important;
    width: 100%;
    align-items: center;
}

:is(.public_widget_title, .widget_title) > .counts.align_right {
    margin-left: auto;
}

.public_widget_toggle,
.widget_toggle {
    position: relative;
    display: grid;
    box-sizing: border-box;
    flex: 0 0 1.5rem;
    width: 1.5rem;
    min-width: 1.5rem;
    max-width: 1.5rem;
    height: 1.5rem;
    min-height: 1.5rem;
    max-height: 1.5rem;
    margin: 0 0 0 auto;
    padding: 0;
    place-items: center;
    order: 99;
    font-size: var(--font-sm);
    line-height: 1;
}

.public_widget_arrow,
.widget_toggle_glyph {
    position: absolute;
    inset: 0;
    display: grid;
    width: 1.5rem;
    height: 1.5rem;
    margin: 0;
    padding: 0;
    place-items: center;
    text-align: center;
}

.public_widget_arrow_closed {
    display: none;
}

.public_widget:not([open]) .public_widget_arrow_open,
.widget_card[aria-expanded="false"] .public_widget_arrow_open {
    display: none;
}

.public_widget:not([open]) .public_widget_arrow_closed,
.widget_card[aria-expanded="false"] .public_widget_arrow_closed {
    display: grid;
}

.public_widget_content,
.widget_content {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: none;
    margin: 0;
    padding: .75rem;
}

.widget_page_navigation .public_widget_content,
.widget_page_navigation .widget_content {
    display: grid;
    gap: .35rem;
}

.widget_page_navigation nav {
    display: grid;
    gap: .35rem;
    min-width: 0;
}

.widget_navigation_button {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    min-height: 2.25rem;
    padding: .55rem .65rem;
    align-items: center;
    gap: .5rem;
    line-height: 1.2;
    text-align: left;
}

/* Reusable center-column page tabs. Real links stay in one touch-scrollable row. */
.widget_presentation_horizontal_tabs {
    display: block;
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    margin: 0 0 1rem;
    padding: 0;
    background: transparent;
    border: 0 !important;
    border-radius: 0;
    box-shadow: none !important;
}
.widget_presentation_horizontal_tabs > .public_widget_header {
    display: none;
}
.widget_presentation_horizontal_tabs > .public_widget_content {
    padding: 0;
}
.widget_presentation_horizontal_tabs .platform_page_menu_items {
    display: flex;
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    gap: .4rem;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-inline: contain;
    scroll-snap-type: inline proximity;
    -webkit-overflow-scrolling: touch;
}
.widget_presentation_horizontal_tabs .widget_navigation_button {
    flex: 0 0 auto;
    width: auto !important;
    min-width: max-content !important;
    white-space: nowrap;
    scroll-snap-align: start;
}

/* Persona content siblings wrap as a compact page tab bar; never create a page scrollbar. */
.persona_profile_tab_widget .platform_page_menu_items {
    flex-wrap: nowrap !important;
    gap: .15rem !important;
    overflow: visible !important;
    overscroll-behavior-inline: auto;
    scroll-snap-type: none;
}

.public_widget.widget_page_navigation.persona_profile_tab_widget .widget_navigation_button {
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 2rem !important;
    padding: .3rem .4rem !important;
    justify-content: center !important;
    font-size: var(--font-sm) !important;
    line-height: 1.1 !important;
    white-space: nowrap;
    scroll-snap-align: none;
}

.widget_navigation_submenu_button {
    padding-inline-start: .5rem;
    font-size: var(--font-sm);
}

/* Generated Widget menus present tier-two links consistently. */
.widget_navigation_level_2 {
    font-style: italic;
}

/**
 * KEEP THIS: one immutable page-menu geometry across every Module. The extra
 * specificity intentionally retires older feature-level !important rules.
 */
.public_widget.widget_page_navigation .widget_navigation_button {
    display: flex !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 2.25rem !important;
    margin: 0 !important;
    padding: .55rem .65rem !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .5rem !important;
    line-height: 1.2 !important;
    text-align: left !important;
    text-decoration: none !important;
}

.public_widget.widget_page_navigation > .public_widget_header,
.public_widget.widget_page_navigation > .widget_header {
    min-height: 2.25rem !important;
    padding: .4rem .55rem !important;
}

.public_widget.widget_page_navigation > .public_widget_content,
.public_widget.widget_page_navigation > .widget_content {
    padding: .75rem !important;
}

.public_widget.widget_page_navigation .widget_navigation_submenu_button {
    min-height: 2rem !important;
    margin: 0 !important;
    padding-block: .4rem !important;
    padding-inline: .5rem .65rem !important;
    text-align: left !important;
}

.platform_page_menu .page_menu_icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 1.25em;
    margin-inline-end: .4rem;
}

/**
 * KEEP THIS: database-backed page menus have one final structural contract.
 * Feature styles may position their grid rail, but must not redefine the menu
 * shell, header, list spacing, item geometry, or submenu indentation.
 */
.public_widget.platform_page_menu {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    overflow-x: hidden !important;
}

.public_widget.platform_page_menu > .public_widget_header {
    display: flex !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    min-height: 2.5rem !important;
    margin: 0 !important;
    padding: .5rem .65rem !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .45rem !important;
}

.public_widget.platform_page_menu > .public_widget_header > .public_widget_title {
    display: flex !important;
    min-width: 0 !important;
    margin: 0 !important;
    align-items: center !important;
    flex: 1 1 auto !important;
    line-height: 1.2 !important;
    text-align: left !important;
}

.public_widget.platform_page_menu > .public_widget_content {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: .5rem !important;
    overflow: hidden !important;
}

.public_widget.platform_page_menu .platform_page_menu_items {
    display: grid !important;
    box-sizing: border-box !important;
    grid-template-columns: minmax(0, 1fr) !important;
    align-content: start !important;
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    gap: .15rem !important;
    overflow: visible !important;
}

/* KEEP THIS: the menu list consumes the complete inner widget width. */
.public_widget.platform_page_menu > .public_widget_content > .platform_page_menu_items {
    inline-size: 100% !important;
    max-inline-size: none !important;
    justify-self: stretch !important;
}

.public_widget.platform_page_menu .platform_page_menu_items > .widget_navigation_button {
    display: flex !important;
    box-sizing: border-box !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 1.65rem !important;
    margin: 0 !important;
    padding: .25rem .35rem !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: .4rem !important;
    line-height: 1.2 !important;
    text-align: left !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
}

.public_widget.platform_page_menu .platform_page_menu_items > .widget_navigation_submenu_button {
    min-height: 2rem !important;
    padding: .4rem .65rem .4rem .5rem !important;
}

/**
 * KEEP THIS: vertical sibling menus are text navigation, never button rows.
 * Horizontal tab Widgets retain their separate tab presentation above.
 */
.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items {
    gap: .15rem !important;
}

.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_button {
    appearance: none !important;
    min-height: 1.65rem !important;
    padding: .25rem .35rem !important;
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    font-size: 1em !important;
    font-style: normal !important;
    font-weight: 700 !important;
}

/*
 * Canonical vertical Widget-menu marker column. Every row reserves the same
 * marker width, so the active-page arrow never shifts labels. Submenu depth
 * is added outside that column and therefore remains aligned at every tier.
 */
.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_button::before {
    content: "";
    display: inline-block;
    flex: 0 0 1.15rem;
    width: 1.15rem;
    min-width: 1.15rem;
    text-align: center;
}

.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_button:is([aria-current="page"],[aria-selected="true"],.is_selected)::before {
    content: "\27A4";
}

.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_level_2 {
    padding-inline-start: .85rem !important;
    font-size: var(--font-sm) !important;
    font-style: italic !important;
    font-weight: 400 !important;
}

.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_level_3 {
    padding-inline-start: 2.2rem !important;
    font-size: var(--font-sm) !important;
    font-style: italic !important;
    font-weight: 400 !important;
}

/* Page anchors are tertiary navigation beneath the active sibling page. */
.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_page_bookmark {
    padding-inline-start: 2.2rem !important;
}

.public_widget:is(.platform_page_menu,.widget_page_navigation):not(.widget_presentation_horizontal_tabs) .platform_page_menu_items > .widget_navigation_button:is(:hover, :focus-visible, [aria-current="page"], [aria-selected="true"], .is_selected) {
    background: transparent !important;
    background-image: none !important;
    border: 0 !important;
    box-shadow: none !important;
    text-decoration: underline !important;
    text-underline-offset: .16em;
}

/* RETIRED 2026-08-28: page-menu renderers no longer emit widget_navigation_icon.
.widget_navigation_icon {
    display: inline-grid;
    box-sizing: border-box;
    flex: 0 0 1em;
    width: 1em;
    height: 1em;
    place-items: center;
    font-size: 1em;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
}
*/

/* Horizontal page/tab menus are independent from vertical Widget menus. */
.widget_presentation_horizontal_tabs,.horizontal_page_tab_menu{display:block!important;width:100%!important;min-width:0!important;overflow:hidden!important;border:0!important;box-shadow:none!important}
.widget_presentation_horizontal_tabs>:is(.public_widget_header,.widget_header),.horizontal_page_tab_menu>:is(.public_widget_header,.widget_header){display:none!important}
.widget_presentation_horizontal_tabs>:is(.public_widget_content,.widget_content),.horizontal_page_tab_menu>:is(.public_widget_content,.widget_content){padding:0!important;overflow:hidden!important}
.widget_presentation_horizontal_tabs .platform_page_menu_items,.horizontal_page_tab_menu .platform_page_menu_items{display:flex!important;width:100%!important;min-width:0!important;gap:.2rem!important;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin;white-space:nowrap!important}
.widget_presentation_horizontal_tabs .widget_navigation_button,.horizontal_page_tab_menu .widget_navigation_button{flex:1 1 0!important;width:auto!important;min-width:max-content!important;max-width:none!important;padding:.35rem .5rem!important;justify-content:center!important;white-space:nowrap!important}
.public_widget input[type="file"],.widget_card input[type="file"]{width:100%!important;max-width:100%!important;height:2.45rem!important;min-height:2.45rem!important;max-height:2.45rem!important;padding:.2rem!important;font-size:var(--font-sm)!important}
.public_widget input[type="file"]::file-selector-button,.widget_card input[type="file"]::file-selector-button{width:auto!important;min-width:max-content!important;max-width:none!important;margin-inline-end:.45rem!important;padding:.35rem .55rem!important}