/*
 * FileHost theme + layout layer.
 * Loaded after style.min.css / panel.min css on every templated page.
 * Flat surfaces, hairline borders, solid fills only (no gradients, no glows).
 * Font family is intentionally untouched (Averta).
 *
 * body.ve-site  public pages (home, premium, earn money, legal, contact, api)
 * body.ve-app   signed-in dashboard pages (left sidebar shell)
 */
:root {
    --ve-radius-sm: 4px;
    --ve-radius: 6px;
    --ve-sidebar: 240px;
    --ve-header: 60px;
}

::selection { background: rgba(var(--ve-accent-rgb,74,125,255),0.3); color: var(--ve-text-strong,#fff); }

/* Scrollbars: see assets/css/scrollbar.css */

body {
    background: var(--ve-canvas);
    color: var(--ve-text);
}

a { color: var(--ve-accent-fg); }
a:hover { color: var(--ve-link-hover,#86a8ff); }
hr { border-top-color: var(--ve-line); }

/* =========================================================
   Shared components
   ========================================================= */

/* Buttons */
.btn {
    border-radius: var(--ve-radius-sm);
    font-weight: 600;
    box-shadow: none;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.btn.btn-primary,
.btn-primary {
    background: var(--ve-fill);
    border-color: var(--ve-fill);
    color: var(--ve-on-accent);
    box-shadow: none;
}
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-primary:not(:disabled):active,
.btn-primary:hover,
.btn-primary:focus {
    background: var(--ve-fill-hover);
    border-color: var(--ve-fill-hover);
    color: var(--ve-on-accent);
}
.btn.btn-primary:focus,
.btn.btn-primary.dropdown-toggle:focus { box-shadow: 0 0 0 2px var(--ve-canvas), 0 0 0 4px var(--ve-accent) !important; }

.btn.btn-default {
    background: var(--ve-surface-2);
    border-color: var(--ve-line-strong);
    color: var(--ve-text);
}
.btn.btn-default:hover,
.btn.btn-default:focus { background: var(--ve-raised); border-color: rgba(var(--ve-ov,255,255,255),0.2); color: var(--ve-text-strong,#fff); }

.btn.btn-white { color: var(--ve-accent-fg); background: var(--ve-accent-soft); border-color: transparent; }
.btn.btn-white:hover,
.btn.btn-white:focus,
.btn.btn-white:not(:disabled):active { color: var(--ve-text-strong,#fff); background: rgba(var(--ve-accent-rgb,74,125,255),0.22); }

/* Forms */
.form-control,
.custom-select,
.custom-file-label { border-radius: var(--ve-radius-sm); }
.the_box .form-control,
.the_box .custom-file-label,
.video-content .form-control,
.main-menu .form-inline .form-control {
    background: var(--ve-canvas);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.the_box .form-control::placeholder { color: var(--ve-text-faint); }
.form-control:focus,
.the_box .form-control:focus,
.the_box .custom-file-label:focus {
    border-color: var(--ve-accent) !important;
    box-shadow: 0 0 0 1px var(--ve-accent) !important;
}
.the_box .form-control:focus { background: var(--ve-canvas); }
.the_box .input-group-append .input-group-text {
    background: var(--ve-surface-2);
    border-color: var(--ve-line-strong);
    border-radius: 0 var(--ve-radius-sm) var(--ve-radius-sm) 0;
}
.custom-control.custom-checkbox .custom-control-label:before { border-radius: 3px; background: var(--ve-surface-2); border-color: var(--ve-line-strong); }
.custom-control.custom-checkbox .custom-control-input:checked ~ .custom-control-label:before,
.custom-control.custom-switch .custom-control-input:checked ~ .custom-control-label:before,
.custom-control.custom-radio .custom-control-input:checked ~ .custom-control-label:before { background: var(--ve-fill); border-color: var(--ve-fill); }

/* Tabs and pagination */
.nav-tabs { border-bottom-color: var(--ve-line); }
.nav-tabs .nav-item .nav-link {
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    border-radius: 0;
    color: var(--ve-text-muted);
}
.nav-tabs .nav-item .nav-link:hover { color: var(--ve-text-strong,#fff); }
.nav-tabs .nav-item .nav-link.active { background: transparent; color: var(--ve-text-strong,#fff); border-bottom-color: var(--ve-accent); }

.pagination .page-item .page-link { border-radius: var(--ve-radius-sm); background: var(--ve-surface-2); border-color: var(--ve-line); color: var(--ve-text); }
.pagination .page-item .page-link:hover,
.pagination .page-item .page-link:focus { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }
.pagination .page-item.active .page-link { background: var(--ve-fill); border-color: var(--ve-fill); color: var(--ve-on-accent); }

/* Menus and modals */
.dropdown-menu {
    border: 1px solid rgba(0, 0, 0, 0.12);
    border-radius: var(--ve-radius-sm);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.35);
    overflow: hidden;
}
.dropdown-item.active,
.dropdown-item:active { background-color: var(--ve-fill); color: var(--ve-on-accent); }
.dropdown-menu.notifications-box .title { background: var(--ve-surface-2); border-bottom-color: var(--ve-line); }
.dropdown-menu.notifications-box .title span { color: var(--ve-text-strong,#fff); }
.dropdown-menu.notifications-box .title a { color: var(--ve-accent-fg); background: transparent; }
.dropdown-menu.notifications-box .title a:hover { background: var(--ve-accent-soft); color: var(--ve-accent-fg); }
.main-menu .navbar-nav .nav-item.dropdown.notifications .nav-link .count { background: var(--ve-fill); color: var(--ve-on-accent); border-radius: 3px; }

.modal .modal-content { border-radius: var(--ve-radius); overflow: hidden; border: 0; box-shadow: 0 16px 48px rgba(0, 0, 0, 0.5); }
.modal .modal-content .modal-header { background: var(--ve-surface-2); border-radius: 0; }
.modal-backdrop { background-color: #05070a; }
.modal-backdrop.show { opacity: .75; }

.alert { border-radius: var(--ve-radius-sm); }
.badge { border-radius: 3px; }
.vue-simple-context-menu { border-radius: var(--ve-radius-sm); overflow: hidden; background: var(--ve-surface-2); border: 1px solid var(--ve-line-strong); }

/* Surfaces */
.the_box,
.file_manager,
.video-content,
.uploading-files .uploading-list .file {
    background: var(--ve-surface);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    box-shadow: none;
}
.file_manager .files ul.file_list li { border-bottom-color: var(--ve-line); }
.file_manager .files ul.file_list li:not(.header):hover { background: rgba(var(--ve-ov,255,255,255),0.03); }
.file_manager .files ul.file_list li.active,
.file_manager .files ul.file_list li.active:not(.header):hover { background: var(--ve-accent-soft); }
.file_manager .files ul.file_list li.active:not(.header):hover { box-shadow: inset 0 0 0 1px rgba(var(--ve-accent-rgb,74,125,255),0.25); }
.file_manager .title_wrap .btn-white { background: var(--ve-surface-2); border: 1px solid var(--ve-line-strong); color: var(--ve-text); }
.file_manager .title_wrap .btn-white:hover,
.file_manager .title_wrap .btn-white:focus,
.file_manager .title_wrap .btn-white:not(:disabled):active { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }

/* Footer (both shells) */
.footer {
    background: var(--ve-canvas);
    border-top: 1px solid var(--ve-line);
    padding: 22px 0;
}
.footer .menu { gap: 4px 28px; }
.footer .menu li, .footer .menu li:last-child { margin: 0; }
.footer .menu li a { color: var(--ve-text-muted); font-size: .9286rem; font-weight: 500; transition: color .15s ease; }
.footer .menu li a:hover { color: var(--ve-text-strong,#fff); }
.footer .row > [class*="col-md-"] { display: flex; align-items: center; }
.footer .row > .col-md-10 { justify-content: flex-end; }
/* The footer sits at the end of the page flow instead of being pinned over a fixed body padding,
   which was too small once the links wrapped on narrow screens. */
body:has(> footer.footer) { display: flex; flex-direction: column; min-height: 100vh; padding-bottom: 0 !important; }
body:has(> footer.footer) > footer.footer { position: static; margin-top: auto !important; flex: none; }
body:has(> footer.footer) > :not(footer):not(script):not(style):not(link) { flex: none; }
body:has(> footer.footer) > .site_wrap { flex: 1 0 auto; }
@media (max-width: 767.98px) {
    .footer { padding: 24px 0 20px; }
    .footer .row { row-gap: 14px; }
    .footer .row > [class*="col-md-"], .footer .row > .col-md-10 { justify-content: center; text-align: center !important; }
    .footer .ve-text-logo--footer, .footer .logo { margin: 0 auto; }
    .footer .menu { justify-content: center !important; gap: 6px 20px; }
    .footer .menu li a { padding: 6px 0; }
    .footer .menu .ve-theme-li { flex-basis: 100%; display: flex; justify-content: center; margin-top: 4px; }
}

/* =========================================================
   Public site
   ========================================================= */
.ve-site .main-menu {
    position: relative;
    background: var(--ve-canvas);
    border-bottom: 1px solid var(--ve-line);
    padding-top: 12px;
    padding-bottom: 12px;
}
.ve-site .main-menu .navbar-nav .nav-item .nav-link {
    position: relative;
    color: var(--ve-text-muted);
    font-weight: 500;
    margin: 0 4px;
    padding: 8px 12px;
    transition: color .15s ease;
}
.ve-site .main-menu .navbar-nav .nav-item .nav-link:focus { color: var(--ve-text-muted); }
.ve-site .main-menu .navbar-nav .nav-item .nav-link:hover,
.ve-site .main-menu .navbar-nav .nav-item .nav-link:focus-visible,
.ve-site .main-menu .navbar-nav .nav-item.active .nav-link { color: var(--ve-text-strong,#fff); }
.ve-site .main-menu .navbar-nav .nav-item .nav-link:before,
.ve-site .main-menu .navbar-nav .nav-item .nav-link:after { content: none !important; }
/* Current page: straight accent line on the header's bottom edge. */
@media (min-width: 992px) {
    .ve-site .main-menu .navbar-nav .nav-item.active .nav-link:after {
        content: "" !important;
        display: block;
        position: absolute;
        left: 12px;
        right: 12px;
        bottom: -13px;
        height: 2px;
        background: var(--ve-accent);
    }
}
.ve-site .main-menu .ve-nav-actions { display: flex; align-items: center; gap: 8px; flex-wrap: nowrap; }
.ve-site .main-menu .ve-nav-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    height: 38px;
    padding: 0 16px;
    font-weight: 600;
    white-space: nowrap;
}
.ve-site .main-menu .ve-nav-actions .btn .fad { margin: 0 8px 0 0; font-size: .9375rem; line-height: 1; color: inherit; --fa-secondary-opacity: .45; }
.btn-ve-secondary {
    background: transparent;
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.btn-ve-secondary:hover,
.btn-ve-secondary:focus-visible { background: var(--ve-surface-2); border-color: rgba(var(--ve-ov,255,255,255),0.24); color: var(--ve-text-strong,#fff); }
@media (max-width: 991.98px) {
    .ve-site .main-menu .ve-nav-actions { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ve-line); }
    .ve-site .main-menu .ve-nav-actions .btn { flex: 1 1 0; }
}
@media (min-width: 992px) {
    .ve-site .main-menu .navbar-collapse { justify-content: space-between; }
    .ve-site .main-menu .navbar-nav.ml-auto { margin-left: auto !important; margin-right: auto !important; }
}

/* Page header (every public page except home) */
.ve-site .banner {
    margin-top: 0;
    padding: 72px 0 56px;
    background: var(--ve-surface);
    border-bottom: 1px solid var(--ve-line);
    text-align: left;
}
.ve-site .banner .text-center { text-align: left !important; }
.ve-site .banner h1 {
    font-size: 2.5rem;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.02em;
    margin-bottom: 12px !important;
}
.ve-site .banner h1 strong { color: var(--ve-accent-fg); font-weight: 700; }
.ve-site .banner h1 strong:after { content: none; }
.ve-site .banner p { color: var(--ve-text-muted); font-size: 1.07rem; max-width: 620px; margin-bottom: 0 !important; }
.ve-site .banner .shape,
.ve-site .banner .points { display: none !important; }

/* Home hero: copy left, upload panel right */
.ve-site .site_wrap > .banner {
    background: var(--ve-canvas);
    border-bottom: 0;
    padding: 80px 15px 72px;
    max-width: 1140px;
    margin: 0 auto;
}
.ve-site .site_wrap > .banner h3 {
    text-align: left;
    font-size: 2.85rem;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.025em;
    margin: 0 0 16px;
}
.ve-site .site_wrap > .banner h3 .pcolour { color: var(--ve-accent-fg); font-weight: 700; }
.ve-site .site_wrap > .banner .hp-top {
    text-align: left !important;
    color: var(--ve-text-muted);
    font-size: 1.1rem;
    line-height: 1.6;
    max-width: 440px;
    margin: 0;
}
.ve-site .site_wrap > .banner > .container { padding: 0; max-width: none; margin-top: 40px; }
.ve-site .site_wrap > .banner .upload-content { padding: 0 !important; }
.ve-site .upload-content .browse {
    border: 1px dashed var(--ve-line-strong);
    border-radius: var(--ve-radius);
    background: var(--ve-surface);
    padding: 48px 24px 40px;
    transition: border-color .15s ease, background-color .15s ease;
}
.ve-site .upload-content .browse:hover { border-color: var(--ve-fill); background: var(--ve-surface-2); }
.ve-site .upload-content .browse p { color: var(--ve-text-muted); font-size: 1.07rem; }
.ve-site .upload-content .browse p label { color: var(--ve-text-strong,#fff); }
.ve-site .upload-content .browse p label:hover { color: var(--ve-accent-fg); }
.ve-site .upload-content .browse.text-center {
    position: relative;
    text-align: center !important;
    cursor: pointer;
}
.ve-site .upload-content .browse svg { display: block; margin: 0 auto 16px; }
.ve-site .upload-content .browse p label { cursor: pointer; }
.ve-site .upload-content .browse p label:after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
}
.ve-site .upload-content .browse:hover p label { color: var(--ve-accent-fg); }
@media (min-width: 992px) {
    .ve-site .site_wrap > .banner {
        display: grid;
        grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
        grid-template-rows: auto auto 1fr;
        column-gap: 72px;
        align-items: start;
        padding-top: 104px;
        padding-bottom: 96px;
    }
    .ve-site .site_wrap > .banner > h3 { grid-column: 1; grid-row: 1; margin-top: 32px; }
    .ve-site .site_wrap > .banner > .hp-top { grid-column: 1; grid-row: 2; }
    .ve-site .site_wrap > .banner > .container { grid-column: 2; grid-row: 1 / span 3; margin-top: 0; }
}

/* Key figures strip */
.ve-facts {
    background: var(--ve-surface);
    border-top: 1px solid var(--ve-line);
    border-bottom: 1px solid var(--ve-line);
}
.ve-facts__list {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 0;
}
.ve-facts__item { padding: 28px 24px; border-left: 1px solid var(--ve-line); }
.ve-facts__item:first-child { border-left: 0; padding-left: 0; }
.ve-facts__item dt {
    color: var(--ve-text-faint);
    font-size: .7857rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
    margin: 0 0 6px;
}
.ve-facts__item dd { margin: 0; font-size: 1.5rem; font-weight: 700; color: var(--ve-text-strong,#fff); letter-spacing: -0.01em; }
@media (max-width: 767.98px) {
    .ve-facts__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ve-facts__item { padding: 20px 16px; }
    .ve-facts__item:nth-child(odd) { border-left: 0; padding-left: 0; }
    .ve-facts__item:nth-child(n + 3) { border-top: 1px solid var(--ve-line); }
}

/* Section heads (features, faq) */
.ve-site h2.title-box {
    display: block;
    position: static;
    top: auto;
    width: auto;
    min-width: 0;
    margin: 0 0 12px !important;
    padding: 0;
    background: none;
    border-radius: 0;
    box-shadow: none;
    color: var(--ve-text-strong,#fff);
    font-size: 2rem;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.02em;
}
.ve-section-head p { color: var(--ve-text-muted); margin: 0; line-height: 1.6; }

/* Features: heading column + 2-col list */
.ve-site .features { background: var(--ve-canvas); padding: 96px 0; }
.ve-site .features .row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: 40px;
    margin: 0;
}
.ve-site .features .row > [class*="col-"] {
    max-width: none;
    padding: 28px 0;
    margin: 0 !important;
    border-top: 1px solid var(--ve-line);
}
.ve-site .features .icon { display: block; margin-bottom: 12px !important; line-height: 1; }
.ve-site .features .icon i { margin: 0 !important; font-size: 1.5rem; color: var(--ve-accent-fg); }
.ve-site .features h5 { font-size: 1.07rem; font-weight: 600; margin-bottom: 6px; color: var(--ve-text-strong,#fff); }
.ve-site .features p { color: var(--ve-text-muted); margin: 0; line-height: 1.6; font-weight: 400; font-size: 1rem; max-width: 340px; }

/* FAQ: heading column + single list */
.ve-site .faq { background: var(--ve-surface); border-top: 1px solid var(--ve-line); padding: 96px 0; }
.ve-site .faq .title-box { margin-top: 0 !important; }
.ve-site .faq .accordion .row { display: block; margin: 0; }
.ve-site .faq .accordion .row > [class*="col-"] { max-width: none; padding: 0; }
.ve-site .faq .accordion .card {
    background: transparent;
    border: 0;
    border-bottom: 1px solid var(--ve-line);
    border-radius: 0;
    margin: 0;
}
.ve-site .faq .accordion .row > [class*="col-"]:first-child .card:first-child { border-top: 1px solid var(--ve-line); }
.ve-site .faq .accordion .card .card-header { background: transparent; }
.ve-site .faq .accordion .card .card-header .btn,
.ve-site .faq .accordion .card .card-header .btn[aria-expanded=true] {
    background: transparent;
    border-radius: 0;
    color: var(--ve-text-strong,#fff);
    font-size: 1rem;
    font-weight: 600;
    padding: 20px 48px 20px 0;
}
.ve-site .faq .accordion .card .card-header .btn:hover { color: var(--ve-accent-fg); }
.ve-site .faq .accordion .card .card-header .btn strong,
.ve-site .faq .accordion .card .card-header .btn[aria-expanded=true] strong {
    color: var(--ve-text-faint);
    font-size: .8571rem;
    font-weight: 600;
    min-width: 28px;
    margin-right: 16px;
    font-variant-numeric: tabular-nums;
}
.ve-site .faq .accordion .card .card-header .btn[aria-expanded=true] strong { color: var(--ve-accent-fg); }
.ve-site .faq .accordion .card .card-header .btn:after { color: var(--ve-text-faint); right: 0; }
.ve-site .faq .accordion .card .collapse,
.ve-site .faq .accordion .card .collapsing { background: transparent; color: var(--ve-text-muted); }
.ve-site .faq .accordion .card .card-body { padding: 0 48px 22px 44px; line-height: 1.65; }

@media (min-width: 992px) {
    .ve-site .features > .container,
    .ve-site .faq > .container {
        display: grid;
        grid-template-columns: 300px minmax(0, 1fr);
        column-gap: 72px;
        align-items: start;
    }
}
@media (max-width: 991.98px) {
    .ve-section-head { margin-bottom: 32px; }
    .ve-site .features,
    .ve-site .faq { padding: 64px 0; }
}
@media (max-width: 575.98px) {
    .ve-site .features .row { grid-template-columns: minmax(0, 1fr); }
    .ve-site .site_wrap > .banner h3 { font-size: 2.1rem; }
    .ve-site .banner h1 { font-size: 1.9rem; }
    .ve-site .banner { padding: 48px 0 40px; }
}

/* Premium page */
.ve-premium { padding-top: 48px; padding-bottom: 24px; }
.ve-premium__section + .ve-premium__section { margin-top: 64px; padding-top: 48px; border-top: 1px solid var(--ve-line); }
.ve-premium__head { max-width: 640px; margin-bottom: 24px; }
.ve-premium__head h2 { margin: 0 0 6px; color: var(--ve-text-strong,#fff); font-size: 1.5rem; font-weight: 700; letter-spacing: -0.01em; }
.ve-premium__head p { margin: 0; color: var(--ve-text-muted); }

.ve-plans {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    overflow: hidden;
}
.ve-plan {
    position: relative;
    display: flex;
    flex-direction: column;
    padding: 28px 24px 24px;
    background: var(--ve-surface);
}
.ve-plan + .ve-plan { border-left: 1px solid var(--ve-line); }
.ve-plan.is-featured { background: var(--ve-surface-2); }
.ve-plan.is-featured:before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 2px;
    background: var(--ve-accent);
}
.ve-plan__name {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 22px;
    color: var(--ve-text-muted);
    font-size: .8571rem;
    font-weight: 600;
    letter-spacing: .08em;
    text-transform: uppercase;
}
.ve-plan__tag {
    padding: 2px 6px;
    border-radius: var(--ve-radius-sm);
    background: var(--ve-accent-soft);
    color: var(--ve-accent-fg);
    font-size: .7143rem;
    letter-spacing: .06em;
}
.ve-plan__price {
    margin-top: 18px;
    color: var(--ve-text-strong,#fff);
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
}
.ve-plan__currency { margin-right: 2px; color: var(--ve-text-muted); font-size: 1.15rem; font-weight: 600; vertical-align: 1.05rem; }
.ve-plan__period { margin-top: 6px; color: var(--ve-text-muted); font-size: .9286rem; }
.ve-plan__note {
    margin: 20px 0 24px;
    padding-top: 16px;
    border-top: 1px solid var(--ve-line);
    color: var(--ve-text-faint);
    font-size: .8571rem;
}
.ve-plan__note strong { color: var(--ve-text); font-weight: 600; }
.ve-plan__cta { margin-top: auto; }

.ve-includes {
    display: grid;
    grid-template-columns: 200px minmax(0, 1fr);
    gap: 24px;
    margin-top: 24px;
    padding: 24px;
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
}
.ve-includes__title { color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-includes__list {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px 24px;
    margin: 0;
    padding: 0;
    list-style: none;
    color: var(--ve-text-muted);
    font-size: .9286rem;
}
.ve-includes__list li { display: flex; align-items: baseline; gap: 10px; }
.ve-includes__list .fad { margin: 0; font-size: .8571rem; color: var(--ve-accent-fg); }

.ve-traffic {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.ve-traffic__item {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    color: var(--ve-text);
    text-decoration: none !important;
    transition: border-color .15s ease, background-color .15s ease;
}
.ve-traffic__item:hover,
.ve-traffic__item:focus-visible { border-color: var(--ve-accent); background: var(--ve-surface-2); color: var(--ve-text); }
.ve-traffic__size { color: var(--ve-text-strong,#fff); font-size: 1.75rem; font-weight: 700; line-height: 1; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.ve-traffic__size small { margin-left: 4px; color: var(--ve-text-muted); font-size: .8571rem; font-weight: 600; letter-spacing: .04em; }
.ve-traffic__price { padding-top: 12px; border-top: 1px solid var(--ve-line); color: var(--ve-text-muted); font-weight: 600; font-variant-numeric: tabular-nums; }
.ve-traffic__item:hover .ve-traffic__price { color: var(--ve-accent-fg); }

.ve-pay {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin: 0;
    padding: 0;
    list-style: none;
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    overflow: hidden;
}
.ve-pay li {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    padding: 20px;
    background: var(--ve-surface);
}
.ve-pay li + li { border-left: 1px solid var(--ve-line); }
.ve-pay__icon { display: block; margin: 0 0 14px; color: var(--ve-text); font-size: 1.6rem; line-height: 1; }
.ve-pay__icon.fad { color: var(--ve-text); font-size: 1.6rem; margin: 0 0 14px; }
.ve-pay__icon--bch { transform: rotate(-28deg); }
.ve-pay__svg { width: 1.6rem; height: 1.6rem; }
.ve-pay__name { color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-pay__code { color: var(--ve-text-faint); font-size: .7857rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }

@media (max-width: 991.98px) {
    .ve-includes { grid-template-columns: minmax(0, 1fr); gap: 16px; }
    .ve-includes__list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ve-traffic { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ve-pay { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ve-pay li:nth-child(3n + 1) { border-left: 0; }
    .ve-pay li:nth-child(n + 4) { border-top: 1px solid var(--ve-line); }
}
@media (max-width: 767.98px) {
    .ve-premium { padding-top: 32px; }
    .ve-premium__section + .ve-premium__section { margin-top: 40px; padding-top: 32px; }
    .ve-plans { grid-template-columns: minmax(0, 1fr); }
    .ve-plan + .ve-plan { border-left: 0; border-top: 1px solid var(--ve-line); }
    .ve-includes__list { grid-template-columns: minmax(0, 1fr); }
    .ve-traffic { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ve-traffic li:last-child:nth-child(odd) { grid-column: span 2; }
    .ve-pay { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ve-pay li:nth-child(n) { border-left: 0; border-top: 0; }
    .ve-pay li:nth-child(2n) { border-left: 1px solid var(--ve-line); }
    .ve-pay li:nth-child(n + 3) { border-top: 1px solid var(--ve-line); }
}

/* Earn money rates */
.ve-site .make-money .rates li,
.ve-site .make-money .other-rates .rates {
    background: var(--ve-surface);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    overflow: hidden;
}
.ve-site .make-money .rates li .rate,
.ve-site .make-money .other-rates .rates .rate {
    background: var(--ve-surface-2);
    border-top: 1px solid var(--ve-line);
    color: var(--ve-accent-fg);
}
.ve-site .make-money .other-rates .rates .rate { border-top: 0; border-left: 1px solid var(--ve-line); }
.ve-site .make-money .rates li .countries span,
.ve-site .make-money .other-rates .rates .countries span { background: transparent; border-bottom: 1px solid var(--ve-line); margin: 0; }

/* =========================================================
   Dashboard app shell (left sidebar)
   ========================================================= */
.ve-app .main-menu {
    background: var(--ve-canvas);
    border-bottom: 1px solid var(--ve-line);
}
/* The account and notification menus sit outside the collapsible menu, so below 992px they must
   still float. Bootstrap makes navbar dropdowns static there, which stretched the header. */
.main-menu > .container-fluid > .navbar-nav { flex-direction: row; align-items: center; }
.main-menu > .container-fluid > .navbar-nav > .nav-item { margin: 0; }
.main-menu > .container-fluid > .navbar-nav > .nav-item > .nav-link { margin: 0 5px; }
.main-menu > .container-fluid > .navbar-nav .dropdown-menu,
.main-menu > .container-fluid > .notifications-mobile .dropdown-menu { position: absolute; }
.ve-app .sidebar { background: var(--ve-surface); border-top: 0; }
.ve-app .sidebar ul .nav-item .nav-link:after { content: none; }

/* Header navigation row (kept horizontal) */
.ve-app .sidebar:not(.settings-page) { border-bottom: 1px solid var(--ve-line); }
@media (min-width: 769px) {
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link {
        color: var(--ve-text-muted);
        font-weight: 500;
        padding: 16px 18px 16px 46px;
        border-bottom: 2px solid transparent;
    }
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link i,
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link svg { top: 50%; transform: translateY(-50%); left: 18px; font-size: 1.15rem; color: var(--ve-text-faint); }
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link:hover,
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link:focus { color: var(--ve-text-strong,#fff); }
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link.active { color: var(--ve-text-strong,#fff); border-bottom-color: var(--ve-accent); }
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link.active i,
    .ve-app .sidebar:not(.settings-page) ul .nav-item .nav-link.active svg { color: var(--ve-accent-fg); }
}

/* Settings: secondary navigation inside the panel */
.ve-app .the_box .sidebar { width: 260px; border-right-color: var(--ve-line); padding-right: 24px; margin-right: 32px; }
.ve-app .the_box .sidebar .status-block {
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius-sm);
    padding: 14px;
}
.ve-app .the_box .sidebar .status-block > i { font-size: 1.9rem; }
.ve-app .the_box .sidebar .menu ul li { margin: 0 0 2px; }
.ve-app .the_box .sidebar .menu ul li a {
    background: transparent;
    border-left: 0;
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-muted);
    font-size: 1rem;
    font-weight: 500;
    padding: 9px 12px 9px 42px;
}
.ve-app .the_box .sidebar .menu ul li a i { left: 13px; font-size: 1.07rem; color: var(--ve-text-faint); }
.ve-app .the_box .sidebar .menu ul li a:hover { color: var(--ve-text-strong,#fff); background: rgba(var(--ve-ov,255,255,255),0.04); }
.ve-app .the_box .sidebar .menu ul li a.active {
    color: var(--ve-text-strong,#fff);
    background: var(--ve-surface-2);
    border-radius: 0 var(--ve-radius-sm) var(--ve-radius-sm) 0;
}
.ve-app .the_box .sidebar .menu ul li a.active:before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 2px;
    background: var(--ve-accent);
}
.ve-app .the_box .sidebar .menu ul li a.active i { color: var(--ve-accent-fg); }
@media (max-width: 768px) {
    .ve-app .the_box .sidebar { width: auto; border-right: 0; border-bottom-color: var(--ve-line); padding-right: 0; margin-right: 0; }
}

/* Dashboard stat tiles: flat, icon tile + value */
.ve-app .widget_area .widget_box {
    background: var(--ve-surface);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
    box-shadow: none;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    padding: 18px;
}
.ve-app .widget_area .widget_box .icon {
    position: static;
    transform: none;
    order: -1;
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    margin: 0 14px 0 0;
    background: none !important;
    border: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ve-app .widget_area .widget_box .icon i,
.ve-app .widget_area .widget_box .icon svg {
    position: static;
    transform: none;
    font-size: 1.6rem;
    left: auto;
    color: var(--ve-accent-fg);
}
.ve-app .widget_area .widget_box .info { padding-left: 0; width: auto; min-width: 0; flex: 1 1 auto; }
.ve-app .widget_area .widget_box .info .money { font-size: 1.3rem; letter-spacing: -0.01em; }
.ve-app .widget_area .widget_box .info span:not(.money) { color: var(--ve-text-muted); font-weight: 500; font-size: .9286rem; }

/* =========================================================
   Accessibility
   ========================================================= */
a:focus-visible,
button:focus-visible,
.btn:focus-visible,
.nav-link:focus-visible {
    outline: 2px solid var(--ve-accent) !important;
    outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
    .btn, .upload-content .browse { transition: none; }
}

/* Focus rings only for keyboard focus; never on mouse click */
.btn:focus:not(:focus-visible),
.btn.btn-primary:focus:not(:focus-visible),
.btn.btn-primary.dropdown-toggle:focus:not(:focus-visible) { box-shadow: none !important; outline: 0 !important; }
.ve-site .faq .accordion .card .card-header .btn:focus { box-shadow: none !important; }
.ve-site .faq .accordion .card .card-header .btn:focus-visible { outline: 2px solid var(--ve-accent) !important; outline-offset: -2px; }

/* =========================================================
   Dashboard buttons: calmer secondary/danger treatments
   ========================================================= */
.ve-app .btn-success,
.ve-app .btn-info,
.ve-app .btn-warning {
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.ve-app .btn-success:hover, .ve-app .btn-success:focus,
.ve-app .btn-info:hover, .ve-app .btn-info:focus,
.ve-app .btn-warning:hover, .ve-app .btn-warning:focus {
    background: var(--ve-raised);
    border-color: rgba(var(--ve-ov,255,255,255),0.2);
    color: var(--ve-text-strong,#fff);
}
.ve-app .btn-danger {
    background: transparent;
    border: 1px solid rgba(239, 83, 80, 0.45);
    color: var(--ve-danger,#ff7b78);
}
.ve-app .btn-danger:hover, .ve-app .btn-danger:focus {
    background: #d93b38;
    border-color: #d93b38;
    color: var(--ve-on-accent,#fff);
}
.ve-app .btn-sm { padding: 5px 12px; font-size: .8571rem; }
.ve-app .btn-sm i { font-size: .85em; opacity: .85; }

/* =========================================================
   Remote upload list
   ========================================================= */
.ve-app .remote-list { table-layout: fixed; width: 100%; margin: 0; }
.ve-app .remote-list thead th {
    border-top: 0;
    border-bottom: 1px solid var(--ve-line-strong);
    color: var(--ve-text-faint);
    font-size: .7857rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    text-align: left !important;
    padding: 10px 12px;
    white-space: nowrap;
}
.ve-app .remote-list thead th:first-child { width: 36px !important; }
.ve-app .remote-list thead th:nth-child(2) { width: 32%; }
.ve-app .remote-list thead th:nth-child(3) { width: 158px; }
.ve-app .remote-list thead th:last-child { width: 200px !important; text-align: right !important; }
.ve-app .table-striped.remote-list tbody tr:nth-of-type(odd) { background: transparent; }
.ve-app .remote-list tbody tr { transition: background-color .12s ease; }
.ve-app .remote-list tbody tr:hover { background: rgba(var(--ve-ov,255,255,255),0.025); }
.ve-app .remote-list tbody td {
    border-top: 0;
    border-bottom: 1px solid var(--ve-line);
    padding: 14px 12px;
    vertical-align: top;
    text-align: left !important;
    color: var(--ve-text);
    font-size: .9286rem;
    line-height: 1.45;
    overflow-wrap: anywhere;
}
.ve-app .remote-list tbody td:last-child { text-align: right !important; white-space: nowrap; }
.ve-app .remote-list tbody td:last-child .btn + .btn { margin-left: 6px; }
.ve-app .remote-list tbody tr td > .fad { font-size: 1.07rem; margin-top: 2px; }

/* URL cell: name on top, source link on one truncated line */
.ve-app .remote-list small {
    display: flex;
    align-items: center;
    gap: 4px;
    margin-top: 4px;
    font-size: .8125rem;
    color: var(--ve-text-faint);
    min-width: 0;
}
.ve-app .remote-list small a {
    color: var(--ve-text-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    min-width: 0;
}
.ve-app .remote-list small a:hover { color: var(--ve-accent-fg); }
.ve-app .remote-list .fa-external-link { flex: 0 0 auto; margin: 0; color: var(--ve-text-faint); }

/* Added column */
.ve-app .remote-list tbody td:nth-child(3) { color: var(--ve-text-muted); font-variant-numeric: tabular-nums; font-size: .8571rem; white-space: nowrap; overflow-wrap: normal; }

/* Status: one line; full text opens in a modal (assets/js/ve_ui.js) */
.ve-app .remote-list .enc_value { color: var(--ve-text-muted); }
.ve-app .remote-list .enc_value > div {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.ve-app .remote-list td.enc_td.ve-truncated { cursor: pointer; }
.ve-app .remote-list td.enc_td.ve-truncated:after {
    content: "View details";
    display: inline-block;
    margin-top: 4px;
    color: var(--ve-accent-fg);
    font-size: .8125rem;
    font-weight: 500;
}
.ve-app .remote-list td.enc_td.ve-truncated:hover:after { text-decoration: underline; }
.ve-app .remote-list td.enc_td.ve-truncated:focus-visible { outline: 2px solid var(--ve-accent); outline-offset: -2px; }
.ve-app .remote-list tr:has(.fa-exclamation-circle) .enc_value { color: var(--ve-t-red,#f0a3a1); }
.ve-app .remote-list .enc_status {
    position: absolute;
    left: 0;
    bottom: -8px;
    height: 2px;
    background: var(--ve-fill);
    border-radius: 2px;
}
.ve-app .remote-list .enc_status[style*="width: 0%"],
.ve-app .remote-list .enc_status[style*="width: 100%"] { display: none; }


/* Detail modal (long status / log text) */
.ve-detail-modal .modal-content {
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.ve-detail-modal__head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    padding: 18px 20px 14px;
    border-bottom: 1px solid var(--ve-line);
}
.ve-detail-modal__title { margin: 0; font-size: 1.07rem; font-weight: 600; color: var(--ve-text-strong,#fff); }
.ve-detail-modal__meta { margin: 4px 0 0; color: var(--ve-text-faint); font-size: .8571rem; overflow-wrap: anywhere; }
.ve-detail-modal__meta:empty { display: none; }
.ve-detail-modal__close {
    background: transparent;
    border: 0;
    color: var(--ve-text-muted);
    font-size: 1.15rem;
    line-height: 1;
    padding: 4px;
    cursor: pointer;
}
.ve-detail-modal__close:hover { color: var(--ve-text-strong,#fff); }
.ve-detail-modal__body {
    margin: 0;
    padding: 16px 20px;
    max-height: 55vh;
    overflow: auto;
    background: var(--ve-canvas);
    color: var(--ve-text);
    font-family: SFMono-Regular, Consolas, 'Liberation Mono', Menlo, monospace;
    font-size: .8571rem;
    line-height: 1.6;
    white-space: pre-wrap;
    word-break: break-word;
}
.ve-detail-modal__foot {
    display: flex;
    justify-content: flex-end;
    gap: 8px;
    padding: 12px 20px;
    border-top: 1px solid var(--ve-line);
}

/* =========================================================
   Overlays in the dark design language: modals, dropdowns, notifications
   ========================================================= */
.modal .modal-content {
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.modal .modal-content .modal-header {
    background: var(--ve-surface);
    border-bottom: 1px solid var(--ve-line);
    padding: 18px 20px 14px;
    align-items: center;
}
.modal .modal-title,
.modal .modal-content .modal-header h5,
.modal .modal-content .modal-header h4 { color: var(--ve-text-strong,#fff); font-size: 1.07rem; font-weight: 600; margin: 0; }
.modal .close,
.modal .modal-content .modal-header .close {
    color: var(--ve-text-muted);
    opacity: 1;
    text-shadow: none;
    font-size: 1.5rem;
    font-weight: 300;
}
.modal .close:hover,
.modal .modal-content .modal-header .close:hover { color: var(--ve-text-strong,#fff); }
.modal .modal-body { color: var(--ve-text); }
.modal .modal-body .text-muted,
.modal .modal-body small { color: var(--ve-text-muted) !important; }
.modal .modal-content .modal-footer { border-top: 1px solid var(--ve-line); border-radius: 0; }
.modal .list-group-item {
    background: transparent;
    border-color: var(--ve-line);
    color: var(--ve-text);
}
.modal .list-group { border-radius: var(--ve-radius-sm); }
.modal .list-group-item:first-child { border-top-left-radius: var(--ve-radius-sm); border-top-right-radius: var(--ve-radius-sm); }
.modal .list-group-item:last-child { border-bottom-left-radius: var(--ve-radius-sm); border-bottom-right-radius: var(--ve-radius-sm); }
.modal .form-control,
.modal .custom-select,
.modal textarea {
    background: var(--ve-canvas);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.modal .form-control::placeholder { color: var(--ve-text-faint); }
.modal label { color: var(--ve-text); }
.modal .custom-control,
.modal .upload_srt label.d-block,
.modal .srt_list,
.modal#pay_plan .modal-content .modal-body,
.modal#pay_bw .modal-content .modal-body { color: var(--ve-text); }
.modal .custom-control .custom-control-label:before { background: var(--ve-surface-2); border-color: var(--ve-line-strong); }
.modal .nav-pills .nav-item .nav-link { color: var(--ve-text-muted); background: var(--ve-surface-2); border-radius: var(--ve-radius-sm); }
.modal .nav-pills .nav-item .nav-link.active { color: var(--ve-on-accent,#fff); background: var(--ve-fill); }
.modal .alert-warning {
    background: rgba(240, 180, 41, 0.08);
    border: 1px solid rgba(240, 180, 41, 0.25);
    color: var(--ve-amber,#f1cf73);
}

/* Content type picker */
.modal#content_type .modal-body .custom-control .custom-control-label {
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-muted);
}
.modal#content_type .modal-body .custom-control .custom-control-input:checked ~ .custom-control-label {
    border-color: var(--ve-fill);
    background: var(--ve-accent-soft);
    color: var(--ve-text-strong,#fff);
}

/* Sign in / register / password modals: one compact column */
.modal#login .modal-dialog,
.modal#register .modal-dialog,
.modal#fpass .modal-dialog,
.modal#ve-save-account .modal-dialog {
    max-width: 420px;
    margin-left: auto;
    margin-right: auto;
}
@media (max-width: 575.98px) {
    .modal#login .modal-dialog,
    .modal#register .modal-dialog,
    .modal#fpass .modal-dialog,
.modal#ve-save-account .modal-dialog { margin: 16px; max-width: none; }
}
.modal#login .modal-content,
.modal#register .modal-content,
.modal#fpass .modal-content,
.modal#ve-save-account .modal-content {
    display: block;
    position: relative;
    overflow: hidden;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius);
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.55);
}
.modal#login .modal-body,
.modal#register .modal-body,
.modal#fpass .modal-body,
.modal#ve-save-account .modal-body { color: var(--ve-text) !important; }
.modal#login .modal-content > .close,
.modal#register .modal-content > .close,
.modal#fpass .modal-content > .close,
.modal#ve-save-account .modal-content > .close {
    position: absolute;
    top: 18px;
    right: 18px;
    z-index: 2;
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    padding: 0;
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-muted);
    font-size: 1rem;
    opacity: 1;
    text-shadow: none;
    transition: background-color .15s ease, color .15s ease;
}
.modal#login .modal-content > .close:hover,
.modal#register .modal-content > .close:hover,
.modal#fpass .modal-content > .close:hover,
.modal#ve-save-account .modal-content > .close:hover { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }
.modal#login .modal-content > .close .fad,
.modal#register .modal-content > .close .fad,
.modal#fpass .modal-content > .close .fad,
.modal#ve-save-account .modal-content > .close .fad { margin: 0; font-size: 1rem; color: inherit; }

.modal .auth-box,
.modal#login .modal-dialog .modal-body .auth-box,
.modal#register .modal-dialog .modal-body .auth-box,
.modal#fpass .modal-dialog .modal-body .auth-box,
.modal#ve-save-account .modal-dialog .modal-body .auth-box { display: block !important; }
.modal .auth-box .bg-auth,
.modal#login .modal-dialog .modal-body .auth-box .bg-auth,
.modal#register .modal-dialog .modal-body .auth-box .bg-auth,
.modal#fpass .modal-dialog .modal-body .auth-box .bg-auth,
.modal#ve-save-account .modal-dialog .modal-body .auth-box .bg-auth {
    display: block;
    width: auto;
    padding: 28px 64px 0 28px;
    background: transparent !important;
    border: 0;
    text-align: left !important;
}
.modal .auth-box .bg-auth img { display: none !important; }
.modal .auth-box .bg-auth .title,
.modal#login .modal-dialog .modal-body .auth-box .bg-auth .title,
.modal#register .modal-dialog .modal-body .auth-box .bg-auth .title,
.modal#fpass .modal-dialog .modal-body .auth-box .bg-auth .title,
.modal#ve-save-account .modal-dialog .modal-body .auth-box .bg-auth .title {
    margin: 0 0 6px;
    color: var(--ve-text-strong,#fff);
    font-size: 1.375rem;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.modal .auth-box .auth-sub { margin: 0; color: var(--ve-text-muted); font-size: .9286rem; line-height: 1.45; }
.modal .auth-box form,
.modal#login .modal-dialog .modal-body .auth-box form,
.modal#register .modal-dialog .modal-body .auth-box form,
.modal#fpass .modal-dialog .modal-body .auth-box form,
.modal#ve-save-account .modal-dialog .modal-body .auth-box form {
    width: auto;
    padding: 24px 28px 28px;
}
.modal .auth-box form .form-group { margin-bottom: 16px; }
.modal .auth-box form label {
    margin-bottom: 6px;
    color: var(--ve-text-muted);
    font-size: .8571rem;
    font-weight: 600;
}
.modal .auth-box form .form-control {
    height: 42px;
    padding-right: 40px;
    background: var(--ve-canvas);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text);
}
.modal .auth-box form .form-control::placeholder { color: var(--ve-text-faint); }
.modal .auth-box form .form-control:focus { border-color: var(--ve-fill); box-shadow: 0 0 0 1px var(--ve-fill); }
.modal .auth-box form .form-group .form-control + .feather { right: 12px; bottom: 12px; width: 18px; height: 18px; color: var(--ve-text-faint); }
.modal .auth-box form .form-group .form-control:focus + .feather { color: var(--ve-accent-fg); }

/* Primary row: full-width submit, secondary link on its own line */
.modal .auth-box form .form-group.mt-3 {
    display: flex !important;
    flex-direction: column;
    align-items: stretch !important;
    gap: 12px;
    margin: 20px 0 0 !important;
}
.modal .auth-box form .form-group.mt-3 .btn-primary {
    width: 100%;
    height: 42px;
    justify-content: center;
    display: inline-flex;
    align-items: center;
    font-weight: 600;
}
.modal .auth-box form .form-group.mt-3 .fpass {
    align-self: center;
    color: var(--ve-text-muted) !important;
    font-size: .8571rem;
}
.modal .auth-box form .form-group.mt-3 .fpass:hover { color: var(--ve-text-strong,#fff) !important; }
.modal .auth-box form hr {
    position: relative;
    margin: 20px 0;
    border-top: 1px solid var(--ve-line);
}
.modal .auth-box form .action .btn-default {
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent !important;
    border: 1px solid var(--ve-line-strong) !important;
    color: var(--ve-text) !important;
    font-weight: 600;
}
.modal .auth-box form .action .btn-default:hover { background: var(--ve-surface-2) !important; border-color: rgba(var(--ve-ov,255,255,255),0.24) !important; color: var(--ve-text-strong,#fff) !important; }
.modal .auth-box form .action .btn-default .fad { color: inherit; }
.modal .auth-box .ve-save-account__alert .alert { margin-bottom: 16px; }
.modal .auth-box .alert-danger,
.modal .auth-box .alert-success { border-radius: var(--ve-radius-sm); font-size: .8571rem; }

/* Dropdown menus (account, actions) */
.dropdown-menu {
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line-strong);
    color: var(--ve-text);
}
.dropdown-menu .dropdown-item { color: var(--ve-text); }
.dropdown-menu .dropdown-item i { color: var(--ve-text-faint); }
.dropdown-menu .dropdown-item:hover,
.dropdown-menu .dropdown-item:focus { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }
.dropdown-menu .dropdown-item:hover i { color: var(--ve-accent-fg); }
.dropdown-menu .dropdown-divider { border-top-color: var(--ve-line); }
.dropdown-menu .dropdown-item.logout { background: transparent; color: var(--ve-danger,#ff7b78); margin-top: 0; }
.dropdown-menu .dropdown-item.logout:hover { background: rgba(239, 83, 80, 0.12); color: var(--ve-t-red,#ff9c9a); }

/* Notifications panel */
.dropdown-menu.notifications-box { background: var(--ve-surface); }
.dropdown-menu.notifications-box .title { background: var(--ve-surface); border-bottom: 1px solid var(--ve-line); padding: 14px 16px; }
.dropdown-menu.notifications-box .title span { font-size: 1rem; font-weight: 600; }
.dropdown-menu.notifications-box .notifications-list li { border-bottom: 1px solid var(--ve-line); padding: 12px 16px; }
.dropdown-menu.notifications-box .notifications-list li:hover { background: rgba(var(--ve-ov,255,255,255),0.03); }
.dropdown-menu.notifications-box .notifications-list li:not(.new) { opacity: 1; }
.dropdown-menu.notifications-box .notifications-list li:not(.new) a.description strong { color: var(--ve-text-muted); }
.dropdown-menu.notifications-box .notifications-list li a { color: var(--ve-text); }
.dropdown-menu.notifications-box .notifications-list li a.description strong { color: var(--ve-text-strong,#fff); font-size: .9286rem; font-weight: 600; }
.dropdown-menu.notifications-box .notifications-list li a.description p { color: var(--ve-text-muted); font-size: .8571rem; margin: 2px 0 6px; }
.dropdown-menu.notifications-box .notifications-list li a.description span { color: var(--ve-text-faint); font-weight: 500; font-size: .7857rem; }
.dropdown-menu.notifications-box .notifications-list li a.description span i { color: var(--ve-text-faint); }
.dropdown-menu.notifications-box .notifications-list li.new { position: relative; }
.dropdown-menu.notifications-box .notifications-list li.new:before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; background: var(--ve-accent); }
.dropdown-menu.notifications-box .notifications-list li a.mark_read { color: var(--ve-accent-fg); }
.dropdown-menu.notifications-box .notifications-list li a.mark_read:hover { color: var(--ve-t-blue,#86a8ff); }
.dropdown-menu.notifications-box .btn-link { color: var(--ve-text-muted); }
.dropdown-menu.notifications-box .btn-link.text-danger { color: var(--ve-danger,#ff7b78) !important; }

/* Notification detail modal (built by main.js / theme_panel.js with legacy text-dark classes) */
#notifications .modal-body { padding: 20px 24px; color: var(--ve-text) !important; }
#notifications .modal-body p { margin: 0 0 12px; color: var(--ve-text) !important; font-size: .9375rem; line-height: 1.55; overflow-wrap: anywhere; }
#notifications .modal-body small { color: var(--ve-text-faint) !important; font-size: .8125rem; font-weight: 500 !important; }
#notifications .modal-footer { padding: 14px 24px; }
#notifications .modal-footer .btn { display: inline-flex; align-items: center; height: 38px; padding: 0 16px; font-weight: 600; }
#notifications .modal-footer .btn .fad { margin-right: 8px !important; font-size: .875rem; color: inherit; }
#notifications .modal-footer .btn-outline-danger { background: transparent; border-color: rgba(var(--ve-danger-rgb,255,123,120),0.35); color: var(--ve-danger,#ff7b78); }
#notifications .modal-footer .btn-outline-danger:hover,
#notifications .modal-footer .btn-outline-danger:focus-visible { background: rgba(var(--ve-danger-rgb,255,123,120),0.1); border-color: rgba(var(--ve-danger-rgb,255,123,120),0.6); color: var(--ve-danger-soft,#ff9a97); }
#notifications .modal-footer .btn-secondary { background: transparent; border: 1px solid var(--ve-line-strong); color: var(--ve-text); }
#notifications .modal-footer .btn-secondary:hover,
#notifications .modal-footer .btn-secondary:focus-visible { background: var(--ve-surface-2); border-color: rgba(var(--ve-ov,255,255,255),0.24); color: var(--ve-text-strong,#fff); }


/* =========================================================
   Date picker (assets/js/ve_datepicker.js)
   ========================================================= */
.ve-date-host { position: relative; display: inline-flex; flex-wrap: nowrap; width: auto; }
.ve-date__native {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    border: 0 !important;
    opacity: 0;
    pointer-events: none;
    clip: rect(0 0 0 0);
}
.ve-date { position: relative; }
.ve-date__trigger {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    min-width: 172px;
    height: 38px;
    padding: 0 12px 0 14px;
    background: var(--ve-canvas);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text);
    font: inherit;
    font-size: .9286rem;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
    text-align: left;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease;
}
.ve-date__trigger:hover { border-color: rgba(var(--ve-ov,255,255,255),0.24); }
.ve-date.is-open .ve-date__trigger,
.ve-date__trigger:focus-visible { border-color: var(--ve-fill); box-shadow: 0 0 0 1px var(--ve-fill); outline: 0 !important; }
.ve-date__trigger.is-empty .ve-date__value { color: var(--ve-text-faint); }
.ve-date__icon { color: var(--ve-text-faint); font-size: 1rem; transition: color .15s ease; }
.ve-date__trigger:hover .ve-date__icon,
.ve-date.is-open .ve-date__icon { color: var(--ve-accent-fg); }

.ve-date__pop {
    position: absolute;
    top: calc(100% + 6px);
    left: 0;
    z-index: 1060;
    width: 288px;
    padding: 12px;
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.5);
}
.ve-date__pop[hidden] { display: none; }
.ve-date__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 8px; }
.ve-date__title { color: var(--ve-text-strong,#fff); font-weight: 600; font-size: .9286rem; }
.ve-date__nav {
    width: 32px;
    height: 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    border: 0;
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-muted);
    cursor: pointer;
}
.ve-date__nav:hover { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }
.ve-date__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 2px 0; }
.ve-date__dow {
    padding: 6px 0;
    text-align: center;
    color: var(--ve-text-faint);
    font-size: .7857rem;
    font-weight: 600;
    letter-spacing: .04em;
}
.ve-date__day {
    height: 34px;
    background: transparent;
    border: 0;
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text);
    font: inherit;
    font-size: .8571rem;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
}
.ve-date__day:hover:not([disabled]) { background: var(--ve-raised); color: var(--ve-text-strong,#fff); }
.ve-date__day.is-outside { color: var(--ve-text-faint); }
/* Range: one continuous band from start to end, rounded only at its outer ends and row breaks. */
.ve-date__day.is-in-range,
.ve-date__day.is-range-start,
.ve-date__day.is-range-end { background: rgba(var(--ve-accent-rgb,74,125,255),0.12); color: var(--ve-text-strong,#dfe6ff); border-radius: 0; }
.ve-date__day.is-in-range.is-outside { color: var(--ve-text-muted,rgba(223, 230, 255, 0.45)); }
.ve-date__day.is-in-range:hover:not([disabled]) { background: rgba(var(--ve-accent-rgb,74,125,255),0.22); }
.ve-date__day.is-range-start,
.ve-date__day.is-in-range:nth-child(7n+1) { border-top-left-radius: var(--ve-radius-sm); border-bottom-left-radius: var(--ve-radius-sm); }
.ve-date__day.is-range-end,
.ve-date__day.is-in-range:nth-child(7n) { border-top-right-radius: var(--ve-radius-sm); border-bottom-right-radius: var(--ve-radius-sm); }
.ve-date__day.is-range-edge { color: var(--ve-accent-fg); font-weight: 600; }
.ve-date__day.is-today { color: var(--ve-accent-fg); font-weight: 700; }
.ve-date__day.is-selected,
.ve-date__day.is-selected:hover { background: var(--ve-fill); color: var(--ve-on-accent,#fff); font-weight: 600; }
.ve-date__day[disabled] { opacity: .3; cursor: not-allowed; }
.ve-date__day:focus { outline: 0 !important; }
.ve-date__day:focus-visible { box-shadow: inset 0 0 0 2px var(--ve-accent); }
.ve-date__day.is-selected:focus-visible { box-shadow: inset 0 0 0 2px rgba(var(--ve-ov,255,255,255),0.85); }
.ve-date__foot { display: flex; justify-content: flex-end; margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--ve-line); }
.ve-date__today {
    background: transparent;
    border: 0;
    color: var(--ve-accent-fg);
    font: inherit;
    font-size: .8571rem;
    font-weight: 600;
    padding: 4px 6px;
    border-radius: var(--ve-radius-sm);
    cursor: pointer;
}
.ve-date__today:hover { background: var(--ve-accent-soft); }
.ve-app [data-reports-form] label { cursor: pointer; color: var(--ve-text-muted); }

/* ---------------------------------------------------------------------------
 * Video search (/search) — app/modules/search.php
 * ------------------------------------------------------------------------- */
.ve-app .ve-search-page { min-height: calc(100vh - 260px); }
@media (min-width: 576px) {
    /* the dashboard sub-nav (#menu) is absolutely positioned under the header */
    .ve-app .ve-search-page { padding-top: 56px; }
}
.ve-app .ve-search-shell { max-width: 1350px; padding: 28px 24px 24px; }
.ve-app .ve-search-hero { margin-bottom: 28px; }
.ve-app .ve-search-hero__heading { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 20px; }
.ve-app .ve-search-hero__title { margin: 0; color: var(--ve-text-strong,#fff); font-size: 1.85rem; font-weight: 700; letter-spacing: -.01em; }
.ve-app .ve-search-hero__badge {
    display: inline-flex; align-items: center; gap: 6px;
    padding: 3px 9px;
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-accent-fg);
    font-size: .75rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
}
.ve-app .ve-search-form {
    position: relative;
    display: flex; align-items: stretch; gap: 8px;
    max-width: 720px;
}
.ve-app .ve-search-form__icon {
    position: absolute; left: 14px; top: 50%; transform: translateY(-50%);
    color: var(--ve-text-faint); pointer-events: none;
}
.ve-app .ve-search-form__input {
    flex: 1 1 auto; min-width: 0;
    height: 46px; padding: 0 14px 0 40px;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text); font: inherit; font-size: 1rem;
}
.ve-app .ve-search-form__input::placeholder { color: var(--ve-text-faint); }
.ve-app .ve-search-form__input:focus { outline: none; border-color: var(--ve-accent); box-shadow: 0 0 0 1px var(--ve-accent); }
.ve-app .ve-search-form__input::-webkit-search-cancel-button { filter: invert(1) opacity(.5); }
.ve-app .ve-search-form__submit { flex: 0 0 auto; height: 46px; padding: 0 22px; font-weight: 600; }

.ve-app .ve-search-notice {
    display: flex; gap: 16px; align-items: flex-start;
    max-width: 720px; padding: 22px 24px;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
}
.ve-app .ve-search-notice__icon {
    flex: 0 0 40px; height: 40px;
    display: inline-flex; align-items: center; justify-content: center;
    border-radius: var(--ve-radius-sm);
    background: var(--ve-accent-soft); color: var(--ve-accent-fg); font-size: 1.1rem;
}
.ve-app .ve-search-notice__title { margin: 0 0 6px; color: var(--ve-text-strong,#fff); font-size: 1.15rem; font-weight: 700; }
.ve-app .ve-search-notice__text { margin: 0 0 16px; color: var(--ve-text-muted); }
.ve-app .ve-search-notice__actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ve-app .ve-search-notice__link { margin-left: 4px; font-weight: 600; }
.ve-app .ve-search-notice__link i { margin-left: 4px; font-size: .8em; }

.ve-app .ve-search-meta {
    display: flex; justify-content: space-between; align-items: baseline; gap: 12px; flex-wrap: wrap;
    margin-bottom: 14px; color: var(--ve-text-muted);
}
.ve-app .ve-search-meta strong { color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-app .ve-search-meta__page { color: var(--ve-text-faint); font-size: .875rem; font-variant-numeric: tabular-nums; }
.ve-app .ve-search-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 18px 16px;
    margin: 0; padding: 0; list-style: none;
}
.ve-app .ve-search-card__link { display: block; color: var(--ve-text); text-decoration: none; }
.ve-app .ve-search-card__thumb {
    position: relative; display: block; overflow: hidden;
    aspect-ratio: 16 / 9;
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line);
    border-radius: var(--ve-radius);
}
.ve-app .ve-search-card__thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ve-app .ve-search-card__placeholder {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
    color: var(--ve-text-faint); font-size: 1.6rem;
}
.ve-app .ve-search-card__duration {
    position: absolute; right: 6px; bottom: 6px;
    padding: 1px 6px;
    background: rgba(var(--ve-canvas-rgb,15,16,18),.88);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-strong,#fff); font-size: .75rem; font-weight: 600; font-variant-numeric: tabular-nums;
}
.ve-app .ve-search-card__title {
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    margin-top: 10px; color: var(--ve-text-strong,#fff); font-weight: 600; line-height: 1.35;
}
.ve-app .ve-search-card__meta { display: flex; flex-wrap: wrap; gap: 2px 12px; margin-top: 4px; color: var(--ve-text-muted); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.ve-app .ve-search-card__fact { white-space: nowrap; }
.ve-app .ve-search-card__meta i { margin-right: 3px; color: var(--ve-text-faint); }
.ve-app .ve-search-card__link:hover .ve-search-card__thumb,
.ve-app .ve-search-card__link:focus-visible .ve-search-card__thumb { border-color: var(--ve-accent); }
.ve-app .ve-search-card__link:hover .ve-search-card__title { color: var(--ve-accent-fg); }
.ve-app .ve-search-card__link:focus-visible { outline: none; }
.ve-app .ve-search-empty {
    padding: 48px 16px; text-align: center; color: var(--ve-text-muted);
    background: var(--ve-surface); border: 1px solid var(--ve-line); border-radius: var(--ve-radius);
}
.ve-app .ve-search-empty i { display: block; margin-bottom: 10px; font-size: 1.8rem; color: var(--ve-text-faint); }
.ve-app .ve-search-empty p { margin: 0; }
.ve-app .ve-search-pagination { margin-top: 28px; }
.ve-app .ve-search-pagination .page-link { min-width: 38px; text-align: center; }
.ve-app .ve-search-pagination .page-item.disabled .page-link { background: transparent; color: var(--ve-text-faint); }

@media (max-width: 575.98px) {
    .ve-app .ve-search-shell { padding: 20px 16px 16px !important; }
    .ve-app .ve-search-hero__title { font-size: 1.5rem; }
    .ve-app .ve-search-form__submit { padding: 0 16px; }
    .ve-app .ve-search-notice { flex-direction: column; padding: 18px; }
    .ve-app .ve-search-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
}


/* =========================================================
   Data tables (reports and other dashboard tables)
   ========================================================= */
.ve-app .table { color: var(--ve-text); margin-bottom: 0; }
.ve-app .table thead th {
    border-top: 0;
    border-bottom: 1px solid var(--ve-line-strong);
    color: var(--ve-text-muted);
    font-size: .7857rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
    padding: 10px 16px;
    white-space: nowrap;
}
.ve-app .table td {
    border-top: 0;
    border-bottom: 1px solid var(--ve-line);
    padding: 12px 16px;
    vertical-align: middle;
}
.ve-app .table-striped tbody tr:nth-of-type(odd) { background: transparent; }
.ve-app .table tbody tr { transition: background-color .12s ease; }
.ve-app .table tbody tr:hover { background: rgba(var(--ve-ov,255,255,255),0.025); }
.ve-app .table .is-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ve-app .table td.is-zero { color: var(--ve-text-faint); }

.ve-app .reports-table td,
.ve-app .reports-table th { font-size: .9286rem; }
.ve-app .reports-table thead th:first-child,
.ve-app .reports-table td:first-child { padding-left: 4px; }
.ve-app .reports-table thead th:last-child,
.ve-app .reports-table td:last-child { padding-right: 4px; }
.ve-app .reports-date { color: var(--ve-text); white-space: nowrap; }
.ve-app .reports-date__day {
    display: inline-block;
    width: 36px;
    color: var(--ve-text-faint);
    font-size: .8125rem;
}
.ve-app .reports-table tfoot td {
    border-top: 1px solid var(--ve-line-strong);
    border-bottom: 0;
    padding-top: 14px;
    padding-bottom: 6px;
    color: var(--ve-text-strong,#fff);
    font-weight: 700;
}
.ve-app .reports-table tfoot td:first-child { color: var(--ve-text-muted); font-size: .7857rem; letter-spacing: .06em; text-transform: uppercase; }
.ve-app .reports-table .is-num { text-align: right !important; }

/* ---------------------------------------------------------------------------
 * Dashboard page heading row (title left, page action right)
 * ------------------------------------------------------------------------- */
.ve-app .ve-page-head {
    display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap;
    margin-bottom: 16px;
}
.ve-app .ve-page-head__title { margin: 0; }
.ve-app .ve-page-head__action i { margin-right: 6px; color: var(--ve-text-muted); }
.ve-app .ve-remote-page .the_box .upload_btn { display: none; }

/* ---------------------------------------------------------------------------
 * Delete confirmation dialog (iziToast, class "ve-confirm")
 * ------------------------------------------------------------------------- */
.iziToast-overlay { background-color: rgba(8, 9, 10, .72) !important; }
.iziToast.ve-confirm {
    width: 420px; max-width: calc(100vw - 32px);
    padding: 20px 20px 16px 72px;
    background: var(--ve-surface-2, #1e2024) !important;
    border: 1px solid var(--ve-line-strong, rgba(255, 255, 255, .14));
    border-radius: var(--ve-radius, 6px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .45);
    font-family: inherit;
}
.iziToast.ve-confirm::after { display: none; }
.iziToast.ve-confirm > .iziToast-body { padding-left: 0 !important; margin: 0 !important; min-height: 0 !important; }
.iziToast.ve-confirm > .iziToast-body .iziToast-icon {
    left: -52px !important; top: 0 !important; margin-top: 0 !important;
    width: 36px !important; height: 36px !important;
    display: flex !important; align-items: center; justify-content: center;
    border-radius: var(--ve-radius-sm, 4px);
    background: rgba(229, 72, 77, .14);
    color: var(--ve-t-red,#ff6b6f) !important; font-size: 16px !important; line-height: 1 !important;
}
.iziToast.ve-confirm .iziToast-texts { display: block !important; float: none !important; margin: 0 !important; padding: 0 !important; }
.iziToast.ve-confirm .iziToast-title {
    display: block !important; float: none !important;
    margin: 0 0 6px !important;
    color: var(--ve-text-strong,#fff) !important; font-size: 1.05rem !important; font-weight: 700 !important; line-height: 1.3 !important;
}
.iziToast.ve-confirm .iziToast-message {
    display: block !important; float: none !important;
    margin: 0 !important; padding: 0 !important;
    color: var(--ve-text-muted, #9b9ea6) !important; font-size: .875rem !important; line-height: 1.5 !important;
}
.iziToast.ve-confirm .iziToast-message strong { color: var(--ve-text, #f2f3f5); font-weight: 600; word-break: break-word; }
.iziToast.ve-confirm .iziToast-buttons {
    display: flex !important; justify-content: flex-end; gap: 8px;
    float: none !important; margin: 18px 0 0 -52px !important; min-height: 0 !important;
}
.iziToast.ve-confirm .iziToast-buttons > .ve-confirm__btn {
    margin: 0 !important; padding: 8px 16px !important;
    border: 1px solid var(--ve-line-strong, rgba(255, 255, 255, .14)) !important;
    border-radius: var(--ve-radius-sm, 4px) !important;
    background: var(--ve-raised, #26282d) !important;
    color: var(--ve-text, #f2f3f5) !important;
    font: inherit !important; font-size: .875rem !important; font-weight: 600 !important; line-height: 1.2 !important;
    letter-spacing: 0 !important; text-transform: none !important;
    box-shadow: none !important; cursor: pointer;
}
.iziToast.ve-confirm .iziToast-buttons > .ve-confirm__btn:hover { background: #2e3036 !important; }
.iziToast.ve-confirm .iziToast-buttons > .ve-confirm__btn--danger { background: #d93d42 !important; border-color: #d93d42 !important; color: var(--ve-on-accent,#fff) !important; }
.iziToast.ve-confirm .iziToast-buttons > .ve-confirm__btn--danger:hover { background: #c3343a !important; border-color: #c3343a !important; }
.iziToast.ve-confirm .iziToast-buttons > .ve-confirm__btn:focus-visible { outline: 2px solid var(--ve-accent, #4a7dff) !important; outline-offset: 2px; }

/* Auth modals, desktop: illustration panel left; title + form centred on the right.
   .bg-auth becomes display:contents so its title and image join the grid directly. */
@media (min-width: 768px) {
    .modal#login .modal-dialog,
    .modal#register .modal-dialog,
    .modal#fpass .modal-dialog,
.modal#ve-save-account .modal-dialog { max-width: 900px; }
    .modal .auth-box,
    .modal#login .modal-dialog .modal-body .auth-box,
    .modal#register .modal-dialog .modal-body .auth-box,
    .modal#fpass .modal-dialog .modal-body .auth-box,
.modal#ve-save-account .modal-dialog .modal-body .auth-box {
        display: grid !important;
        grid-template-columns: 420px minmax(0, 1fr);
        grid-template-rows: auto auto minmax(0, 1fr);
        min-height: 440px;
    }
    .modal .auth-box .bg-auth,
    .modal#login .modal-dialog .modal-body .auth-box .bg-auth,
    .modal#register .modal-dialog .modal-body .auth-box .bg-auth,
    .modal#fpass .modal-dialog .modal-body .auth-box .bg-auth,
.modal#ve-save-account .modal-dialog .modal-body .auth-box .bg-auth { display: contents; }
    .modal .auth-box .bg-auth img,
    .modal#login .modal-dialog .modal-body .auth-box .bg-auth img,
    .modal#register .modal-dialog .modal-body .auth-box .bg-auth img,
    .modal#fpass .modal-dialog .modal-body .auth-box .bg-auth img,
.modal#ve-save-account .modal-dialog .modal-body .auth-box .bg-auth img {
        display: block !important;
        grid-column: 1;
        grid-row: 3;
        position: static;
        top: auto;
        width: 100%;
        max-width: none;
        height: 100%;
        min-height: 0;
        margin: 0;
        padding: 24px 32px 40px;
        object-fit: contain;
        transform: none;
    }
    /* Title + intro sit at the top of the illustration panel; the panel colour runs behind all three. */
    .modal .auth-box .bg-auth .title,
    .modal .auth-box .bg-auth .auth-sub,
    .modal .auth-box .bg-auth img {
        background: var(--ve-surface-2);
        border-right: 1px solid var(--ve-line);
    }
    .modal .auth-box .bg-auth .title,
    .modal#login .modal-dialog .modal-body .auth-box .bg-auth .title,
    .modal#register .modal-dialog .modal-body .auth-box .bg-auth .title,
    .modal#fpass .modal-dialog .modal-body .auth-box .bg-auth .title,
.modal#ve-save-account .modal-dialog .modal-body .auth-box .bg-auth .title {
        grid-column: 1;
        grid-row: 1;
        margin: 0;
        padding: 40px 32px 0;
    }
    .modal .auth-box .bg-auth .auth-sub {
        grid-column: 1;
        grid-row: 2;
        padding: 8px 32px 0;
    }
    .modal .auth-box form,
    .modal#login .modal-dialog .modal-body .auth-box form,
    .modal#register .modal-dialog .modal-body .auth-box form,
    .modal#fpass .modal-dialog .modal-body .auth-box form,
.modal#ve-save-account .modal-dialog .modal-body .auth-box form {
        grid-column: 2;
        grid-row: 1 / -1;
        align-self: center;
        padding: 48px 36px 40px;
    }
}

/* Public header: mobile slide-in drawer */
@media (max-width: 768px) {
    .ve-site .main-menu .navbar-collapse {
        background: var(--ve-surface);
        border-left: 1px solid var(--ve-line);
        box-shadow: -16px 0 40px rgba(0, 0, 0, 0.5);
        padding: 16px 20px 24px;
    }
    .ve-site .main-menu .navbar-collapse .navbar-toggler { padding: 6px; color: var(--ve-text-muted); }
    .ve-site .main-menu .navbar-collapse .navbar-toggler .fad { margin: 0; font-size: 1.25rem; color: inherit; }
    .ve-site .main-menu .navbar-collapse .navbar-nav { margin: 8px 0 0 !important; }
    .ve-site .main-menu .navbar-collapse .navbar-nav .nav-item .nav-link {
        margin: 0;
        padding: 12px 0;
        border-bottom: 1px solid var(--ve-line);
        font-size: 1rem;
    }
    .ve-site .main-menu .navbar-collapse .navbar-nav .nav-item.active .nav-link { color: var(--ve-accent-fg); }
    .ve-site .main-menu .ve-nav-actions {
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
        margin: 20px 0 0;
        padding: 0;
        border: 0;
    }
    .ve-site .main-menu .ve-nav-actions .btn { flex: none; width: 100%; height: 42px; }
}

/* Earn money: section rhythm matching the premium page */
.ve-site .make-money { padding-top: 48px; }
.ve-site .make-money h2 { margin: 0 0 20px; color: var(--ve-text-strong,#fff); font-size: 1.5rem; font-weight: 700; letter-spacing: -0.01em; }
.ve-site .make-money > .col-md-12 { padding-left: 0; padding-right: 0; }
.ve-site .make-money .other-rates .countries span.name,
.ve-site .make-money .countries span.name:last-child { border-bottom: 0; }
.ve-site .make-money .countries span.name { display: flex; align-items: center; text-align: left; }
.ve-site .make-money .countries span.name img { flex: 0 0 auto; width: 38px; height: 25px; }

/* Homepage uploader: notice, upload list and share links live inside the upload panel */
.ve-site .upload-content { display: flex; flex-direction: column; gap: 12px; }
.ve-site .upload-content .browse { order: 1; }
.ve-site .upload-content .ve-guest-notice { order: 2; }
.ve-site .upload-content .uploading-files { order: 3; }
.ve-guest-notice {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 12px 14px;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    border-left: 2px solid var(--ve-accent);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-muted);
    font-size: .875rem;
    line-height: 1.5;
    text-align: left;
}
.ve-guest-notice strong { color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-guest-notice a { color: var(--ve-accent-fg); text-decoration: none; }
.ve-guest-notice a:hover { color: var(--ve-text-strong,#fff); text-decoration: underline; }
.ve-guest-notice .fad { flex: 0 0 auto; margin: 2px 0 0; font-size: 1rem; color: var(--ve-accent-fg); }
.ve-guest-notice--error { border-left-color: var(--ve-danger,#ff7b78); }
.ve-guest-notice--error .fad { color: var(--ve-danger,#ff7b78); }

.ve-site .upload-content .uploading-files {
    position: static !important;
    inset: auto;
    z-index: auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-height: none;
    overflow: visible;
    padding: 0;
    background: none;
    box-shadow: none !important;
}
.ve-site .upload-content .uploading-files:empty { display: none; }
.ve-site .upload-content .uploading-files .file {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 12px 14px;
    gap: 12px;
    flex-wrap: wrap;
    background: var(--ve-surface);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius);
    text-align: left;
}
.ve-site .upload-content .uploading-files .file.is-done { border-color: rgba(66, 185, 131, 0.35); }
.ve-site .upload-content .uploading-files .file .name { min-width: 0; color: var(--ve-text); text-decoration: none; }
.ve-site .upload-content .uploading-files .file .name p { color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-site .upload-content .uploading-files .file a.name:hover p { color: var(--ve-accent-fg); }
.ve-site .upload-content .uploading-files .file .name .speed { color: var(--ve-text-faint) !important; font-weight: 500; font-size: .8125rem; }
.ve-site .upload-content .uploading-files .file .icon i { color: var(--ve-success,#3ecf8e); font-size: 1.25rem; }
.ve-site .upload-content .uploading-files .file .circle { margin-right: 0; }
.ve-site .upload-content .uploading-files .file .remove { width: auto; }
.ve-site .upload-content .uploading-files .file .remove .cancel {
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text-faint);
    font-size: .9375rem;
    opacity: 1;
}
.ve-site .upload-content .uploading-files .file .remove .cancel:hover { background: var(--ve-raised); color: var(--ve-danger,#ff7b78); }
.ve-site .upload-content .uploading-files .file .remove .cancel .fad { margin: 0; font-size: inherit; color: inherit; }

.ve-upload-share { flex: 1 1 100%; padding-top: 10px; border-top: 1px solid var(--ve-line); }
.ve-upload-share__label {
    display: block;
    margin: 0 0 6px;
    color: var(--ve-text-faint);
    font-size: .75rem;
    font-weight: 600;
    letter-spacing: .06em;
    text-transform: uppercase;
}
.ve-upload-share__row { display: flex; gap: 6px; }
.ve-upload-share__url {
    flex: 1 1 auto;
    min-width: 0;
    height: 36px;
    padding: 0 10px;
    background: var(--ve-canvas);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    color: var(--ve-text);
    font: inherit;
    font-size: .8571rem;
    font-variant-numeric: tabular-nums;
}
.ve-upload-share__url:focus { outline: 0; border-color: var(--ve-fill); box-shadow: 0 0 0 1px var(--ve-fill); }
.ve-upload-share__copy,
.ve-upload-share__open {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 36px;
    padding: 0 12px;
    border-radius: var(--ve-radius-sm);
    font: inherit;
    font-size: .8571rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none !important;
    transition: background-color .15s ease, border-color .15s ease, color .15s ease;
}
.ve-upload-share__copy { background: var(--ve-fill); border: 1px solid var(--ve-fill); color: var(--ve-on-accent,#fff); min-width: 88px; }
.ve-upload-share__copy:hover { background: var(--ve-fill-hover); border-color: var(--ve-fill-hover); }
.ve-upload-share__copy.is-copied { background: #2f9e6e; border-color: #2f9e6e; }
.ve-upload-share__open { width: 36px; padding: 0; background: transparent; border: 1px solid var(--ve-line-strong); color: var(--ve-text-muted); }
.ve-upload-share__open:hover { border-color: rgba(var(--ve-ov,255,255,255),0.24); color: var(--ve-text-strong,#fff); }
.ve-upload-share .fad { margin: 0; font-size: .875rem; color: inherit; }

/* Payment method icons without a Font Awesome glyph (premium plans page).
   Same shapes as the public Premium page, drawn with a mask so they take the text colour. */
.ve-pay-ico {
    display: inline-block;
    flex: 0 0 auto;
    width: 1.15em;
    height: 1.15em;
    background-color: currentColor;
    -webkit-mask: var(--ve-pay-ico) center / contain no-repeat;
    mask: var(--ve-pay-ico) center / contain no-repeat;
}
.ve-pay-ico--ltc { --ve-pay-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M9.6 3h3.3l-1.7 6.6 2.7-1-.6 2.4-2.7 1-1.1 4.2h7.9l-.8 3.2H5.4l1.6-6.1-2.2.8.6-2.4 2.2-.8z'/%3E%3C/svg%3E"); }
.ve-pay-ico--usdt { --ve-pay-ico: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4.5 3.5h15v3.3h-5.6v2.1c3.7.2 6.4 1 6.4 2s-2.7 1.8-6.4 2v7.6h-3.8v-7.6c-3.7-.2-6.4-1-6.4-2s2.7-1.8 6.4-2V6.8H4.5zm5.6 6.6c-2.6.1-4.5.5-4.5.9s1.9.8 4.5.9V10.1zm3.8 0v1.8c2.6-.1 4.5-.5 4.5-.9s-1.9-.8-4.5-.9z'/%3E%3C/svg%3E"); }
.fab.ve-pay-ico--bch::before { display: inline-block; transform: rotate(-28deg); }

/* Auth modals on tablets: keep the narrower illustration column so the form fits. */
@media (min-width: 768px) and (max-width: 991.98px) {
    .modal#login .modal-dialog,
    .modal#register .modal-dialog,
    .modal#fpass .modal-dialog,
    .modal#ve-save-account .modal-dialog { max-width: 720px; }
    .modal#login .modal-dialog .modal-body .auth-box,
    .modal#register .modal-dialog .modal-body .auth-box,
    .modal#fpass .modal-dialog .modal-body .auth-box,
    .modal#ve-save-account .modal-dialog .modal-body .auth-box { grid-template-columns: 300px minmax(0, 1fr); }
}

/* My Videos toolbar: "More options" dropdown (assets/js/video_dashboard_legacy.js) */
.title_wrap .ve-more-source { display: none !important; }
.ve-more { position: relative; display: inline-flex; }
.ve-more__toggle { display: inline-flex; align-items: center; gap: 6px; }
.ve-more__chevron { margin-left: 2px; font-size: .75em; transition: transform .15s ease; }
.ve-more.is-open .ve-more__chevron { transform: rotate(180deg); }
.ve-more__menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 1000;
    min-width: 200px;
    padding: 6px;
    background: var(--ve-surface-2);
    border: 1px solid var(--ve-line-strong);
    border-radius: var(--ve-radius-sm);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}
.ve-more__menu[hidden] { display: none; }
.ve-more__item {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 10px;
    background: transparent;
    border: 0;
    border-radius: 3px;
    color: var(--ve-text);
    font: inherit;
    font-size: .875rem;
    font-weight: 500;
    text-align: left;
    white-space: nowrap;
    cursor: pointer;
}
.ve-more__item .fad { width: 16px; color: var(--ve-text-faint); text-align: center; }
.ve-more__item:hover,
.ve-more__item:focus-visible { background: var(--ve-raised); color: var(--ve-text-strong,#fff); outline: none; }
.ve-more__item:hover .fad,
.ve-more__item:focus-visible .fad { color: var(--ve-accent-fg); }
.ve-more__sep { height: 1px; margin: 6px 4px; background: var(--ve-line); }

/* Keyboard shortcuts (My Videos) */
.ve-more__kbd,
.ve-shortcuts kbd {
    display: inline-block;
    min-width: 22px;
    padding: 1px 6px;
    background: transparent;
    border: 1px solid var(--ve-line-strong);
    border-radius: 3px;
    box-shadow: none;
    color: var(--ve-text-muted);
    font-family: inherit;
    font-size: .6875rem;
    font-weight: 600;
    line-height: 1.5;
    text-align: center;
}
.ve-more__kbd { margin-left: auto; }
#ve-shortcuts .modal-dialog { max-width: 460px; }
.ve-shortcuts { background: var(--ve-surface); border: 1px solid var(--ve-line-strong); border-radius: var(--ve-radius); }
.ve-shortcuts .modal-header { padding: 18px 24px; border-bottom: 1px solid var(--ve-line); }
.ve-shortcuts .modal-title { color: var(--ve-text-strong,#fff); font-size: 1.125rem; font-weight: 700; }
.ve-shortcuts .modal-body { padding: 8px 24px 20px; }
.ve-shortcuts__list { margin: 0; }
.ve-shortcuts__row { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 9px 0; border-bottom: 1px solid var(--ve-line); }
.ve-shortcuts__row:last-child { border-bottom: 0; }
.ve-shortcuts__row dt { margin: 0; color: var(--ve-text); font-size: .875rem; font-weight: 500; }
.ve-shortcuts__row dd { flex: 0 0 auto; margin: 0; color: var(--ve-text-faint); font-size: .75rem; white-space: nowrap; }
.ve-shortcuts__row dd kbd { color: var(--ve-text); }

/* My Videos: folder names open the folder (the rest of the row selects). */
.file_list .folder.item a.name { cursor: default; }
.file_list .folder.item a.name .title, .file_list .folder.item a.name .fa-folder { cursor: pointer; }
.file_list .folder.item a.name .title:hover { color: var(--ve-accent-fg); text-decoration: underline; text-underline-offset: 3px; }

/* Dashboard page heading above the first card (same pattern as the referral page title + lead). */
.ve-page-head { display: block !important; margin: 0 0 20px; padding: 0; background: none; border: 0; text-align: left; }
.ve-page-head .title { margin: 0 0 4px; }

@media (min-width: 576px) {
    .container-fluid.ve-has-head { padding-top: 40px !important; }
}
/* My Videos: the Vue manager nests its own spaced container; drop that spacing and line the title up with the card. */
.ve-has-head .container-fluid.manage { margin-top: 0 !important; padding-top: 0 !important; }
.ve-has-head:has(.container-fluid.manage) > .ve-page-head { padding-left: 30px; margin-bottom: 4px; }
/* Dashboard home nests one padded container: line the title up with it. */
.ve-has-head:has(> .container-fluid[data-dashboard-home]) > .ve-page-head { padding-left: 15px; margin-bottom: 0; }

/* ---- Bulk uploader (Upload page, My Files) ---------------------------------------- */
.ve-up__drop {
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    padding: 44px 24px; text-align: center; cursor: pointer;
    background: var(--ve-surface-2, #1b1c20);
    border: 1px dashed rgba(var(--ve-ov,255,255,255),0.16); border-radius: 6px;
    transition: border-color .15s ease, background-color .15s ease;
}
.ve-up__drop:hover, .ve-up__drop:focus-visible { border-color: rgba(var(--ve-accent-rgb,74,125,255),0.6); outline: 0; }
.ve-up__drop.is-over { border-style: solid; border-color: var(--ve-accent,#4a7dff); background: rgba(var(--ve-accent-rgb,74,125,255),0.08); }
.ve-up__drop-icon { margin-bottom: 14px; color: var(--ve-accent-fg,#6c94ff); font-size: 2.6rem; --fa-secondary-opacity: .35; }
.ve-up__drop-title { margin: 0 0 6px; color: var(--ve-text-strong,#fff); font-size: 1.125rem; font-weight: 700; }
.ve-up__drop-hint { max-width: 520px; margin: 0 auto; color: var(--ve-text-dim,#8c9099); font-size: .8125rem; line-height: 1.5; }
.ve-up__drop-sub { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 20px 0 0; }
.ve-up__browse { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 18px; font-size: .875rem; font-weight: 600; }
.ve-up .ve-up__folder { height: 40px; padding: 0 16px; font-size: .875rem; }
/* Once files are queued the drop zone shrinks to a slim add-more bar. */
.ve-up.has-queue .ve-up__drop { flex-direction: row; justify-content: flex-start; gap: 16px; padding: 14px 16px; text-align: left; }
.ve-up.has-queue .ve-up__drop-icon { margin: 0; font-size: 1.6rem; }
.ve-up.has-queue .ve-up__drop-text { flex: 1 1 auto; min-width: 0; }
.ve-up.has-queue .ve-up__drop-title { margin: 0; font-size: .9375rem; font-weight: 600; }
.ve-up.has-queue .ve-up__drop-hint { max-width: none; margin: 2px 0 0; }
.ve-up.has-queue .ve-up__drop-sub { flex: 0 0 auto; margin: 0; }
.ve-up.has-queue .ve-up__browse, .ve-up.has-queue .ve-up__folder { height: 36px; }

.ve-up__btn { display: inline-flex; align-items: center; gap: 8px; height: 34px; padding: 0 12px; background: transparent; border: 1px solid rgba(var(--ve-ov,255,255,255),0.12); border-radius: 4px; color: var(--ve-g-hi,#e4e5e8); font-size: .8125rem; font-weight: 600; white-space: nowrap; cursor: pointer; transition: background-color .15s ease, border-color .15s ease, color .15s ease; }
.ve-up__btn:hover { background: var(--ve-hover,#1f2024); border-color: rgba(var(--ve-ov,255,255,255),0.2); color: var(--ve-text-strong,#fff); }
.ve-up__btn i { color: var(--ve-text-muted,#9b9ea6); --fa-secondary-opacity: .4; }
.ve-up__btn[hidden] { display: none; }
.ve-up__btn.is-ok, .ve-up__btn.is-ok i { color: var(--ve-success,#3ecf8e); }
.ve-up__btn--danger:hover, .ve-up__btn--danger:hover i { border-color: rgba(var(--ve-danger-rgb,255,123,120),0.5); color: var(--ve-danger,#ff7b78); }

.ve-up__panel { margin-top: 16px; background: var(--ve-surface-2, #1b1c20); border: 1px solid rgba(var(--ve-ov,255,255,255),0.06); border-radius: 6px; overflow: hidden; }
.ve-up__panel[hidden] { display: none; }
.ve-up__head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding: 16px 16px 14px; }
.ve-up__head-text { min-width: 0; }
.ve-up__headline { display: flex; align-items: center; gap: 10px; }
.ve-up__headline strong { color: var(--ve-text-strong,#fff); font-size: 1rem; font-weight: 700; }
.ve-up__state { width: 18px; color: var(--ve-accent-fg,#6c94ff); font-size: 1.125rem; text-align: center; --fa-secondary-opacity: .35; }
.ve-up__panel[data-tone="ok"] .ve-up__state { color: var(--ve-success,#3ecf8e); }
.ve-up__panel[data-tone="warn"] .ve-up__state { color: var(--ve-danger,#ff7b78); }
.ve-up__panel[data-tone="paused"] .ve-up__state, .ve-up__panel[data-tone="idle"] .ve-up__state { color: var(--ve-text-muted,#9b9ea6); }
.ve-up__meta { margin-top: 3px; padding-left: 28px; color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.ve-up__actions { display: flex; flex-wrap: wrap; gap: 8px; }
.ve-up__total { display: flex; align-items: center; gap: 12px; padding: 0 16px 16px; }
.ve-up__bar { position: relative; height: 4px; overflow: hidden; background: rgba(var(--ve-ov,255,255,255),0.08); border-radius: 2px; }
.ve-up__bar span { position: absolute; inset: 0 auto 0 0; width: 0; background: var(--ve-accent,#4a7dff); border-radius: 2px; transition: width .3s linear; }
.ve-up__total .ve-up__bar { flex: 1 1 auto; height: 6px; border-radius: 3px; }
.ve-up__panel[data-tone="ok"] .ve-up__bar--total span { background: var(--ve-success,#3ecf8e); }
.ve-up__panel[data-tone="paused"] .ve-up__bar--total span { background: #6b6f78; }
.ve-up__pct { min-width: 44px; color: var(--ve-text-strong,#fff); font-size: .8125rem; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
.ve-up__notice { display: flex; align-items: center; gap: 10px; margin: 0 16px 14px; padding: 9px 12px; border-left: 2px solid var(--ve-accent,#4a7dff); background: rgba(var(--ve-accent-rgb,74,125,255),0.08); color: var(--ve-g-hi,#e4e5e8); font-size: .8125rem; }
.ve-up__notice[hidden] { display: none; }
.ve-up__notice i { color: var(--ve-accent-fg,#6c94ff); --fa-secondary-opacity: .35; }

.ve-up__toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; padding: 10px 16px; border-top: 1px solid rgba(var(--ve-ov,255,255,255),0.06); }
.ve-up__filters { display: flex; flex-wrap: wrap; gap: 4px; }
.ve-up__filter { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px; background: transparent; border: 1px solid transparent; border-radius: 4px; color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; font-weight: 600; cursor: pointer; transition: background-color .15s ease, color .15s ease; }
.ve-up__filter:hover { background: var(--ve-hover,#1f2024); color: var(--ve-text-strong,#fff); }
.ve-up__filter.is-active { background: rgba(var(--ve-accent-rgb,74,125,255),0.12); border-color: rgba(var(--ve-accent-rgb,74,125,255),0.45); color: var(--ve-text-strong,#fff); }
.ve-up__filter[hidden] { display: none; }
.ve-up__count { min-width: 20px; padding: 0 6px; background: rgba(var(--ve-ov,255,255,255),0.08); border-radius: 3px; color: var(--ve-text-2,#c9ccd2); font-size: .6875rem; line-height: 18px; text-align: center; font-variant-numeric: tabular-nums; }
.ve-up__filter.is-active .ve-up__count { background: var(--ve-fill,#2a62ff); color: var(--ve-on-accent,#fff); }
.ve-up__search { position: relative; display: flex; align-items: center; width: 240px; max-width: 100%; margin: 0; }
.ve-up__search i { position: absolute; left: 11px; color: var(--ve-text-dim,#8c9099); font-size: .8125rem; pointer-events: none; }
.ve-up__search input { width: 100%; height: 32px; padding: 0 10px 0 32px; background: var(--ve-input,#141518); border: 1px solid rgba(var(--ve-ov,255,255,255),0.1); border-radius: 4px; color: var(--ve-text-strong,#fff); font-size: .8125rem; }
.ve-up__search input:focus { border-color: var(--ve-accent,#4a7dff); outline: 0; }

.ve-up__table { border-top: 1px solid rgba(var(--ve-ov,255,255,255),0.06); --ve-up-cols: 24px minmax(0, 1fr) 96px 84px 230px 104px; }
.ve-up__thead, .ve-up__row { display: grid; grid-template-columns: var(--ve-up-cols); align-items: center; gap: 14px; padding: 0 16px; }
.ve-up__thead { height: 34px; background: rgba(var(--ve-scrim-rgb,0,0,0),0.14); border-bottom: 1px solid rgba(var(--ve-ov,255,255,255),0.06); color: var(--ve-text-dim,#8c9099); font-size: .6875rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.ve-up__thead .ve-up__c-size { text-align: right; }
.ve-up__viewport { position: relative; max-height: min(62vh, 644px); overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: rgba(var(--ve-ov,255,255,255),0.16) transparent; }
.ve-up__spacer { position: relative; }
.ve-up__rows { position: absolute; top: 0; right: 0; left: 0; margin: 0; padding: 0; list-style: none; will-change: transform; }
.ve-up__row { height: 46px; border-bottom: 1px solid rgba(var(--ve-ov,255,255,255),0.05); }
.ve-up__row:hover { background: rgba(var(--ve-ov,255,255,255),0.025); }
.ve-up__row.is-canceled { opacity: .55; }
.ve-up__icon { color: var(--ve-text-muted,#9b9ea6); font-size: 1.125rem; text-align: center; --fa-secondary-opacity: .35; }
.ve-up__row.is-done .ve-up__icon, .ve-up__row.is-uploading .ve-up__icon { color: var(--ve-accent-fg,#6c94ff); }
.ve-up__name { display: flex; align-items: center; min-width: 0; font-size: .875rem; white-space: nowrap; }
.ve-up__dir { flex: 0 1 auto; max-width: 45%; overflow: hidden; color: var(--ve-text-dim,#8c9099); text-overflow: ellipsis; }
.ve-up__fname { flex: 0 1 auto; min-width: 0; overflow: hidden; color: var(--ve-text,#f2f3f5); font-weight: 600; text-overflow: ellipsis; }
.ve-up__badge { flex: 0 0 auto; margin-left: 8px; padding: 0 6px; border: 1px solid rgba(var(--ve-accent-rgb,74,125,255),0.45); border-radius: 3px; color: var(--ve-t-blue,#8fb0ff); font-size: .625rem; font-weight: 600; line-height: 16px; letter-spacing: .05em; text-transform: uppercase; }
.ve-up__c-size { color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; text-align: right; font-variant-numeric: tabular-nums; }
.ve-up__status { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ve-up__st { display: block; min-width: 0; overflow: hidden; color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; white-space: nowrap; text-overflow: ellipsis; }
.ve-up__st i { margin-right: 7px; --fa-secondary-opacity: .35; }
.ve-up__st--ok { color: var(--ve-success,#3ecf8e); }
.ve-up__st--err { color: var(--ve-danger,#ff7b78); }
.ve-up__st--num { color: var(--ve-text-strong,#fff); font-weight: 600; font-variant-numeric: tabular-nums; }
.ve-up__st--num em { margin-left: 8px; color: var(--ve-text-muted,#9b9ea6); font-style: normal; font-weight: 400; }
.ve-up__mini { position: relative; flex: 0 0 72px; height: 4px; overflow: hidden; background: rgba(var(--ve-ov,255,255,255),0.08); border-radius: 2px; }
.ve-up__mini span { position: absolute; inset: 0 auto 0 0; background: var(--ve-accent,#4a7dff); border-radius: 2px; }
.ve-up__tools { display: flex; justify-content: flex-end; gap: 2px; }
.ve-up__tool { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0; background: transparent; border: 1px solid transparent; border-radius: 4px; color: var(--ve-text-muted,#9b9ea6); cursor: pointer; }
.ve-up__tool:hover { background: var(--ve-hover,#1f2024); border-color: rgba(var(--ve-ov,255,255,255),0.1); color: var(--ve-text-strong,#fff); text-decoration: none; }
.ve-up__tool[data-do="cancel"]:hover { color: var(--ve-danger,#ff7b78); }
.ve-up__tool.is-ok, .ve-up__tool.is-ok:hover { color: var(--ve-success,#3ecf8e); }
.ve-up__type { overflow: hidden; color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; white-space: nowrap; text-overflow: ellipsis; }
.ve-up__type.is-video { color: var(--ve-accent-fg,#6c94ff); }
.ve-up__empty { margin: 0; padding: 28px 16px; color: var(--ve-text-dim,#8c9099); font-size: .875rem; text-align: center; }
.ve-up__empty[hidden] { display: none; }
@media (max-width: 991.98px) {
    .ve-up__table { --ve-up-cols: 22px minmax(0, 1fr) 84px 72px 170px 96px; }
    .ve-up__thead, .ve-up__row { gap: 10px; }
    .ve-up__mini { flex-basis: 48px; }
    .ve-up__st--num em { display: none; }
}
@media (max-width: 575.98px) {
    .ve-up__drop { padding: 32px 16px; }
    .ve-up.has-queue .ve-up__drop { flex-wrap: wrap; gap: 12px; }
    .ve-up.has-queue .ve-up__drop-hint { display: none; }
    .ve-up.has-queue .ve-up__drop-sub { width: 100%; justify-content: flex-start; }
    .ve-up__head { padding: 14px 12px 12px; }
    .ve-up__total { padding: 0 12px 14px; }
    .ve-up__notice { margin: 0 12px 12px; }
    .ve-up__toolbar { padding: 10px 12px; }
    .ve-up__search { width: 100%; }
    .ve-up.has-queue .ve-up__drop-sub .btn, .ve-up.has-queue .ve-up__drop-sub .ve-up__btn { flex: 1 1 0; justify-content: center; padding: 0 10px; }
    .ve-up__actions { width: 100%; gap: 6px; }
    .ve-up__actions .ve-up__btn { flex: 1 1 0; justify-content: center; min-width: 40px; padding: 0; }
    .ve-up__actions .ve-up__btn span { display: none; }
    .ve-up__meta { padding-left: 0; }
    .ve-up__thead { display: none; }
    .ve-up__row {
        height: 58px; padding: 0 12px; row-gap: 3px; align-content: center;
        grid-template-columns: 22px minmax(0, 1fr) auto;
        grid-template-areas: "icon name tools" "icon status tools";
    }
    .ve-up__icon { grid-area: icon; }
    .ve-up__name { grid-area: name; }
    .ve-up__status { grid-area: status; }
    .ve-up__tools { grid-area: tools; }
    .ve-up__row .ve-up__c-size, .ve-up__row .ve-up__type { display: none; }
}

/* Upload page tabs: device uploader vs. the remote-link importer (Vue). */
.ve-up-tabs { gap: 6px; margin: 0 0 16px; }
.ve-up-tabs.nav-pills .nav-link { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; border: 1px solid rgba(var(--ve-ov,255,255,255),0.1); border-radius: 4px; background: transparent; color: var(--ve-text-2,#c9ccd2); font-size: .875rem; font-weight: 600; }
.ve-up-tabs .nav-link i { color: var(--ve-text-muted,#9b9ea6); --fa-secondary-opacity: .4; }
.ve-up-tabs.nav-pills .nav-link:hover { background: var(--ve-hover,#1f2024); color: var(--ve-text-strong,#fff); }
.ve-up-tabs.nav-pills .nav-link.active, .ve-up-tabs.nav-pills .nav-link.active:hover { background: rgba(var(--ve-accent-rgb,74,125,255),0.12); border-color: rgba(var(--ve-accent-rgb,74,125,255),0.55); color: var(--ve-text-strong,#fff); }
.ve-up-tabs .nav-link.active i { color: var(--ve-accent-fg,#6c94ff); }
.ve-up-panel { padding: 20px !important; margin-bottom: 16px; }

/* ---- My Files (/files) ---------------------------------------------------------------- */
.ve-files-upload { padding: 20px !important; }
.ve-files { padding: 0 !important; overflow: hidden; }
.ve-files__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 16px; padding: 16px 20px; }
.ve-files__summary { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.ve-files__summary strong { color: var(--ve-text-strong,#fff); font-size: 1rem; font-weight: 700; }
.ve-files__summary span { color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; }
.ve-files__controls { display: flex; flex-wrap: wrap; gap: 8px; }
.ve-files__search { width: 260px; }
.ve-files__sort { height: 32px; padding: 0 28px 0 10px; background: var(--ve-input,#141518); border: 1px solid rgba(var(--ve-ov,255,255,255),0.1); border-radius: 4px; color: var(--ve-text-strong,#fff); font-size: .8125rem; cursor: pointer; }
.ve-files__sort:focus { border-color: var(--ve-accent,#4a7dff); outline: 0; }
.ve-files__bulk { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 20px; background: rgba(var(--ve-accent-rgb,74,125,255),0.08); border-top: 1px solid rgba(var(--ve-accent-rgb,74,125,255),0.25); }
.ve-files__bulk[hidden] { display: none; }
.ve-files__bulk-count { margin-right: 6px; color: var(--ve-text-strong,#fff); font-size: .875rem; font-weight: 600; }
.ve-files__clear { margin-left: auto; padding: 0; background: none; border: 0; color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; font-weight: 600; cursor: pointer; }
.ve-files__clear:hover { color: var(--ve-text-strong,#fff); text-decoration: underline; text-underline-offset: 3px; }
.ve-up__btn.is-armed, .ve-up__btn.is-armed i { background: rgba(217, 61, 66, 0.12); border-color: rgba(var(--ve-danger-rgb,255,123,120),0.6); color: var(--ve-danger,#ff7b78); }
.ve-files__table { border-top: 1px solid var(--ve-line, rgba(255, 255, 255, 0.08)); --ve-files-cols: 24px minmax(0, 1fr) 90px 96px 116px 136px; }
.ve-files__head, .ve-files__row { display: grid; grid-template-columns: var(--ve-files-cols); align-items: center; gap: 14px; padding: 0 20px; }
.ve-files__head { height: 36px; background: rgba(var(--ve-scrim-rgb,0,0,0),0.14); border-bottom: 1px solid var(--ve-line, rgba(255, 255, 255, 0.08)); color: var(--ve-text-dim,#8c9099); font-size: .6875rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
.ve-files__row { height: 52px; border-bottom: 1px solid rgba(var(--ve-ov,255,255,255),0.05); transition: background-color .12s ease; }
.ve-files__row:last-child { border-bottom: 0; }
.ve-files__row:hover { background: rgba(var(--ve-ov,255,255,255),0.025); }
.ve-files__row.is-selected { background: rgba(var(--ve-accent-rgb,74,125,255),0.06); }
.ve-files__row.is-busy { opacity: .5; pointer-events: none; }
.ve-files__check { position: relative; display: inline-flex; width: 16px; height: 16px; margin: 0; cursor: pointer; }
.ve-files__check input { position: absolute; opacity: 0; width: 16px; height: 16px; margin: 0; cursor: pointer; }
.ve-files__check span { width: 16px; height: 16px; border: 1px solid rgba(var(--ve-ov,255,255,255),0.28); border-radius: 3px; transition: background-color .12s ease, border-color .12s ease; }
.ve-files__check input:checked + span, .ve-files__check input:indeterminate + span { background: var(--ve-fill,#2a62ff); border-color: var(--ve-fill,#2a62ff); }
.ve-files__check input:checked + span::after { content: ""; position: absolute; left: 5px; top: 2px; width: 6px; height: 10px; border: solid var(--ve-text-strong,#fff); border-width: 0 2px 2px 0; transform: rotate(45deg); }
.ve-files__check input:indeterminate + span::after { content: ""; position: absolute; left: 4px; top: 7px; width: 8px; height: 2px; background: #fff; }
.ve-files__check input:focus-visible + span { outline: 2px solid var(--ve-accent,#4a7dff); outline-offset: 2px; }
.ve-files__name { display: flex; align-items: center; gap: 10px; min-width: 0; }
.ve-files__name i { flex: 0 0 auto; width: 20px; color: var(--ve-accent-fg,#6c94ff); font-size: 1.125rem; text-align: center; --fa-secondary-opacity: .35; }
.ve-files__name a { min-width: 0; overflow: hidden; color: var(--ve-text,#f2f3f5); font-size: .875rem; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; }
.ve-files__name a:hover { color: var(--ve-text-strong,#fff); text-decoration: underline; text-underline-offset: 3px; }
.ve-files__tag { flex: 0 0 auto; padding: 0 6px; border: 1px solid rgba(var(--ve-ov,255,255,255),0.12); border-radius: 3px; color: var(--ve-text-muted,#9b9ea6); font-size: .625rem; font-weight: 600; line-height: 16px; letter-spacing: .05em; text-transform: uppercase; }
.ve-files__rename { flex: 1 1 auto; min-width: 0; height: 32px; padding: 0 10px; background: var(--ve-input,#141518); border: 1px solid var(--ve-accent,#4a7dff); border-radius: 4px; color: var(--ve-text-strong,#fff); font-size: .875rem; outline: 0; }
.ve-files__c-size, .ve-files__c-dl { color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; text-align: right; font-variant-numeric: tabular-nums; }
.ve-files__c-date { color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; }
.ve-files__head .ve-files__c-size, .ve-files__head .ve-files__c-dl, .ve-files__head .ve-files__c-date { color: var(--ve-text-dim,#8c9099); font-size: .6875rem; }
.ve-files__tools { display: flex; justify-content: flex-end; gap: 2px; }
.ve-files__del.is-armed { width: auto; gap: 6px; padding: 0 8px; background: rgba(217, 61, 66, 0.12); border-color: rgba(var(--ve-danger-rgb,255,123,120),0.5); color: var(--ve-danger,#ff7b78); font-size: .75rem; font-weight: 600; }
.ve-files__del:hover { color: var(--ve-danger,#ff7b78); }
.ve-up__tool:disabled { opacity: .35; cursor: default; background: transparent; border-color: transparent; }
.ve-files__empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 52px 24px; border-top: 1px solid var(--ve-line, rgba(255, 255, 255, 0.08)); text-align: center; }
.ve-files__empty[hidden], .ve-files__pager[hidden], .ve-files__table[hidden] { display: none; }
.ve-files__empty i { margin-bottom: 8px; color: var(--ve-accent-fg,#6c94ff); font-size: 2.25rem; --fa-secondary-opacity: .35; }
.ve-files__empty strong { color: var(--ve-text-strong,#fff); font-size: 1rem; }
.ve-files__empty span { color: var(--ve-text-muted,#9b9ea6); font-size: .875rem; }
.ve-files__pager { display: flex; align-items: center; justify-content: flex-end; gap: 4px; padding: 10px 20px; border-top: 1px solid var(--ve-line, rgba(255, 255, 255, 0.08)); color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; font-variant-numeric: tabular-nums; }
.ve-files__pager span { margin-right: 10px; }
.ve-files.is-loading .ve-files__rows { opacity: .55; transition: opacity .15s ease; }
@media (max-width: 991.98px) {
    .ve-files__table { --ve-files-cols: 24px minmax(0, 1fr) 80px 132px; }
    .ve-files__c-dl, .ve-files__c-date { display: none; }
}
@media (max-width: 575.98px) {
    .ve-files-upload { padding: 12px !important; }
    .ve-files__bar, .ve-files__bulk, .ve-files__pager { padding-left: 12px; padding-right: 12px; }
    .ve-files__controls, .ve-files__search { width: 100%; }
    .ve-files__search { flex: 1 1 auto; width: auto; }
    .ve-files__table { --ve-files-cols: 20px minmax(0, 1fr) 92px; }
    .ve-files__head, .ve-files__row { gap: 10px; padding: 0 12px; }
    .ve-files__c-size, .ve-files__tools a { display: none; }
    .ve-files__tag { display: none; }
}

/* ---- Subtitle modal (My Videos) --------------------------------------------------------- */
/* Search / Subscene relied on a service that no longer exists: only the upload tab remains. */
#subtitle #nav-tab, #subtitle #search-tab, #subtitle #subscene-tab { display: none !important; }
#subtitle .modal-body { padding: 20px 24px 8px; }
#subtitle .srt_list { padding-top: 0 !important; margin-bottom: 16px !important; }
#subtitle .srt_list:empty { display: none; }
#subtitle .srt_list li { flex-wrap: nowrap !important; gap: 12px; padding: 10px 12px; margin-bottom: 6px; background: var(--ve-surface-2, #1e2024); border: 1px solid rgba(var(--ve-ov,255,255,255),0.06); border-radius: 4px; color: var(--ve-text,#f2f3f5); font-size: .875rem; }
#subtitle .srt_list li .fad { color: var(--ve-accent-fg,#6c94ff); --fa-secondary-opacity: .35; }
#subtitle .srt_list li .name { flex: 1 1 auto; font-weight: 600; }
#subtitle .srt_list li .size { color: var(--ve-text-muted,#9b9ea6); font-size: .8125rem; font-variant-numeric: tabular-nums; }
#subtitle .srt_list li .btn-danger { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; padding: 0; background: transparent; border: 1px solid transparent; border-radius: 4px; color: var(--ve-text-muted,#9b9ea6); }
#subtitle .srt_list li .btn-danger:hover { background: rgba(217, 61, 66, 0.12); border-color: rgba(var(--ve-danger-rgb,255,123,120),0.4); color: var(--ve-danger,#ff7b78); }
#subtitle .upload_srt { display: grid !important; grid-template-columns: minmax(0, 1fr) 220px; gap: 8px 12px; margin: 0 0 12px !important; }
#subtitle .upload_srt > label { grid-column: 1 / -1; margin: 0; color: var(--ve-text-muted,#9b9ea6); font-size: .75rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; }
#subtitle .custom-file { height: 42px; }
#subtitle .custom-file-input { height: 42px; cursor: pointer; }
#subtitle .custom-file-label { display: flex; align-items: center; height: 42px; margin: 0; padding: 0 110px 0 14px; overflow: hidden; background: var(--ve-input,#141518); border: 1px solid rgba(var(--ve-ov,255,255,255),0.1); border-radius: 4px; color: var(--ve-text,#f2f3f5); font-size: .875rem; white-space: nowrap; text-overflow: ellipsis; }
#subtitle .custom-file-label span { overflow: hidden; text-overflow: ellipsis; }
#subtitle .custom-file-label::after { content: "Browse"; display: flex; align-items: center; height: 40px; padding: 0 16px; background: var(--ve-hover,#1f2024); border-left: 1px solid rgba(var(--ve-ov,255,255,255),0.1); border-radius: 0 4px 4px 0; color: var(--ve-text-strong,#fff); font-weight: 600; }
#subtitle .custom-file-input:hover ~ .custom-file-label { border-color: rgba(var(--ve-ov,255,255,255),0.2); }
#subtitle .custom-file-input:focus ~ .custom-file-label { border-color: var(--ve-accent,#4a7dff); box-shadow: none; }
#subtitle .upload_srt .custom-select, #subtitle .upload_srt .ve-select { width: 100%; height: 42px; margin: 0 !important; }
#subtitle .upload_srt::after { content: "SRT or WebVTT, up to 2 MB. Uploading a language again replaces it."; grid-column: 1 / -1; color: var(--ve-text-dim,#8c9099); font-size: .8125rem; }
#subtitle .modal-footer { padding: 16px 24px; border-top: 1px solid rgba(var(--ve-ov,255,255,255),0.06); }
#subtitle .modal-footer .btn { height: 42px; padding: 0 20px; font-weight: 600; }
#subtitle .modal-footer .btn-secondary { background: transparent; border: 1px solid rgba(var(--ve-ov,255,255,255),0.14); color: var(--ve-text,#f2f3f5); }
#subtitle .modal-footer .btn-secondary:hover { background: var(--ve-hover,#1f2024); color: var(--ve-on-accent,#fff); }
#subtitle .alert-warning { margin: 0 !important; padding: 16px 24px 18px; background: var(--ve-surface-2, #1e2024); border: 0; border-top: 1px solid rgba(var(--ve-ov,255,255,255),0.06); border-radius: 0 0 6px 6px; color: var(--ve-text-muted,#9b9ea6); }
#subtitle .alert-warning p { margin: 0 !important; font-size: .8125rem !important; line-height: 1.5; overflow-wrap: anywhere; }
#subtitle .alert-warning p + p { margin-top: 10px !important; }
#subtitle .alert-warning b { display: inline-block; margin-bottom: 2px; color: var(--ve-text,#f2f3f5); font-weight: 600; }
@media (max-width: 575.98px) {
    #subtitle .upload_srt { grid-template-columns: 1fr; }
}

/* Upload page: "Supported hosts" sits at the right of the tab row, for the Remote Upload tab. */
.ve-up-tabs__aside { margin-left: auto; }
.ve-up-tabs.nav-pills button.nav-link { cursor: pointer; }
.container-fluid:has(> .ve-up-tabs) .upload_btn.text-right:has(> [data-target="#supported-host"]) { display: none !important; }
/* One tab at a time (upload_page.js sets data-up-tab); the remote component's own heading is never shown here. */
[data-up-tab="device"] > .the_box:not(.ve-up-panel),
[data-up-tab="device"] > .ve-up-tabs .ve-up-tabs__aside,
[data-up-tab="links"] > .ve-up-panel,
[data-up-tab] > div.ve-page-head { display: none !important; }
/* Remote Upload: "Add to upload queue" sits on the folder picker's row, aligned with it on the right. */
@media (min-width: 768px) {
    .the_box > .form-group.row:has(> .col-md-4.mt-4) > .col-md-12.upload_btn {
        flex: 1 1 0; max-width: none; width: auto; margin-top: 1.5rem !important;
        display: flex; align-items: flex-end; justify-content: flex-end;
    }
}

/* Upload page: destination folder pickers above the device uploader */
.ve-up-dest { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.ve-up-dest__field { min-width: 0; }
.ve-up-dest .c_label { display: flex; align-items: center; gap: 8px; }
.ve-up-dest .c_label i { color: var(--ve-accent-fg,#6c94ff); --fa-secondary-opacity: .35; }
@media (max-width: 767.98px) { .ve-up-dest { grid-template-columns: 1fr; } }

/* Upload dialog (My Files / My Videos): folder picker + bulk uploader. */
.ve-upmodal { z-index: 100050; }
body.ve-upmodal-open .modal-backdrop { z-index: 100040; }
.ve-upmodal__dialog { max-width: min(1100px, calc(100vw - 32px)); }
.ve-upmodal .modal-body { padding: 16px 20px 20px; }
.ve-upmodal__dest { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin: 12px 0 0; }
.ve-upmodal .ve-up.has-queue .ve-upmodal__dest { margin-bottom: 14px; }
.ve-upmodal__dest .c_label { display: inline-flex; align-items: center; gap: 8px; margin: 0; color: var(--ve-text-2,#c9ccd2); font-size: .8125rem; font-weight: 600; white-space: nowrap; }
.ve-upmodal__dest .c_label i { color: var(--ve-accent-fg,#6c94ff); --fa-secondary-opacity: .4; }
.ve-upmodal__dest select, .ve-upmodal__dest .ve-select { flex: 0 1 340px; width: 340px; min-width: 0; height: 36px; }
.ve-upmodal .ve-up__viewport { max-height: min(46vh, 460px); }
.ve-upmodal__badge { display: inline-block; margin-left: 8px; padding: 0 6px; background: rgba(var(--ve-ov,255,255,255),0.18); border-radius: 3px; font-size: .75rem; line-height: 18px; font-variant-numeric: tabular-nums; }
@media (max-width: 575.98px) {
    .ve-upmodal__dialog { max-width: none; margin: 8px; }
    .ve-upmodal .modal-body { padding: 12px; }
    .ve-upmodal__dest { flex-direction: column; align-items: stretch; gap: 6px; }
    .ve-upmodal__dest select, .ve-upmodal__dest .ve-select { flex: 0 0 auto; width: 100%; }
}

/* While uploads run, other pages open in this frame on top so the uploads keep going. */
.ve-shell { position: fixed; top: 0; left: 0; z-index: 100000; width: 100%; height: 100%; border: 0; background: var(--ve-canvas,#0f1012); }
html.ve-shell-open, html.ve-shell-open body { overflow: hidden; }
.ve-shell-dock {
    position: fixed; right: 16px; bottom: 16px; z-index: 100020; display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    width: 280px; max-width: calc(100vw - 32px); padding: 10px 14px 12px; background: var(--ve-surface,#17181b); border: 1px solid rgba(var(--ve-ov,255,255,255),0.14);
    border-radius: 6px; box-shadow: 0 16px 40px rgba(0, 0, 0, 0.45); color: var(--ve-text-strong,#fff); font-size: .8125rem; font-weight: 600; text-align: left; cursor: pointer;
}
.ve-shell-dock[hidden] { display: none; }
.ve-shell-dock:hover { border-color: rgba(var(--ve-accent-rgb,74,125,255),0.55); }
.ve-shell-dock i { color: var(--ve-accent-fg,#6c94ff); font-size: 1rem; --fa-secondary-opacity: .4; }
.ve-shell-dock.is-done i { color: var(--ve-success,#3ecf8e); }
.ve-shell-dock.is-warn i { color: var(--ve-danger,#ff7b78); }
.ve-shell-dock__text { flex: 1 1 0; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-variant-numeric: tabular-nums; }
.ve-shell-dock__bar { flex: 0 0 100%; height: 3px; overflow: hidden; background: rgba(var(--ve-ov,255,255,255),0.08); border-radius: 2px; }
.ve-shell-dock__bar span { display: block; height: 100%; background: var(--ve-accent,#4a7dff); transition: width .25s linear; }
.ve-shell-dock.is-done .ve-shell-dock__bar span { background: var(--ve-success,#3ecf8e); }

/* Row quick actions in My Videos (My Files has the same in files_page.css). */
.file_manager .files ul.file_list li > .ve-row-tools { flex: 0 0 136px; width: 136px; align-items: center; justify-content: flex-end; gap: 2px; margin-left: 8px; }
.file_manager .files ul.file_list li > .ve-row-tools .ve-row-tool {
    display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; padding: 0;
    background: transparent; border: 1px solid transparent; border-radius: 4px; color: var(--ve-text-dim,#8c9099); font-size: .875rem; cursor: pointer;
}
.file_manager .files ul.file_list li > .ve-row-tools .ve-row-tool:hover { background: var(--ve-hover,#1f2024); border-color: rgba(var(--ve-ov,255,255,255),0.1); color: var(--ve-text-strong,#fff); text-decoration: none; }
.file_manager .files ul.file_list li > .ve-row-tools .ve-row-tool.is-danger:hover { color: var(--ve-danger,#ff7b78); }
.file_manager .files ul.file_list li > .ve-row-tools .ve-row-tool.is-ok { color: var(--ve-success,#3ecf8e); }
@media (max-width: 991.98px) {
    .file_manager .files ul.file_list li > .ve-row-tools { display: none !important; }
}
.file_manager .files ul.file_list li > .ve-col-count { flex: 0 0 90px; width: 90px; padding-left: 16px; text-align: right; white-space: nowrap; font-size: .8571428571rem; }
.file_manager .files ul.file_list li.header > .ve-col-count { font-size: 1rem; font-weight: 700; }
@media (max-width: 991.98px) {
    .file_manager .files ul.file_list li > .ve-col-count { display: none !important; }
}
.ve-row-tool:disabled, .ve-row-tool:disabled:hover { opacity: .35; background: transparent; border-color: transparent; color: var(--ve-text-dim,#8c9099); cursor: default; }


/* Settings: delete account. */
.ve-delete-note { display: flex; gap: 14px; align-items: flex-start; margin: 0 0 24px; padding: 14px 16px; background: rgba(var(--ve-danger-rgb,255,123,120),0.08); border: 1px solid rgba(var(--ve-danger-rgb,255,123,120),0.3); border-radius: 4px; color: var(--ve-text-2,#c9ccd2); font-size: .875rem; line-height: 1.5; }
.ve-delete-note > .fad { flex: 0 0 auto; margin-top: 2px; color: var(--ve-danger,#ff7b78); font-size: 1.125rem; }
.ve-delete-note strong { display: block; margin: 0 0 6px; color: var(--ve-text-strong,#fff); font-weight: 600; }
.ve-delete-note ul { margin: 0; padding: 0 0 0 18px; }
.ve-delete-note li { margin: 2px 0; }
.delete-account-form .form-row { margin: 0 -10px; }
.delete-account-form .form-row > .form-group { padding: 0 10px; }
.delete-account-form textarea { resize: vertical; min-height: 88px; }
.ve-delete-actions { display: flex; justify-content: flex-end; margin: 4px 0 0; padding: 16px 0 0; border-top: 1px solid var(--ve-line,rgba(255,255,255,.08)); }

/* Premium checkout: payment methods in an even grid, one line per label, same height. */
.my-premium .payments .selection { display: grid; grid-template-columns: repeat(auto-fill, minmax(172px, 1fr)); gap: 10px; width: 100%; }
.my-premium .payments .selection .custom-control { min-width: 0; margin: 0; padding: 0; }
.my-premium .payments .selection .custom-control-label { box-sizing: border-box; width: 100%; height: 100%; min-height: 44px; white-space: nowrap; }

/* Reports chart: series switches */
.reports-chart-legend { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.reports-chart-chip { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 12px; background: transparent; border: 1px solid var(--ve-control-edge, rgba(255, 255, 255, 0.18)); border-radius: 4px; color: var(--ve-text-muted, #9b9ea6); font: inherit; font-size: .8125rem; font-weight: 600; cursor: pointer; transition: background-color .15s ease, color .15s ease, border-color .15s ease; }
.reports-chart-chip:hover { background: var(--ve-hover, #1f2024); color: var(--ve-text-strong, #fff); }
.reports-chart-chip.is-on { background: rgba(var(--ve-accent-rgb, 74, 125, 255), 0.12); border-color: rgba(var(--ve-accent-rgb, 74, 125, 255), 0.5); color: var(--ve-text-strong, #fff); }
.reports-chart-dot { width: 10px; height: 10px; border-radius: 50%; }
.reports-chart-chip:not(.is-on) .reports-chart-dot { opacity: .45; }

/* Notifications: "Clear all" reads as an action */
.dropdown-menu.notifications-box .title .notification-clear-all { color: var(--ve-accent-fg, #6c94ff) !important; font-size: .8125rem; font-weight: 600; text-decoration: none; cursor: pointer; }
.dropdown-menu.notifications-box .title .notification-clear-all:hover { color: var(--ve-text-strong, #fff) !important; text-decoration: underline; }

/* Toasts: above every dialog, themed surface, readable text, coloured status stripe. */
.iziToast-wrapper { z-index: 100300 !important; }
.iziToast:not(.ve-confirm) { background: var(--ve-surface-2, #1e2024) !important; border: 1px solid var(--ve-line-strong, rgba(255, 255, 255, 0.14)) !important; border-left-width: 4px !important; border-radius: 4px !important; box-shadow: 0 8px 24px rgba(0, 0, 0, 0.28); }
.iziToast:not(.ve-confirm)::after { display: none !important; }
.iziToast:not(.ve-confirm) .iziToast-message, .iziToast:not(.ve-confirm) .iziToast-title { color: var(--ve-text, #f2f3f5) !important; opacity: 1 !important; }
.iziToast:not(.ve-confirm) > .iziToast-close { filter: invert(1); opacity: .6; }
html[data-theme="light"] .iziToast:not(.ve-confirm) > .iziToast-close { filter: none; }
.iziToast-color-green:not(.ve-confirm) { border-left-color: #3fb871 !important; }
.iziToast-color-blue:not(.ve-confirm) { border-left-color: var(--ve-accent, #4a7dff) !important; }
.iziToast-color-orange:not(.ve-confirm) { border-left-color: #e6c229 !important; }
.iziToast-color-red:not(.ve-confirm) { border-left-color: #e5484d !important; }
.iziToast-color-green:not(.ve-confirm) .iziToast-icon { color: var(--ve-t-green, #5fd68a) !important; }
.iziToast-color-blue:not(.ve-confirm) .iziToast-icon { color: var(--ve-accent-fg, #6c94ff) !important; }
.iziToast-color-orange:not(.ve-confirm) .iziToast-icon { color: #e6c229 !important; }
.iziToast-color-red:not(.ve-confirm) .iziToast-icon { color: var(--ve-t-red, #ff6b6f) !important; }
html[data-theme="light"] .iziToast-color-orange:not(.ve-confirm) { border-left-color: #b08800 !important; }
html[data-theme="light"] .iziToast-color-orange:not(.ve-confirm) .iziToast-icon { color: #8a6a00 !important; }

/* ".." row (My Videos and My Files): muted label, pointer cursor, brighter on hover. */
.file_manager .files ul.file_list li.ve-files-up-row, .file_manager .files ul.file_list li.ve-files-up-row a.name { cursor: pointer; }
.file_manager .files ul.file_list li.ve-files-up-row .title { color: var(--ve-text-muted, #9b9ea6); }
.file_manager .files ul.file_list li.ve-files-up-row:hover .title { color: var(--ve-text-strong, #fff); }