.bg-blur-aside {
    background: var(--aside-surface, #fbfcf9) !important;
}

.parent-aside-panel {
    position: fixed;
    top: 60px;
    right: 0;
    width: 50%;
    height: calc(var(--vh, 1vh) * 100 - 60px);
    background-color: var(--aside-surface, #fbfcf9);
    color: var(--aside-ink, #243d2e);
    z-index: var(--z-aside-panel, 1055);
    visibility: hidden;
    pointer-events: none;
    transform: translateX(100%);
    transition:
        transform 220ms cubic-bezier(0.22, 1, 0.36, 1),
        visibility 0s linear 220ms;
    display: flex;
    flex-direction: column;
    box-shadow: -4px 0 8px var(--aside-shadow, rgba(31, 58, 42, 0.16));
    outline: none;
}

.parent-aside-panel.active {
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition-delay: 0s;
}

body.resizing .parent-aside-panel {
    user-select: none;
    transition: none;
}

.aside-panel-width-20 { width: 20%; }
.aside-panel-width-21 { width: 21%; }
.aside-panel-width-22 { width: 22%; }
.aside-panel-width-23 { width: 23%; }
.aside-panel-width-24 { width: 24%; }
.aside-panel-width-25 { width: 25%; }
.aside-panel-width-26 { width: 26%; }
.aside-panel-width-27 { width: 27%; }
.aside-panel-width-28 { width: 28%; }
.aside-panel-width-29 { width: 29%; }
.aside-panel-width-30 { width: 30%; }
.aside-panel-width-31 { width: 31%; }
.aside-panel-width-32 { width: 32%; }
.aside-panel-width-33 { width: 33%; }
.aside-panel-width-34 { width: 34%; }
.aside-panel-width-35 { width: 35%; }
.aside-panel-width-36 { width: 36%; }
.aside-panel-width-37 { width: 37%; }
.aside-panel-width-38 { width: 38%; }
.aside-panel-width-39 { width: 39%; }
.aside-panel-width-40 { width: 40%; }
.aside-panel-width-41 { width: 41%; }
.aside-panel-width-42 { width: 42%; }
.aside-panel-width-43 { width: 43%; }
.aside-panel-width-44 { width: 44%; }
.aside-panel-width-45 { width: 45%; }
.aside-panel-width-46 { width: 46%; }
.aside-panel-width-47 { width: 47%; }
.aside-panel-width-48 { width: 48%; }
.aside-panel-width-49 { width: 49%; }
.aside-panel-width-50 { width: 50%; }
.aside-panel-width-51 { width: 51%; }
.aside-panel-width-52 { width: 52%; }
.aside-panel-width-53 { width: 53%; }
.aside-panel-width-54 { width: 54%; }
.aside-panel-width-55 { width: 55%; }
.aside-panel-width-56 { width: 56%; }
.aside-panel-width-57 { width: 57%; }
.aside-panel-width-58 { width: 58%; }
.aside-panel-width-59 { width: 59%; }
.aside-panel-width-60 { width: 60%; }
.aside-panel-width-61 { width: 61%; }
.aside-panel-width-62 { width: 62%; }
.aside-panel-width-63 { width: 63%; }
.aside-panel-width-64 { width: 64%; }
.aside-panel-width-65 { width: 65%; }
.aside-panel-width-66 { width: 66%; }
.aside-panel-width-67 { width: 67%; }
.aside-panel-width-68 { width: 68%; }
.aside-panel-width-69 { width: 69%; }
.aside-panel-width-70 { width: 70%; }
.aside-panel-width-71 { width: 71%; }
.aside-panel-width-72 { width: 72%; }
.aside-panel-width-73 { width: 73%; }
.aside-panel-width-74 { width: 74%; }
.aside-panel-width-75 { width: 75%; }
.aside-panel-width-76 { width: 76%; }
.aside-panel-width-77 { width: 77%; }
.aside-panel-width-78 { width: 78%; }
.aside-panel-width-79 { width: 79%; }
.aside-panel-width-80 { width: 80%; }
.aside-panel-width-81 { width: 81%; }
.aside-panel-width-82 { width: 82%; }
.aside-panel-width-83 { width: 83%; }
.aside-panel-width-84 { width: 84%; }
.aside-panel-width-85 { width: 85%; }
.aside-panel-width-86 { width: 86%; }
.aside-panel-width-87 { width: 87%; }
.aside-panel-width-88 { width: 88%; }
.aside-panel-width-89 { width: 89%; }
.aside-panel-width-90 { width: 90%; }

#iframeFac.aside-panel-main-full { width: 100%; }
#iframeFac.aside-panel-main-split-20 { width: 80%; }
#iframeFac.aside-panel-main-split-21 { width: 79%; }
#iframeFac.aside-panel-main-split-22 { width: 78%; }
#iframeFac.aside-panel-main-split-23 { width: 77%; }
#iframeFac.aside-panel-main-split-24 { width: 76%; }
#iframeFac.aside-panel-main-split-25 { width: 75%; }
#iframeFac.aside-panel-main-split-26 { width: 74%; }
#iframeFac.aside-panel-main-split-27 { width: 73%; }
#iframeFac.aside-panel-main-split-28 { width: 72%; }
#iframeFac.aside-panel-main-split-29 { width: 71%; }
#iframeFac.aside-panel-main-split-30 { width: 70%; }
#iframeFac.aside-panel-main-split-31 { width: 69%; }
#iframeFac.aside-panel-main-split-32 { width: 68%; }
#iframeFac.aside-panel-main-split-33 { width: 67%; }
#iframeFac.aside-panel-main-split-34 { width: 66%; }
#iframeFac.aside-panel-main-split-35 { width: 65%; }
#iframeFac.aside-panel-main-split-36 { width: 64%; }
#iframeFac.aside-panel-main-split-37 { width: 63%; }
#iframeFac.aside-panel-main-split-38 { width: 62%; }
#iframeFac.aside-panel-main-split-39 { width: 61%; }
#iframeFac.aside-panel-main-split-40 { width: 60%; }
#iframeFac.aside-panel-main-split-41 { width: 59%; }
#iframeFac.aside-panel-main-split-42 { width: 58%; }
#iframeFac.aside-panel-main-split-43 { width: 57%; }
#iframeFac.aside-panel-main-split-44 { width: 56%; }
#iframeFac.aside-panel-main-split-45 { width: 55%; }
#iframeFac.aside-panel-main-split-46 { width: 54%; }
#iframeFac.aside-panel-main-split-47 { width: 53%; }
#iframeFac.aside-panel-main-split-48 { width: 52%; }
#iframeFac.aside-panel-main-split-49 { width: 51%; }
#iframeFac.aside-panel-main-split-50 { width: 50%; }
#iframeFac.aside-panel-main-split-51 { width: 49%; }
#iframeFac.aside-panel-main-split-52 { width: 48%; }
#iframeFac.aside-panel-main-split-53 { width: 47%; }
#iframeFac.aside-panel-main-split-54 { width: 46%; }
#iframeFac.aside-panel-main-split-55 { width: 45%; }
#iframeFac.aside-panel-main-split-56 { width: 44%; }
#iframeFac.aside-panel-main-split-57 { width: 43%; }
#iframeFac.aside-panel-main-split-58 { width: 42%; }
#iframeFac.aside-panel-main-split-59 { width: 41%; }
#iframeFac.aside-panel-main-split-60 { width: 40%; }
#iframeFac.aside-panel-main-split-61 { width: 39%; }
#iframeFac.aside-panel-main-split-62 { width: 38%; }
#iframeFac.aside-panel-main-split-63 { width: 37%; }
#iframeFac.aside-panel-main-split-64 { width: 36%; }
#iframeFac.aside-panel-main-split-65 { width: 35%; }
#iframeFac.aside-panel-main-split-66 { width: 34%; }
#iframeFac.aside-panel-main-split-67 { width: 33%; }
#iframeFac.aside-panel-main-split-68 { width: 32%; }
#iframeFac.aside-panel-main-split-69 { width: 31%; }
#iframeFac.aside-panel-main-split-70 { width: 30%; }
#iframeFac.aside-panel-main-split-71 { width: 29%; }
#iframeFac.aside-panel-main-split-72 { width: 28%; }
#iframeFac.aside-panel-main-split-73 { width: 27%; }
#iframeFac.aside-panel-main-split-74 { width: 26%; }
#iframeFac.aside-panel-main-split-75 { width: 25%; }
#iframeFac.aside-panel-main-split-76 { width: 24%; }
#iframeFac.aside-panel-main-split-77 { width: 23%; }
#iframeFac.aside-panel-main-split-78 { width: 22%; }
#iframeFac.aside-panel-main-split-79 { width: 21%; }
#iframeFac.aside-panel-main-split-80 { width: 20%; }
#iframeFac.aside-panel-main-split-81 { width: 19%; }
#iframeFac.aside-panel-main-split-82 { width: 18%; }
#iframeFac.aside-panel-main-split-83 { width: 17%; }
#iframeFac.aside-panel-main-split-84 { width: 16%; }
#iframeFac.aside-panel-main-split-85 { width: 15%; }
#iframeFac.aside-panel-main-split-86 { width: 14%; }
#iframeFac.aside-panel-main-split-87 { width: 13%; }
#iframeFac.aside-panel-main-split-88 { width: 12%; }
#iframeFac.aside-panel-main-split-89 { width: 11%; }
#iframeFac.aside-panel-main-split-90 { width: 10%; }
#iframeFac.aside-panel-main-padding-mobile { padding-left: 0; }
#iframeFac.aside-panel-main-padding-collapsed { padding-left: 80px; }
#iframeFac.aside-panel-main-padding-expanded { padding-left: 250px; }

.drag-overlay {
    position: fixed;
    inset: 0;
    z-index: var(--z-aside-drag, 1058);
    cursor: col-resize;
}

.aside-panel-resizer-hidden {
    display: none;
}

.resizer {
    position: absolute;
    left: -6px;
    top: 0;
    width: 12px;
    height: 100%;
    background-color: transparent;
    cursor: col-resize;
    touch-action: none;
    z-index: var(--z-aside-resizer, 1056);
}

.resizer::after {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 5px;
    width: 2px;
    background-color: transparent;
    content: "";
    transition: background-color 160ms ease-out;
}

.resizer:hover::after,
.resizer:active::after,
.resizer:focus-visible::after {
    background-color: var(--aside-focus, #6b8b6e);
}

.resizer:focus-visible {
    outline: 3px solid rgba(107, 139, 110, 0.28);
    outline-offset: -3px;
}

.parent-panel-header {
    min-height: 56px;
    flex-shrink: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 1rem;
    padding: 0.35rem 0.75rem 0.35rem 1rem;
    background-color: var(--aside-header-surface, #fff);
    border-bottom: 1px solid var(--aside-border, #e3e8db);
}

.parent-panel-header h5 {
    min-width: 0;
    margin: 0;
    font-size: 1rem;
    color: var(--aside-ink, #243d2e);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.parent-panel-header h5 span {
    margin-left: 0.75rem;
    color: var(--aside-muted, #5a6c6d);
    font-size: 0.9rem !important;
    font-weight: 400;
}

.parent-panel-actions {
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 0.25rem;
}

.parent-panel-header button {
    display: inline-flex;
    width: 2.75rem;
    height: 2.75rem;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    border-radius: 0.5rem;
    color: var(--aside-ink, #243d2e);
    transition: background-color 160ms ease-out, color 160ms ease-out;
}

.parent-panel-header button:hover {
    background-color: #eef4eb;
}

.parent-panel-header button:focus-visible,
.aside-panel-retry:focus-visible {
    outline: 3px solid rgba(107, 139, 110, 0.28);
    outline-offset: 2px;
}

.parent-panel-header button[aria-pressed="true"] {
    background-color: #e7efe1;
    color: #3f5942;
}

.aside-panel-dirty-status {
    display: none;
    margin-right: 0.25rem;
    color: #7e6212;
    font-size: 0.78rem;
    font-weight: 600;
    white-space: nowrap;
}

.aside-panel-dirty .aside-panel-dirty-status {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
}

.parent-panel-body {
    position: relative;
    flex-grow: 1;
    overflow: hidden;
    background: var(--aside-surface, #fbfcf9);
}

.parent-panel-body iframe {
    width: 100%;
    height: 100%;
    border: none;
    background: transparent;
}

.aside-panel-loading,
.aside-panel-error {
    position: absolute;
    inset: 0;
    z-index: 1;
    background: var(--aside-surface, #fbfcf9);
}

.aside-panel-loading[hidden],
.aside-panel-error[hidden] {
    display: none;
}

.aside-panel-loading {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    padding: 1.5rem;
}

.aside-panel-skeleton-row {
    height: 5.25rem;
    border-radius: 0.625rem;
    background: linear-gradient(90deg, #eef2eb 25%, #f7f9f5 50%, #eef2eb 75%);
    background-size: 200% 100%;
    animation: aside-panel-skeleton 1.2s ease-in-out infinite;
}

.aside-panel-skeleton-row:first-child {
    height: 7rem;
}

.aside-panel-skeleton-row:last-child {
    width: 72%;
}

.aside-panel-error {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 2rem;
    text-align: center;
}

.aside-panel-error-content {
    max-width: 28rem;
}

.aside-panel-error-content i {
    margin-bottom: 0.75rem;
    color: #7e6212;
    font-size: 1.5rem;
}

.aside-panel-error-content p {
    margin-bottom: 1rem;
    color: var(--aside-muted, #5a6c6d);
}

.aside-panel-retry {
    min-height: 2.75rem;
    padding: 0.55rem 1rem;
    background: #fff;
    border: 1px solid var(--aside-border, #e3e8db);
    border-radius: 0.5rem;
    color: var(--aside-ink, #243d2e);
    font-weight: 600;
}

.aside-panel-retry:hover {
    background: #eef4eb;
}

@keyframes aside-panel-skeleton {
    from { background-position: 200% 0; }
    to { background-position: -200% 0; }
}

body.aside-panel-active {
    overflow-x: hidden;
}

body.split-screen-active {
    overflow: hidden;
}

@media (max-width: 992px) {
    .parent-aside-panel {
        width: min(86%, 48rem);
    }
}

@media (max-width: 767px) {
    body.aside-panel-active {
        overflow: hidden;
    }

    .parent-aside-panel {
        inset: 0;
        width: 100vw;
        max-width: none;
        height: 100vh;
        height: 100dvh;
    }

    .ocultar-en-movil {
        display: none !important;
    }

    .aside-panel-dirty-status {
        position: absolute;
        top: 100%;
        right: 0.75rem;
        padding: 0.3rem 0.55rem;
        background: #fdf3d2;
        border-radius: 0 0 0.4rem 0.4rem;
    }
}

@media (prefers-reduced-motion: reduce) {
    .parent-aside-panel,
    .parent-panel-header button,
    .resizer::after {
        transition: none;
    }

    .aside-panel-skeleton-row {
        animation: none;
    }
}
