:root {
    --menu-blue: #2f5f8a;
    --menu-blue-dark: #234a6b;
    --surface: #f4f7fa;
    --line: #c7d3de;
    --news-main-width: 1000px;
    --news-mid-width: 420px;
    --news-right-width: 250px;
}

/* Global Reset for Pixel-Perfect Parity & Design Style */
* {
    border-radius: 0 !important;
    transition: none !important;
    animation: none !important;
}

body.cms-bg {
    background:
        radial-gradient(circle at 0% 0%, rgba(70, 123, 167, 0.12), transparent 35%),
        radial-gradient(circle at 100% 0%, rgba(31, 65, 95, 0.14), transparent 38%),
        var(--surface);
}

body.cms-fixed {
    min-width: 1880px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    font-size: 13px;
}

.cms-header-wrap,
.cms-main {
    width: calc(100% - 8px);
    min-width: 1860px;
    margin: 0 auto;
}

.cms-legacy-header {
    position: sticky;
    top: 0;
    z-index: 40;
    background: #1a1a1a;
    border-bottom: 1px solid #000;
}

.cms-header-inner {
    padding: 0 4px;
}

.menu-tab {
    border: 1px solid #264f70;
    background: linear-gradient(180deg, var(--menu-blue), var(--menu-blue-dark));
    color: #fff;
    padding: 0.35rem 0.9rem;
    border-radius: 0.28rem;
    line-height: 1;
}

.legacy-menu {
    width: 100%;
    height: 38px;
    position: relative;
    z-index: 100;
    background: #1a1a1a;
    font-family: 'Roboto', sans-serif;
    font-size: 14px;
}

.legacy-menu ul {
    margin: 0;
    padding: 0;
    list-style: none;
}

.legacy-menu > ul > li {
    float: left;
    width: 105px;
    position: relative;
}

.legacy-menu a {
    display: block;
    font-size: 14px;
    text-decoration: none !important;
    color: rgba(255, 255, 255, 0.82);
    min-width: 90px;
    padding: 0 15px;
    height: 38px;
    line-height: 38px;
    font-weight: 400;
    text-align: center;
}

.legacy-menu li:hover > a {
    color: #fff;
    background: #000;
}

.legacy-menu ul ul {
    visibility: hidden;
    position: absolute;
    top: 38px;
    left: 0;
    min-width: 240px;
    background: #000;
    border: 1px solid rgba(255,255,255,0.1);
    box-shadow: 0 8px 16px rgba(0,0,0,0.6);
    z-index: 300;
    padding: 6px 0;
    border-radius: 0;
}

.legacy-menu ul ul a {
    background: transparent;
    color: #eee;
    height: auto;
    line-height: 1.4;
    padding: 8px 20px;
    width: 100%;
    border: none;
    font-weight: 400;
    text-align: left;
    font-size: 14px;
}

.legacy-menu ul ul a:hover {
    background-color: #222 !important;
    color: #fff !important;
}

.legacy-menu ul li:hover ul {
    visibility: visible;
}

.legacy-quickbar {
    display: none;
}

.quick-cell {
    border-right: 1px solid #ced7dc;
    padding: 8px;
}

.quick-cell:last-child {
    border-right: 0;
}

.quick-cell form {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    white-space: nowrap;
}

.quick-cell input[type="text"] {
    border: 1px solid #9eaab3;
    padding: 3px 5px;
    font-size: 14px;
    flex: 1;
    min-width: 60px;
}

.quick-cell button {
    border: 1px solid #8ea0ad;
    padding: 2px 8px;
    background: #fff;
    font-size: 12px;
}

.quick-cell label {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

.menu-tab:hover {
    filter: brightness(1.06);
}

.menu-tab-muted {
    opacity: 0.85;
}

.chip {
    display: inline-flex;
    align-items: center;
    border-radius: 0.32rem;
    border: 1px solid var(--line);
    background: #fff;
    color: #1f2f3f;
    font-size: 0.82rem;
    font-weight: 600;
    padding: 0.3rem 0.55rem;
}

.chip-active {
    border-color: #7ca0bd;
    background: #eaf2f8;
}

.th-cell {
    font-weight: 700;
    text-align: center;
    border-bottom: 1px solid #c8d4de;
    border-right: 1px solid #d7e0e7;
    padding: 0.45rem;
}

.td-cell {
    border-right: 1px solid #d7e0e7;
    padding: 0.38rem 0.45rem;
    vertical-align: middle;
}

.source-pill {
    display: inline-block;
    min-width: 82px;
    text-align: center;
    padding: 0.1rem 0.45rem;
    font-size: 0.78rem;
    border-radius: 0.2rem;
}

.action-btn {
    border: 1px solid #b8c7d3;
    background: #fff;
    border-radius: 0.3rem;
    width: 1.7rem;
    height: 1.7rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.legacy-actions {
    width: 100%;
    border-collapse: collapse;
    table-layout: fixed;
}

.legacy-actions td {
    width: 25%;
    text-align: center;
    border-right: 1px solid #cfd8df;
    height: 28px;
    vertical-align: middle;
}

.legacy-actions td:last-child {
    border-right: 0;
}

.legacy-actions img {
    vertical-align: middle;
}

.toggle-btn {
    border: 1px solid #bccbd7;
    background: #f8fbfe;
    color: #1f3144;
    border-radius: 999px;
    padding: 0.35rem 0.75rem;
    font-size: 0.82rem;
    font-weight: 700;
}

.toggle-btn.on {
    border-color: #1f6f42;
    background: #198754;
    color: #fff;
}

.order-btn {
    border: 1px solid #b7c7d5;
    border-radius: 0.32rem;
    font-weight: 700;
    padding: 0.3rem;
    background: #eef4f9;
}

.order-btn.active {
    border-color: #1f6cb2;
    background: #d9ebfb;
}

.tag-row {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    border: 1px solid #d1dbe4;
    border-radius: 0.35rem;
    background: #f7fbff;
    padding: 0.28rem 0.45rem;
    font-size: 0.84rem;
}

.remove-tag {
    border: 1px solid #e4b8b8;
    background: #fff;
    border-radius: 0.3rem;
    width: 1.5rem;
    height: 1.5rem;
}

.search-results {
    margin-top: 0.28rem;
    border: 1px solid #b9c6d2;
    border-radius: 0.25rem;
    background: #f3f6f9;
    max-height: 240px;
    overflow: auto;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.search-results button {
    width: 100%;
    text-align: left;
    padding: 0.34rem 0.52rem;
    font-size: 0.84rem;
    border: 0;
    background: #eef3f7;
    border-bottom: 1px solid #dce5ec;
}

.search-results button:hover {
    background: #dce8f2;
}

.photo-thumb {
    border: 2px solid #ced9e4;
    border-radius: 0.35rem;
    overflow: hidden;
    background: #f8fbfd;
}

.photo-thumb.selected {
    border-color: #1da94c;
    box-shadow: 0 0 0 1px #1da94c inset;
}

.photo-thumb img {
    width: 100%;
    height: 126px;
    object-fit: cover;
}

.toggle-btn-wide {
    width: 100%;
    justify-content: center;
    display: inline-flex;
    align-items: center;
    min-height: 2.1rem;
}

.drag-handle {
    color: #6f8293;
    cursor: grab;
    font-size: 0.82rem;
    width: 1rem;
    text-align: center;
    user-select: none;
}

.cast-role-input {
    width: 88px;
    border: 1px solid #c9d4de;
    border-radius: 0.25rem;
    padding: 0.15rem 0.3rem;
    font-size: 0.75rem;
}

.show-cat-option {
    display: block;
    width: 100%;
    text-align: left;
    border: 1px solid #c7d4de;
    border-radius: 0.3rem;
    background: #f4f8fb;
    padding: 0.3rem 0.45rem;
    font-size: 0.78rem;
    margin-bottom: 4px;
}

.show-cat-option:hover {
    background: #dfeefa;
}

.show-edit-layout .field_title {
    font-size: 13px;
    margin-bottom: 4px;
}

.news-edit-grid .tox-tinymce {
    border-radius: 0.35rem;
    border-color: #cdd8e2;
}

.news-edit-grid {
    display: grid;
    grid-template-columns: var(--news-main-width) var(--news-mid-width) var(--news-right-width);
    gap: 12px;
    align-items: start;
    width: calc(var(--news-main-width) + var(--news-mid-width) + var(--news-right-width) + 24px);
}

.news-edit-main {
    width: var(--news-main-width);
}

.news-edit-mid {
    width: var(--news-mid-width);
}

.news-edit-right {
    width: var(--news-right-width);
}

.show-edit-layout {
    display: grid;
    grid-template-columns: 320px minmax(1080px, 1fr) 400px;
    gap: 12px;
    align-items: start;
}

.news-side,
.show-side {
    position: sticky;
    top: 74px;
    align-self: start;
    max-height: calc(100vh - 86px);
    overflow-y: auto;
    padding-right: 2px;
}

.show-edit-left {
    min-width: 300px;
}

.show-edit-main {
    min-width: 1040px;
}

.legacy-box {
    border: 1px solid #bfcbd5;
    border-radius: 4px;
    background: #d6dde2;
    overflow: hidden;
}

.legacy-title {
    background: #c0ccd5;
    color: #1d2a36;
    font-size: 14px;
    font-weight: 700;
    padding: 4px 6px;
    border-bottom: 1px solid #b4c1ca;
}

.legacy-body {
    background: #d6dde2;
}

.cms-toast {
    background-color: #8eeda8;
    height: 24px;
    display: none;
    width: 400px;
    line-height: 24px;
    text-align: center;
    left: 50%;
    transform: translate(-50%, 0);
    position: fixed;
    top: 0;
    z-index: 1000;
}

.cms-toast.error {
    background-color: #f5a8a8;
}

tr.optimistic-pending td {
    opacity: 0.58;
}

.optimistic-pending {
    pointer-events: none;
}

button.optimistic-pending,
input.optimistic-pending,
select.optimistic-pending,
.tag-row.optimistic-pending,
.photo-thumb.optimistic-pending,
.order-btn.optimistic-pending,
.toggle-btn.optimistic-pending,
.cast_row.optimistic-pending,
.cat-row.optimistic-pending {
    opacity: 0.58;
}

tr.optimistic-success td {
    animation: optimisticFlash 0.45s ease-out;
}

@keyframes optimisticFlash {
    0% {
        background-color: #c9f1cf;
    }
    100% {
        background-color: transparent;
    }
}

.shows-actions-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 6px 0;
}

.shows-search-form {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
}

.shows-search-form input[type="text"] {
    width: 360px;
    border: 1px solid #b4bfc5;
    padding: 4px 6px;
}

.shows-search-form button,
.btn-green,
.btn-no-show {
    border: 1px solid #9eb2c3;
    background: #eef3f7;
    padding: 3px 10px;
    font-size: 12px;
    border-radius: 3px;
}

.delete_button {
    border: 1px solid #c93131;
    background: #e62323;
    color: #fff;
    padding: 4px 12px;
    font-size: 12px;
    border-radius: 2px;
    cursor: pointer;
}

.delete_button:hover {
    background: #d81616;
}

.btn-green {
    background: #0c8f58;
    border-color: #0b7d4e;
    color: #fff;
    font-weight: 700;
}

.btn-no-show.active {
    background: #0f9c50;
    border-color: #0d8946;
    color: #fff;
    font-weight: 700;
}

.shows-search-actions {
    display: flex;
    gap: 8px;
    align-items: center;
}

.list {
    border-collapse: collapse;
    background: #fff;
}

.list tr {
    height: 32px;
}

.list tr:hover {
    background-color: #f0f2f2;
}

.list td,
.list th {
    border: 1px solid #d3dbe2;
    font-size: 12px;
    padding: 2px 4px;
}

.list .header td {
    background: #d4dde4;
    font-weight: 700;
}

.synopsis {
    text-align: left;
    font-size: 11px;
    padding-left: 6px;
}

.update_date {
    font-size: 11px;
}

.show_title {
    text-align: left;
    font-size: 14px;
    padding-left: 6px;
}

.english_title {
    text-align: left;
    float: left;
    margin-right: 10px;
    font-size: 13px;
}

.english_title a {
    color: #000;
}

.file_count {
    font-size: 15px;
    cursor: pointer;
}

.file_count:hover {
    background-color: #d0d9d9;
}

.paging {
    margin: 30px auto;
    font-family: Arial, sans-serif;
}

.paging td {
    text-align: center;
    border: 1px solid #d0d9d9;
    width: 50px;
    height: 36px;
    font-size: 16px;
}

.paging .selected {
    font-weight: 700;
}

.season-episode {
    float: right;
    background-color: #ebebeb;
    border: 1px solid #ded9d9;
    padding: 3px;
    min-width: 42px;
    margin-right: 8px;
    text-align: center;
}

.grandfather {
    background-color: #b7deed;
    border: 1px solid #80bacb;
}

.father {
    background-color: #ffc4c4;
    border: 1px solid #fd8383;
}

.season_link {
    color: #8f150e;
}

.guid {
    font-size: 10px;
    cursor: pointer;
}

.copied {
    font-weight: 700;
}

.selectedToDelete,
.selectedToDelete:hover {
    background-color: #edc0c0 !important;
}

#modal1 {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.8);
    z-index: 15000;
    color: #fff;
    font-size: 24px;
    display: none;
    justify-content: center;
    align-items: center;
}

#modal2 {
    background: rgba(0, 0, 0, 0.5);
    padding: 20px 40px;
    text-align: center;
    width: 300px;
    margin: auto;
}

.show-edit-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.show-edit-top h1 {
    font-size: 28px;
    font-weight: 700;
    margin: 0;
}

.show-edit-top-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.show-edit-top-actions a,
.show-edit-top-actions button {
    border: 1px solid #9eb2c3;
    background: #eef3f7;
    padding: 4px 10px;
    font-size: 12px;
    border-radius: 3px;
}

.show-edit-top-actions button {
    background: #2f82d2;
    border-color: #2a75bc;
    color: #fff;
    font-weight: 700;
}

#show-save-indicator {
    font-size: 12px;
    color: #5d6b76;
    min-width: 90px;
    text-align: right;
}

.show-edit-legacy-grid {
    display: grid;
    grid-template-columns: 300px 680px 320px 240px;
    gap: 8px;
    align-items: start;
    width: 1564px;
}

.show-edit-legacy-grid .field_title {
    background: #c0ccd5;
    color: #1e2f3d;
    border: 1px solid #b4c1ca;
    border-bottom: 0;
    font-size: 13px;
    padding: 4px 6px;
    font-weight: 700;
}

.show-edit-legacy-grid .field_div {
    background: #d6dde2;
    border: 1px solid #b4c1ca;
    margin-bottom: 8px;
    box-sizing: border-box;
}

.show-edit-legacy-grid input,
.show-edit-legacy-grid textarea,
.show-edit-legacy-grid select {
    border: 1px solid #b4bfc5;
    padding: 5px;
    font-size: 13px;
    box-sizing: border-box;
}

.show-two-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
}

.cast-list-legacy {
    border-top: 1px solid #ccd6de;
}

.cast-row-legacy {
    display: grid;
    grid-template-columns: 14px 1fr 100px 20px;
    align-items: center;
    gap: 4px;
    border-bottom: 1px solid #ccd6de;
    background: #dce5eb;
    padding: 2px 3px;
    min-height: 24px;
}

.cast-row-legacy .actor-name {
    font-size: 12px;
    color: #1f3850;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cast-row-legacy .cast-role-input {
    width: 100%;
    font-size: 11px;
    padding: 2px 3px;
}

.cast-row-legacy .show-cast-remove {
    border: 0;
    background: transparent;
    padding: 0;
    width: 18px;
    height: 18px;
    cursor: pointer;
}

.show-col-main-right .show-cast-search {
    width: 100%;
    margin-top: 2px;
}

.links-box {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 4px;
    padding: 8px 6px;
    text-align: center;
}

.links-box a,
.links-box button {
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.links-box img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.se-box {
    display: grid;
    grid-template-columns: 18px 1fr 18px 1fr;
    align-items: center;
    gap: 5px;
    font-size: 22px;
    text-align: center;
    padding: 8px;
}

.se-box input {
    text-align: center;
    font-size: 22px;
    padding: 4px;
}

.show-categories-list .cat-row {
    display: grid;
    grid-template-columns: 16px 1fr;
    align-items: center;
    gap: 6px;
    margin-bottom: 3px;
    font-size: 12px;
}

.show-categories-list .show-cat-remove {
    border: 0;
    background: transparent;
    padding: 0;
    width: 14px;
    cursor: pointer;
}

.add_button {
    border: 1px solid #9eb2c3;
    background: #eef3f7;
    padding: 2px 8px;
    font-size: 12px;
    border-radius: 3px;
    cursor: pointer;
}

.add_button:hover {
    background: #e0e8ef;
}

.show-page {
    font-family: Verdana, Geneva, Tahoma, sans-serif;
}

.show-page-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
}

.show-page-top h1 {
    margin: 0;
    font-size: 33px;
    font-weight: 700;
}

.show-page-actions {
    display: flex;
    align-items: center;
    gap: 8px;
}

.show-page-actions a,
.show-page-actions button {
    border: 1px solid #9eb2c3;
    background: #eef3f7;
    padding: 4px 10px;
    font-size: 12px;
    border-radius: 3px;
}

.show-page-actions button {
    background: #2f82d2;
    border-color: #2a75bc;
    color: #fff;
    font-weight: 700;
}

#show-save-indicator {
    min-width: 100px;
    text-align: right;
    color: #5d6b76;
    font-size: 12px;
}

.show-page .field_title {
    background: #c0ccd5;
    border: 1px solid #b4c1ca;
    border-bottom: 0;
    font-size: 12px;
    padding: 3px 6px;
    font-weight: 700;
}

.show-page .field_div {
    background: #d6dde2;
    border: 1px solid #b4c1ca;
    box-sizing: border-box;
}

.show-page input,
.show-page textarea,
.show-page select {
    border: 1px solid #b4bfc5;
    padding: 5px;
    font-size: 12px;
    box-sizing: border-box;
}

.show-empty-poster {
    width: 300px;
    height: 440px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #74818c;
}

.cast-list-legacy {
    border-top: 1px solid #ccd6de;
}

.show-page .cast_row {
    padding: 2px 3px;
    border-bottom: 1px solid #ccd6de;
    background: #dce5eb;
    min-height: 24px;
    cursor: move;
}

.show-page .cast_row,
.show-page .cast_row .actor_name,
.show-page .cast_row .actor_name a,
.show-page .cast_row .cast_buttons {
    user-select: none;
    -webkit-user-select: none;
}

.show-page .actor_name {
    float: left;
    width: 52%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 12px;
}

.show-page .actor_name a {
    color: #20384e;
}

.show-page .role_name {
    float: left;
    width: 38%;
}

.show-page .cast_row.no-role .actor_name {
    width: calc(100% - 36px);
}

.show-page .cast_row.no-role .role_name {
    display: none;
}

.show-page .cast_buttons {
    float: right;
    width: 18px;
    text-align: center;
}

.show-page .cast-role-input {
    width: 100%;
    font-size: 11px;
    padding: 2px 3px;
    user-select: text;
    -webkit-user-select: text;
}

.show-page .show-cast-search {
    width: 100%;
}

.show-page .show-cast-remove,
.show-page .show-cat-remove {
    border: 0;
    background: transparent;
    padding: 0;
    cursor: pointer;
}

.show-page .cast_row.dragging {
    opacity: 0.65;
    background: #c8d9e6;
}

.show-page .cast-sort-chosen {
    background: #c8d9e6;
}

.show-page .cast-sort-ghost {
    opacity: 0.35;
    background: #b8cedf;
}

.show-page .cast-sort-drag {
    background: #c8d9e6;
}

body.drag-sort-active,
body.drag-sort-active * {
    user-select: none !important;
    -webkit-user-select: none !important;
}

.show-page .links-box {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 6px;
    padding: 8px 6px;
    text-align: center;
}

.show-page .links-box img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.show-page .links-box button {
    border: 0;
    background: transparent;
    padding: 0;
}

.show-page .se-box {
    font-size: 24px;
    text-align: center;
    padding: 4px;
}

.show-page .show-categories-list .cat-row {
    display: grid;
    grid-template-columns: 14px 1fr;
    align-items: center;
    gap: 6px;
    margin-bottom: 4px;
    font-size: 12px;
}

/* Title Bar Styles */
.title-bar {
    background: #fff;
    border: 1px solid #c7d3de;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 16px;
    margin-bottom: 20px;
    font-family: 'Roboto', sans-serif;
    width: calc(100% - 8px);
    min-width: 1860px;
    margin-left: auto;
    margin-right: auto;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
}
.title-bar-left, .title-bar-right {
    flex: 1;
}
.title-bar-center {
    flex: 2;
    text-align: center;
    font-size: 26px;
    font-weight: 400;
    color: #1f2f3f;
    letter-spacing: -0.5px;
} .title-bar-right { display: flex; justify-content: flex-end; } 
/* Glomex Page Styles */
.glomex-videos-page {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
}
.youtube-help-link {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 1000;
    background-color: #007bff;
    color: white;
    padding: 8px 12px;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;
    box-shadow: none;
}
.youtube-help-link:hover {
    background-color: #cc0000;
    color: white;
    text-decoration: none;
}
.glomex-table {
    width: 100%;
    margin-bottom: 1rem;
    color: #212529;
    border-collapse: collapse;
}
.glomex-table th {
    padding: 0.3rem;
    vertical-align: bottom;
    border-bottom: 2px solid #dee2e6;
    background-color: #f8f9fa;
    font-weight: bold;
    text-align: center;
}
.glomex-table td {
    padding: 0.3rem;
    vertical-align: middle;
    border-top: 1px solid #dee2e6;
}
.glomex-table tr:nth-of-type(even) {
    background-color: rgba(0,0,0,.05);
}
.glomex-btn {
    display: inline-block;
    font-weight: 400;
    color: #fff;
    text-align: center;
    vertical-align: middle;
    cursor: pointer;
    user-select: none;
    background-color: #007bff;
    border: 1px solid #007bff;
    padding: 0;
    font-size: 14px;
    line-height: 40px;
    border-radius: 0;
    width: 100px;
    height: 40px;
    text-decoration: none;
}
.glomex-btn-success { background-color: #28a745; border-color: #28a745; }
.timestamp { font-size: 18px; }
.video-thumb-wrapper { height: 113px; width: 200px; cursor: pointer; margin: 0 auto; }
.video-thumb-wrapper img { max-width: 100%; max-height: 100%; object-fit: cover; border-radius: 0; }
.show_name { font-size: 14px; border: 1px solid #a2a2a2; background-color: #dcdcdc; padding: 1px 6px; display: block; width: fit-content; margin-bottom: 5px; margin-top: 10px; color: #212529; border-radius: 0; }
.video_title { font-size: 22px; line-height: 25px; margin-bottom: 4px; font-weight: 400; color: #212529; }
.video_summary, .video_body { font-size: 16px; line-height: 20px; margin-top: 10px; color: #212529; }
.pagination { display: flex; padding-left: 0; list-style: none; border-radius: 0; justify-content: center; }
.page-item.active .page-link { z-index: 3; color: #fff; background-color: #007bff; border-color: #007bff; }
.page-link { position: relative; display: block; padding: .5rem .75rem; color: #007bff; background-color: #fff; border: 1px solid #dee2e6; text-decoration: none; border-radius: 0; }
