@import url('address.css');
@import url('login.css');
@import url('guest.css');

/* MudBlazor's own .mud-input rule hardcodes line-height:1.1876em (relative to the
   input's own font-size), so shrinking the form font-size via Typography also shrinks
   the input's box height, which throws off the floating label's fixed-pixel position.
   Restore the original ~19px line-height (1.1876 * 16px) using rem so it stays
   independent of the smaller input font-size. */
.mud-input {
    line-height: 1.1876rem;
}

/* Bump hyperlink text (row/card names in listing pages) up slightly from the
   reduced base form font size, for better readability/tap targets. */
.mud-link {
    font-size: 13px;
}

/* Match all listing/table column values (MudTable hardcodes .875rem/14px) to the
   same 13px as the hyperlink text above, so link and non-link columns line up. */
.mud-table-cell {
    font-size: 13px;
}

/* Drawer-style Add/Edit dialog: opt-in via <MudDialog Class="drawer-dialog">, paired
   with DialogOptions { Position = DialogPosition.CenterRight } so the container
   anchors it to the right edge. The container's default centerright padding/centering
   is overridden here so the panel spans full height flush with the viewport edge. */
.mud-dialog-centerright:has(.drawer-dialog) {
    padding-right: 0 !important;
    align-items: stretch !important;
}

.drawer-dialog {
    height: 100vh !important;
    max-height: 100vh !important;
    margin: 0 !important;
    border-radius: 0 !important;
    animation: drawer-dialog-slide-in 0.25s ease-out;
}

@keyframes drawer-dialog-slide-in {
    from { transform: translateX(100%); }
    to { transform: translateX(0); }
}

/* Floating labels on every form field app-wide (search bars, Add/Edit forms and
   dialogs) - MudBlazor hardcodes this at 1rem/16px, so it doesn't follow our Body1/
   Subtitle1 Typography change. When a field is empty, this label sits in the same
   resting position a placeholder would, so it needs to match the 13px value text. */
.mud-input-label {
    /* !important needed: MudBlazor's own label rule chains 3 classes via child
       combinators (higher specificity than a plain 2-class selector). */
    font-size: 13px !important;
}

/* Tips popover (MyAvailabilities) - global because MudPopover may render outside scoped CSS */
.tips-popover,
.tips-popover * {
    box-sizing: border-box;
}

.tips-popover,
.tips-popover.mud-popover-open,
.tips-popover .mud-popover,
.tips-popover .mud-paper,
.tips-popover .mud-popover-content {
    width: auto !important;
    min-width: 280px !important;
    max-width: min(420px, 90vw) !important;
}

.tips-popover-text {
    white-space: normal !important;
    word-break: break-word;
}

/* Fullscreen transparent overlay to close tips popover on outside click */
.tips-popover-overlay {
    position: fixed;
    inset: 0;
    background: transparent;
    z-index: 1200;
}

/* Branch dashboard panel shared styles */
.branch-panel{
    background:#fff;
    border:1px solid rgba(0,0,0,0.06);
    border-radius:3px;
    overflow:hidden;
}

.branch-panel__header{
    padding:16px 18px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.branch-panel__header--tight{
    padding:14px 18px;
}

.branch-panel__title{
    font-weight:700;
}

/* MySessions - expanded child row table header */
.child-row-header {
    background-color: #bcdcf7 !important;
}

/* Light-grey grid header (used in ManageSessionLines services/treatments tables) */
.grid-header-light-grey {
    background-color: #f5f5f5 !important;
}

/* Table alignment utilities */
.text-right {
    text-align: right !important;
}

.text-center {
    text-align: center !important;
}

.text-phone {
    font-size: .875rem !important;
    text-align: start !important;
}