html.ui-v2-miara-open,
html.ui-v2-miara-open body { overflow: hidden; overscroll-behavior: none; }

.ui-v2-miara-trigger {
    position: fixed;
    z-index: 35;
    inset-inline-end: var(--ui-v2-shell-fab-offset, max(14px, calc((100vw - min(100vw, 430px)) / 2 + 14px)));
    inset-block-end: calc(96px + env(safe-area-inset-bottom));
    display: grid;
    inline-size: 64px;
    block-size: 64px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 10px 28px rgb(19 27 46 / 18%);
    cursor: pointer;
}

.ui-v2-miara-trigger__ring {
    position: absolute;
    inset: -3px;
    border: 2px solid #f7a270;
    border-radius: 50%;
    animation: ui-v2-miara-pulse 2.6s ease-out infinite;
}

.ui-v2-miara-trigger__avatar {
    grid-area: 1 / 1;
    inline-size: 56px;
    block-size: 56px;
    border: 2px solid #f65505;
    border-radius: 50%;
    object-fit: cover;
    object-position: top center;
}

.ui-v2-miara-trigger__badge {
    position: absolute;
    inset-block-end: -1px;
    inset-inline-end: -1px;
    display: grid;
    inline-size: 22px;
    block-size: 22px;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 50%;
    color: #fff;
    background: #f65505;
}

.ui-v2-miara-trigger__badge svg { inline-size: 11px; block-size: 11px; }
.ui-v2-miara-trigger[aria-expanded="true"] { visibility: hidden; }

@keyframes ui-v2-miara-pulse {
    0% { transform: scale(.9); opacity: .6; }
    70% { transform: scale(1.25); opacity: 0; }
    100% { opacity: 0; }
}

.ui-v2-miara-backdrop {
    position: fixed;
    z-index: 68;
    inset-block: 0;
    inset-inline: auto;
    left: var(--ui-v2-fixed-left, max(0px, calc((100vw - min(100vw, 430px)) / 2)));
    inline-size: var(--ui-v2-fixed-width, min(100%, 430px));
    margin-inline: auto;
    padding: 0;
    border: 0;
    background: rgb(19 27 46 / 48%);
}

.ui-v2-miara-sheet {
    position: fixed;
    z-index: 69;
    inset-inline: auto;
    left: var(--ui-v2-fixed-left, max(0px, calc((100vw - min(100vw, 430px)) / 2)));
    inset-block-end: 0;
    display: flex;
    inline-size: var(--ui-v2-fixed-width, min(100%, 430px));
    block-size: min(85dvh, 765px);
    max-block-size: calc(100dvh - max(16px, env(safe-area-inset-top)));
    flex-direction: column;
    margin-inline: auto;
    overflow: hidden;
    border-radius: 22px 22px 0 0;
    color: #131b2e;
    background: #fafafa;
    box-shadow: 0 -12px 34px rgb(19 27 46 / 18%);
    font-family: 'IRANSansXFaNum', 'IRANSansX', Tahoma, Arial, sans-serif;
}

.ui-v2-miara-sheet__status-retry { padding: 0; border: 0; color: #f65505; background: none; font: inherit; font-weight: 700; text-decoration: underline; cursor: pointer; }
.ui-v2-miara-sheet[aria-hidden="true"],
.ui-v2-miara-backdrop[hidden] { display: none; }

.ui-v2-miara-sheet__handle {
    inline-size: 36px;
    block-size: 4px;
    flex: 0 0 4px;
    margin: 9px auto 0;
    border-radius: 99px;
    background: #ced0d5;
}

.ui-v2-miara-sheet__header {
    display: flex;
    min-block-size: 64px;
    flex: 0 0 64px;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 9px 16px 10px;
    border-block-end: 1px solid #e7e8ea;
    background: #fff;
}

.ui-v2-miara-sheet__identity { display: flex; min-inline-size: 0; align-items: center; gap: 10px; }
.ui-v2-miara-sheet__identity > span:last-child { display: grid; min-inline-size: 0; gap: 2px; }
.ui-v2-miara-sheet__avatar { display: block; overflow: hidden; inline-size: 38px; block-size: 38px; flex: 0 0 38px; border-radius: 50%; }
.ui-v2-miara-sheet__avatar img { display: block; inline-size: 100%; block-size: 100%; object-fit: cover; object-position: top center; }
.ui-v2-miara-sheet__name { display: flex; align-items: center; gap: 5px; }
.ui-v2-miara-sheet__name strong { font-size: .84rem; font-weight: 800; }
.ui-v2-miara-sheet__name i { color: #f65505; font-size: .72rem; font-style: normal; }
.ui-v2-miara-sheet__identity small { display: flex; align-items: center; gap: 5px; color: #8b8f98; font-size: .62rem; }
.ui-v2-miara-sheet__identity small i { inline-size: 6px; block-size: 6px; border-radius: 50%; background: #25a86d; }
.ui-v2-miara-sheet__actions { display: flex; flex: 0 0 auto; align-items: center; gap: 2px; }
.ui-v2-miara-sheet__reset {
    display: grid;
    inline-size: 40px;
    block-size: 40px;
    flex: 0 0 40px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #8c5a3d;
    background: transparent;
    cursor: pointer;
    transition: color .18s ease, background-color .18s ease, opacity .18s ease;
}
.ui-v2-miara-sheet__reset:hover { color: #bc3d00; background: #fff1e8; }
.ui-v2-miara-sheet__reset:focus-visible { outline: 3px solid rgb(246 85 5 / 22%); outline-offset: 1px; }
.ui-v2-miara-sheet__reset:disabled { opacity: .38; cursor: wait; }
.ui-v2-miara-sheet__reset[aria-busy="true"] svg { animation: ui-v2-miara-spin .75s linear infinite; }
.ui-v2-miara-sheet__close {
    position: relative;
    display: grid;
    inline-size: 44px;
    block-size: 44px;
    flex: 0 0 44px;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 50%;
    color: #4e5567;
    background: transparent;
    cursor: pointer;
}
.ui-v2-miara-sheet__close::before { position: absolute; inset: 6px; border-radius: 50%; background: #f3f4f5; content: ''; }
.ui-v2-miara-sheet__close > * { position: relative; z-index: 1; }
@keyframes ui-v2-miara-spin { to { transform: rotate(360deg); } }

.ui-v2-miara-sheet__status { margin: 0; padding: 8px 16px; color: #8a4d16; background: #fff1df; font-size: .7rem; }
.ui-v2-miara-sheet__body { display: flex; min-block-size: 0; flex: 1; overflow: hidden; overscroll-behavior: contain; }
.ui-v2-miara-sheet__body > [wire\:id] { display: block; min-block-size: 0; inline-size: 100%; block-size: 100%; }

/* The contextual-sheet chat styling lives in the Livewire component's own
   inline stylesheet (resources/views/livewire/ai/partials/styles.blade.php),
   not here. This file is a published static asset: when a release skipped
   `vendor:publish` the host kept serving an older copy, and the sheet fell
   back to the legacy chat layout while the markup had already moved on.
   Rules that must never drift from the markup ship with the markup. */

.ui-v2-ask-miara { display: flex; min-block-size: 44px; align-items: center; justify-content: center; padding-inline: 12px; border-block-start: 1px solid #e7e8ea; color: #b33900; font-size: 12px; font-weight: 700; text-decoration: none; }

@media (min-width: 431px) {
    .ui-v2-miara-sheet { inset-block-end: 16px; border-radius: 22px; }
}

@media (prefers-reduced-motion: no-preference) {
    .ui-v2-miara-trigger { animation: ui-v2-miara-float 3.6s ease-in-out infinite; }
    .ui-v2-miara-sheet { animation: ui-v2-miara-enter .24s ease-out; }
    @keyframes ui-v2-miara-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }
    @keyframes ui-v2-miara-enter { from { transform: translateY(28px); opacity: .7; } }
}

@media (prefers-reduced-motion: reduce) {
    .ui-v2-miara-trigger__ring { display: none; animation: none; }
}

@media (max-width: 767px) {
    .ui-v2-miara-backdrop {
        inset: 0;
        left: 0;
        inline-size: 100%;
        block-size: 100dvh;
        background: rgb(19 27 46 / 58%);
    }

    .ui-v2-miara-sheet {
        --ui-v2-miara-bottom-guard: max(env(safe-area-inset-bottom), var(--ui-v2-miara-vv-bottom, 0px), 28px);
        box-sizing: border-box;
        inset: auto;
        top: var(--ui-v2-miara-vv-top, 0px);
        left: var(--ui-v2-miara-vv-left, 0px);
        inline-size: var(--ui-v2-miara-vv-width, 100vw);
        block-size: var(--ui-v2-miara-vv-height, 100dvh);
        max-block-size: none;
        padding-block-end: var(--ui-v2-miara-bottom-guard);
        border: 0;
        border-radius: 0;
        background: #f7f7f8;
        box-shadow: none;
    }

    .ui-v2-miara-sheet__handle { display: none; }

    .ui-v2-miara-sheet__header {
        min-block-size: calc(62px + env(safe-area-inset-top));
        flex-basis: calc(62px + env(safe-area-inset-top));
        padding: calc(7px + env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 7px max(12px, env(safe-area-inset-left));
        border-block-end-color: #ece8e5;
        box-shadow: 0 4px 18px rgb(19 27 46 / 5%);
    }

    .ui-v2-miara-sheet__avatar {
        inline-size: 40px;
        block-size: 40px;
        flex-basis: 40px;
        border: 2px solid #fff1e8;
    }

    .ui-v2-miara-sheet__name strong { font-size: .9rem; }
    .ui-v2-miara-sheet__identity small { font-size: .66rem; }
    .ui-v2-miara-sheet__body { overscroll-behavior: none; }
}

@media (max-width: 767px) and (orientation: landscape) {
    .ui-v2-miara-sheet__header {
        min-block-size: calc(54px + env(safe-area-inset-top));
        flex-basis: calc(54px + env(safe-area-inset-top));
        padding-block: calc(4px + env(safe-area-inset-top)) 4px;
    }
    .ui-v2-miara-sheet__avatar { inline-size: 36px; block-size: 36px; flex-basis: 36px; }
}