/* Two Panel File Manager v1.5.0 */
.wpcztpfm {
    --wpcztpfm-bg-color: #fff;
    --wpcztpfm-color: hsl(232, 10%, 25%);
    --wpcztpfm-color-link: hsl(232, 50%, 50%);
    --wpcztpfm-color-link-hover-and-focus: hsl(232, 100%, 50%);
    --wpcztpfm-color-link-active: hsl(232, 100%, 10%);
    --wpcztpfm-form-control-border-color: hsl(232, 5%, 92%);

    --wpcztpfm-panel-default-outline-color: #f0f0f0;
    --wpcztpfm-panel-selected-outline-color: hsl(232, 50%, 50%);

    --wpcztpfm-table-box-bg-color: hsl(232, 6%, 96%);
    --wpcztpfm-table-bg-color: #fff;
    --wpcztpfm-table-border-color: hsl(232, 6%, 86%);

    --wpcztpfm-table-selected-bg-color: #fff;
    --wpcztpfm-table-selected-border-color: hsl(232, 6%, 86%);

    --wpcztpfm-table-active-row-bg-color: hsl(232, 20%, 93%);
    --wpcztpfm-table-active-row-color: hsl(232, 10%, 25%);

    --wpcztpfm-bg-primary: hsl(232, 40%, 100%);
    --wpcztpfm-bg-success: hsl(161, 40%, 100%);
    --wpcztpfm-bg-error: hsl(353, 40%, 100%);
    --wpcztpfm-bg-light: hsl(232, 10%, 100%);
    --wpcztpfm-bg-dark: hsl(232, 10%, 100%);

    --wpcztpfm-bg-primary-hover-and-focus: hsl(232, 40%, 86%);
    --wpcztpfm-bg-success-hover-and-focus: hsl(161, 40%, 86%);
    --wpcztpfm-bg-error-hover-and-focus: hsl(353, 40%, 86%);
    --wpcztpfm-bg-light-hover-and-focus: hsl(232, 10%, 86%);
    --wpcztpfm-bg-dark-hover-and-focus: hsl(232, 10%, 46%);

    --wpcztpfm-bg-primary-active: hsl(232, 60%, 46%);
    --wpcztpfm-bg-success-active: hsl(161, 63%, 35%);
    --wpcztpfm-bg-error-active: hsl(353, 60%, 46%);
    --wpcztpfm-bg-light-active: hsl(232, 10%, 50%);
    --wpcztpfm-bg-dark-active: hsl(232, 10%, 26%);

    --wpcztpfm-color-primary: hsl(232, 60%, 46%);
    --wpcztpfm-color-success: hsl(161, 63%, 35%);
    --wpcztpfm-color-error: hsl(353, 60%, 46%);
    --wpcztpfm-color-light: hsl(232, 10%, 50%);
    --wpcztpfm-color-dark: hsl(232, 10%, 33%);

    --wpcztpfm-color-primary-hover-and-focus: hsl(232, 60%, 46%);
    --wpcztpfm-color-success-hover-and-focus: hsl(161, 63%, 35%);
    --wpcztpfm-color-error-hover-and-focus: hsl(353, 60%, 46%);
    --wpcztpfm-color-light-hover-and-focus: hsl(232, 10%, 32%);
    --wpcztpfm-color-dark-hover-and-focus: hsl(232, 10%, 99%);

    --wpcztpfm-color-primary-active: hsl(232, 60%, 99%);
    --wpcztpfm-color-success-active: hsl(161, 63%, 99%);
    --wpcztpfm-color-error-active: hsl(353, 60%, 99%);
    --wpcztpfm-color-light-active: hsl(232, 10%, 99%);
    --wpcztpfm-color-dark-active: hsl(232, 10%, 99%);

    --wpcztpfm-chk-bg: hsl(232, 5%, 96%);
    --wpcztpfm-chk-border-color: hsl(232, 6%, 86%);
    --wpcztpfm-chk-focus-ring: hsl(232, 6%, 86%);
    --wpcztpfm-chk-bg-checked: hsl(161, 63%, 35%);
    --wpcztpfm-chk-border-color-checked: hsl(161, 63%, 35%);
    --wpcztpfm-chk-focus-ring-checked: hsl(161, 63%, 35%);

    --wpcztpfm-base-font-size: 16px;
    --wpcztpfm-radius: 4px;

    position: relative;
    font-size: var(--wpcztpfm-base-font-size);
    line-height: 1.15;
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', 'Liberation Sans', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
    background-color: var(--wpcztpfm-bg-color);
    color: var(--wpcztpfm-color);
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    -webkit-text-size-adjust: 100%;
}

.wpcztpfm-text-start {
    text-align: start !important;
}

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

.wpcztpfm-text-end {
    text-align: end !important;
}

.wpcztpfm-is-hidden {
    display: none !important;
}

.wpcztpfm .wpcztpfm__btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.125em;
    border: 0;
    padding: 0.5em 0.375em;
    white-space: nowrap;
    font: inherit;
    font-size: 12px;
    background: none;
    cursor: pointer;
    border-radius: var(--wpcztpfm-radius);
    transition: background-color 0.15s ease, color 0.15s ease;
    flex-shrink: 0;
    color: var(--wpcztpfm-color-link);
    text-decoration: none;
    text-align: center;
}

.wpcztpfm .wpcztpfm__btn:hover,
.wpcztpfm .wpcztpfm__btn:focus {
    color: var(--wpcztpfm-color-link-hover-and-focus);
    text-decoration: none;
}

.wpcztpfm .wpcztpfm__btn:active {
    color: var(--wpcztpfm-color-link-active);
    text-decoration: none;
}

.wpcztpfm .wpcztpfm__btn-icon {
    display: block;
    flex-shrink: 0;
    inline-size: 20px;
    block-size: 20px;
    margin-block: -20px;
    fill: currentColor;
}

.wpcztpfm .wpcztpfm__btn-text {
    font-weight: 600;
}

.wpcztpfm .wpcztpfm__btn--light {
    background-color: var(--wpcztpfm-bg-light);
    color: var(--wpcztpfm-color-light);
}

.wpcztpfm .wpcztpfm__btn--light:hover,
.wpcztpfm .wpcztpfm__btn--light:focus {
    background-color: var(--wpcztpfm-bg-light-hover-and-focus);
    color: var(--wpcztpfm-color-light-hover-and-focus);
}

.wpcztpfm .wpcztpfm__btn--light:active {
    background-color: var(--wpcztpfm-bg-light-active);
    color: var(--wpcztpfm-color-light-active);
}

.wpcztpfm .wpcztpfm__btn--dark {
    background-color: var(--wpcztpfm-bg-dark);
    color: var(--wpcztpfm-color-dark);
}

.wpcztpfm .wpcztpfm__btn--dark:hover,
.wpcztpfm .wpcztpfm__btn--dark:focus {
    background-color: var(--wpcztpfm-bg-dark-hover-and-focus);
    color: var(--wpcztpfm-color-dark-hover-and-focus);
}

.wpcztpfm .wpcztpfm__btn--dark:active {
    background-color: var(--wpcztpfm-bg-dark-active);
    color: var(--wpcztpfm-color-dark-active);
}

.wpcztpfm .wpcztpfm__btn--primary {
    background-color: var(--wpcztpfm-bg-primary);
    color: var(--wpcztpfm-color-primary);
}

.wpcztpfm .wpcztpfm__btn--primary:hover,
.wpcztpfm .wpcztpfm__btn--primary:focus {
    background-color: var(--wpcztpfm-bg-primary-hover-and-focus);
    color: var(--wpcztpfm-color-primary-hover-and-focus);
}

.wpcztpfm .wpcztpfm__btn--primary:active {
    background-color: var(--wpcztpfm-bg-primary-active);
    color: var(--wpcztpfm-color-primary-active);
}

.wpcztpfm .wpcztpfm__btn--error {
    background-color: var(--wpcztpfm-bg-error);
    color: var(--wpcztpfm-color-error);
}

.wpcztpfm .wpcztpfm__btn--error:hover,
.wpcztpfm .wpcztpfm__btn--error:focus {
    background-color: var(--wpcztpfm-bg-error-hover-and-focus);
    color: var(--wpcztpfm-color-error-hover-and-focus);
}

.wpcztpfm .wpcztpfm__btn--error:active {
    background-color: var(--wpcztpfm-bg-error-active);
    color: var(--wpcztpfm-color-error-active);
}

.wpcztpfm .wpcztpfm__btn--success {
    background-color: var(--wpcztpfm-bg-success);
    color: var(--wpcztpfm-color-success);
}

.wpcztpfm .wpcztpfm__btn--success {
    background-color: var(--wpcztpfm-bg-success);
    color: var(--wpcztpfm-color-success);
}

.wpcztpfm .wpcztpfm__btn--success:hover,
.wpcztpfm .wpcztpfm__btn--success:focus {
    background-color: var(--wpcztpfm-bg-success-hover-and-focus);
    color: var(--wpcztpfm-color-success-hover-and-focus);
}

.wpcztpfm .wpcztpfm__btn--success:active {
    background-color: var(--wpcztpfm-bg-success-active);
    color: var(--wpcztpfm-color-success-active);
}

.wpcztpfm .wpcztpfm__chk-form-control {
    appearance: none;
    background-color: var(--wpcztpfm-chk-bg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    font-size: var(--wpcztpfm-base-font-size);
    inline-size: 1em;
    block-size: 1em;
    flex-shrink: 0;
    line-height: 1;
    margin: 0;
    transition: background-color 0.15s ease, border-color 0.15s ease;
    border-radius: var(--wpcztpfm-radius);
    border: 1px solid var(--wpcztpfm-chk-border-color);
    box-shadow: none;
}

.wpcztpfm .wpcztpfm__chk-form-control:focus-visible {
    outline: 2px solid var(--wpcztpfm-chk-focus-ring);
    outline-offset: 2px;
}

.wpcztpfm .wpcztpfm__chk-form-control:checked:focus-visible {
    outline: 2px solid var(--wpcztpfm-chk-focus-ring-checked);
}

.wpcztpfm .wpcztpfm__chk-form-control:checked {
    background-color: var(--wpcztpfm-chk-bg-checked);
    border-color: var(--wpcztpfm-chk-border-color-checked);
    background-image: url('data:image/svg+xml,%3csvg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"%3e%3cpath d="M9.525,13.777l-2.411,-2.412c-0.234,-0.233 -0.613,-0.233 -0.846,0l-1.27,1.27c-0.233,0.233 -0.233,0.612 0,0.846l4.104,4.103c0.116,0.117 0.269,0.175 0.422,0.175l0.003,0c0.152,0 0.305,-0.058 0.421,-0.175l9.054,-9.053c0.233,-0.234 0.233,-0.613 -0,-0.846l-1.27,-1.269c-0.233,-0.234 -0.612,-0.234 -0.846,-0l-7.361,7.361Z" fill="white"/%3e%3c/svg%3e');
}

.wpcztpfm .wpcztpfm__chk-form-control:focus {
    border-color: var(--wpcztpfm-chk-border-color);
    box-shadow: none;
}

.wpcztpfm .wpcztpfm__chk-form-control:checked:focus {
    border-color: var(--wpcztpfm-chk-border-color-checked);
}

.wpcztpfm .wpcztpfm__chk-form-control:checked::before {
    display: none;
}

.wpcztpfm .wpcztpfm__boxes {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 8px;
}

.wpcztpfm .wpcztpfm__header {
    margin-block-end: 12px;
}

.wpcztpfm .wpcztpfm__header-path {
    margin-block-end: 0.5em;
    overflow-wrap: break-word;
    word-break: break-word;
    font-size: 14px;
}

.wpcztpfm .wpcztpfm__header-btns {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}

.wpcztpfm .wpcztpfm__header-btns > * {
    flex-shrink: 0;
}

.wpcztpfm .wpcztpfm__table-box {
    display: flex;
    overflow-y: scroll;
    background-color: var(--wpcztpfm-table-box-bg-color);
    border: 1px solid var(--wpcztpfm-table-border-color);
    border-radius: var(--wpcztpfm-radius);
}

.wpcztpfm .wpcztpfm__table {
    margin: 0;
    border: 0;
    border-spacing: 0;
    border-collapse: separate;
    border-block-end: 1px solid var(--wpcztpfm-table-border-color);
    background-color: transparent;
    inline-size: 100%;
    block-size: max-content;
    overflow: initial;
}

.wpcztpfm .wpcztpfm__box {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
}

.wpcztpfm .wpcztpfm__table thead {
    position: sticky;
    inset-block-start: 0;
    z-index: 1;
}

.wpcztpfm .wpcztpfm__table thead .wpcztpfm__btn-icon {
    inline-size: 16px;
    block-size: 16px;
}

.wpcztpfm .wpcztpfm__table thead th,
.wpcztpfm .wpcztpfm__table tbody th,
.wpcztpfm .wpcztpfm__table tbody td {
    padding: 6px;
    background-color: var(--wpcztpfm-table-bg-color);
    border-style: solid;
    border-color: var(--wpcztpfm-table-border-color);
    border-width: 0;
    text-align: start;
    font-size: 14px;
    color: var(--wpcztpfm-color);
}

.wpcztpfm .wpcztpfm__selected-panel[value="0"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="0"] .wpcztpfm__table th,
.wpcztpfm .wpcztpfm__selected-panel[value="0"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="0"] .wpcztpfm__table td,
.wpcztpfm .wpcztpfm__selected-panel[value="1"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="1"] .wpcztpfm__table th,
.wpcztpfm .wpcztpfm__selected-panel[value="1"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="1"] .wpcztpfm__table td {
    background-color: var(--wpcztpfm-table-selected-bg-color);
    border-color: var(--wpcztpfm-table-selected-border-color);
}

.wpcztpfm .wpcztpfm__selected-panel + .wpcztpfm__boxes .wpcztpfm__box[data-panel] .wpcztpfm__table thead .wpcztpfm__active-row th,
.wpcztpfm .wpcztpfm__selected-panel + .wpcztpfm__boxes .wpcztpfm__box[data-panel] .wpcztpfm__table tbody .wpcztpfm__active-row th,
.wpcztpfm .wpcztpfm__selected-panel + .wpcztpfm__boxes .wpcztpfm__box[data-panel] .wpcztpfm__table tbody .wpcztpfm__active-row td {
    background-color: var(--wpcztpfm-table-active-row-bg-color);
    color: var(--wpcztpfm-table-active-row-color);
}

.wpcztpfm .wpcztpfm__selected-panel + .wpcztpfm__boxes .wpcztpfm__box .wpcztpfm__table-box {
    outline: 1px solid var(--wpcztpfm-panel-default-outline-color);
    outline-offset: 2px;
}

.wpcztpfm .wpcztpfm__selected-panel[value="0"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="0"] .wpcztpfm__table-box,
.wpcztpfm .wpcztpfm__selected-panel[value="1"] + .wpcztpfm__boxes .wpcztpfm__box[data-panel="1"] .wpcztpfm__table-box {
    outline: 1px solid var(--wpcztpfm-panel-selected-outline-color);
    outline-offset: 2px;
}

.wpcztpfm .wpcztpfm__table thead th:not(:first-child) {
    border-inline-start-width: 1px;
}

.wpcztpfm .wpcztpfm__table thead th {
    vertical-align: top;
    font-weight: 600;
    border-block-end-width: 3px;
    white-space: nowrap;
}

.wpcztpfm .wpcztpfm__table tbody th,
.wpcztpfm .wpcztpfm__table tbody td {
    vertical-align: top;
    font-weight: 400;
    border-block-start-width: 1px;
}

.wpcztpfm .wpcztpfm__table tbody tr:first-child th,
.wpcztpfm .wpcztpfm__table tbody tr:first-child td {
    border-block-start-width: 0;
}

.wpcztpfm .wpcztpfm__table tbody tr:first-child th {
    vertical-align: middle;
    color: var(--wpcztpfm-color-light);
}

.wpcztpfm .wpcztpfm__table tbody tr:first-child th+td {
    vertical-align: middle;
    letter-spacing: 1px;
}

.wpcztpfm .wpcztpfm__table tbody th+td {
    overflow-wrap: break-word;
    word-break: break-word;
}

.wpcztpfm .wpcztpfm__table tbody td {
    border-inline-start-width: 1px;
}

.wpcztpfm .wpcztpfm__table .wpcztpfm__link {
    color: var(--wpcztpfm-color-link);
    text-decoration: none;
    cursor: pointer;
}

.wpcztpfm .wpcztpfm__table .wpcztpfm__link:hover,
.wpcztpfm .wpcztpfm__table .wpcztpfm__link:focus {
    color: var(--wpcztpfm-color-link);
    text-decoration: none;
}

.wpcztpfm .wpcztpfm__table .wpcztpfm__link:active {
    color: var(--wpcztpfm-color-link);
    text-decoration: none;
}

.wpcztpfm .wpcztpfm__th-text {
    display: inline-block;
    vertical-align: middle;
}

.wpcztpfm .wpcztpfm__th-order-btns {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    white-space: nowrap;
}

.wpcztpfm .wpcztpfm__th-order-btn {
    padding: 0;
    inline-size: 24px;
}

.wpcztpfm .wpcztpfm__table-actions {
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 8px;
    margin-block-start: 4px;
    inline-size: max-content;
    max-inline-size: 200px;
}

/*  */
.wpcztpfm .wpcztpfm__footer {
    display: grid;
    grid-template-areas: 'a b' 'c d' 'e .';
    padding-block-start: 16px;
    gap: 8px;
}

@media (min-width: 480px) and (max-width: 1279.98px) {
    .wpcztpfm .wpcztpfm__footer {
        grid-template-areas: 'a b c' 'd e .';
        gap: 16px;
    }
}

@media (min-width: 1280px) and (max-width: 1567.98px) {
    .wpcztpfm .wpcztpfm__footer {
        grid-template-areas: 'a b c d e';
        gap: 16px;
    }
}

@media (min-width: 1568px) {
    .wpcztpfm .wpcztpfm__footer {
        display: flex;
        flex-wrap: wrap;
        justify-content: end;
        gap: 16px;
    }
}

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn:nth-of-type(1) {
    grid-area: a;
}

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn:nth-of-type(2) {
    grid-area: b;
}

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn:nth-of-type(3) {
    grid-area: c;
}

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn:nth-of-type(4) {
    grid-area: d;
}

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn:nth-of-type(5) {
    grid-area: e;
}
/*  */

/*  */

.wpcztpfm .wpcztpfm__footer .wpcztpfm__btn {
    padding: 1.425em;
}
