/* Darawan Agha automatic Shorts tab */
#shorts .short-toolbar {
  display: grid;
  grid-template-columns: minmax(0, 2fr) minmax(180px, 1fr);
  gap: 18px;
  margin: 24px 0 12px;
}
#shorts .short-toolbar label span { display: block; margin-bottom: 8px; }
#shorts .short-toolbar input,
#shorts .short-toolbar select {
  width: 100%; min-height: 48px; box-sizing: border-box; padding: 11px 13px;
  color: var(--text); background: var(--panel); border: 1px solid var(--line);
  border-radius: 10px; font: inherit;
}
#shorts .short-toolbar input:focus,
#shorts .short-toolbar select:focus { outline: 2px solid var(--yellow); outline-offset: 2px; }
#shorts .short-count { color: var(--muted); margin: 12px 0 20px; }
.short-grid {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 22px; align-items: stretch;
}
.short-card {
  min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 16px;
  background: var(--panel); box-shadow: 0 12px 30px rgba(0,0,0,.14);
  transition: transform .2s ease, border-color .2s ease;
}
.short-card:hover { transform: translateY(-4px); border-color: var(--yellow); }
.short-card-open {
  display: flex; flex-direction: column; width: 100%; height: 100%; padding: 0;
  color: var(--text); background: transparent; border: 0; text-align: start; cursor: pointer;
  font: inherit;
}
.short-card-media { position: relative; display: block; overflow: hidden; aspect-ratio: 9 / 16; background: #111; }
.short-card-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.short-card-media::after {
  content: ''; position: absolute; inset: 45% 0 0;
  background: linear-gradient(transparent, rgba(0,0,0,.6)); pointer-events: none;
}
.short-play-icon {
  position: absolute; z-index: 1; left: 50%; top: 50%; translate: -50% -50%;
  display: grid; place-items: center; width: 52px; height: 52px; border-radius: 50%;
  color: #111; background: rgba(243,206,0,.94); padding-inline-start: 3px;
  box-shadow: 0 8px 24px rgba(0,0,0,.35);
}
.short-card-body { display: flex; flex: 1; flex-direction: column; gap: 15px; padding: 16px; }
.short-card-title {
  display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
  font-size: 1rem; line-height: 1.55;
}
.short-card-footer { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; margin-top: auto; }
.short-card .short-views { position: static !important; max-width: none !important; margin: 0 !important; }
.short-channel {
  position: static !important; max-width: 100%; margin: 0 !important;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.short-channel .channel-text-stack { min-width: 0; }
.short-channel .channel-value {
  display: block; overflow: hidden; max-width: 125px; text-overflow: ellipsis; white-space: nowrap;
}
.short-channel .channel-badge-icon { flex: 0 0 auto; }
.short-pagination button:not([aria-current="page"]) {
  color: var(--text) !important; background: var(--panel) !important;
  border-color: var(--line) !important; box-shadow: none !important; transform: none !important;
}
.short-pagination { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; margin: 30px 0 4px; }
.short-pagination button {
  min-width: 42px; min-height: 42px; padding: 8px 12px; color: var(--text);
  background: var(--panel); border: 1px solid var(--line); border-radius: 9px; cursor: pointer;
}
.short-pagination button[aria-current="page"] {
  color: #111 !important; background: var(--yellow) !important;
  border-color: var(--yellow) !important; box-shadow: 0 0 0 3px rgba(243,206,0,.22) !important;
  transform: translateY(-1px);
}
.short-pagination button:disabled { opacity: .45; cursor: default; }
.short-empty { grid-column: 1 / -1; padding: 40px; text-align: center; color: var(--muted); }
.short-player-modal {
  width: min(94vw, 470px); max-height: 94vh; padding: 0; overflow: visible;
  color: var(--text); background: transparent; border: 0;
}
.short-player-modal::backdrop { background: rgba(0,0,0,.82); backdrop-filter: blur(8px); }
.short-player-shell {
  position: relative; overflow: hidden; border: 1px solid rgba(255,255,255,.2);
  border-radius: 18px; background: #111; box-shadow: 0 24px 80px rgba(0,0,0,.6);
}
.short-player-frame { width: 100%; aspect-ratio: 9 / 16; background: #000; }
.short-player-frame iframe { display: block; width: 100%; height: 100%; border: 0; }
.short-player-close {
  position: absolute; z-index: 3; top: 10px; inset-inline-end: 10px; display: grid;
  place-items: center; width: 42px; height: 42px; padding: 0; color: #fff;
  background: rgba(0,0,0,.72); border: 1px solid rgba(255,255,255,.35); border-radius: 50%;
  font: 28px/1 system-ui, sans-serif; cursor: pointer;
}
.short-player-info { padding: 15px 18px 18px; color: #fff; }
.short-player-info h3 { margin: 0 0 7px; font-size: 1rem; line-height: 1.45; }
.short-player-info p { margin: 0 0 10px; color: #bbb; font-size: .88rem; }
.short-player-info a { color: #f3ce00; font-weight: 700; }
html[data-theme="light"] .short-card,
html[data-theme="light"] #shorts .short-toolbar input,
html[data-theme="light"] #shorts .short-toolbar select,
html[data-theme="light"] .short-pagination button { background: #fff; color: #17212c; border-color: #d1d8e0; }
html[data-theme="light"] .short-pagination button:not([aria-current="page"]) {
  background: #fff !important; color: #17212c !important; border-color: #d1d8e0 !important;
}
@media (max-width: 1050px) { .short-grid { grid-template-columns: repeat(3, minmax(0,1fr)); } }
@media (max-width: 760px) {
  #shorts .short-toolbar { grid-template-columns: 1fr; }
  .short-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 13px; }
  .short-card { border-radius: 12px; }
  .short-card-body { padding: 12px; }
  .short-card-footer { align-items: flex-start; flex-direction: column; }
  .short-player-modal { width: min(94vw, 430px); }
}
@media (max-width: 390px) { .short-grid { grid-template-columns: 1fr; } }
@media (prefers-reduced-motion: reduce) { .short-card { transition: none; } .short-card:hover { transform: none; } }


/* BEGIN DARAWAN SHORTS PURPLE BADGE */
.short-channel.channel-shorts,
html[data-theme="light"] .short-channel.channel-shorts {
  color: #ffffff !important;
  background: #722F99 !important;
  border-color: #A96DCC !important;
  box-shadow: 0 0 10px rgba(114, 47, 153, 0.38) !important;
}

.short-channel.channel-shorts .channel-word,
.short-channel.channel-shorts .channel-value,
html[data-theme="light"] .short-channel.channel-shorts .channel-word,
html[data-theme="light"] .short-channel.channel-shorts .channel-value {
  color: #ffffff !important;
}

.short-channel.channel-shorts .channel-badge-icon {
  display: none !important;
}
/* END DARAWAN SHORTS PURPLE BADGE */


/* BEGIN SHORTS MOBILE DISPLAY FIX */

/* Force every Shorts thumbnail to fill its complete 9:16 area. */
.short-card-media img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  aspect-ratio: auto !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Clean play triangle that cannot become an emoji on iPhone. */
.short-play-icon {
  padding: 0 !important;
  font-size: 0 !important;
}

.short-play-icon::before {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin-left: 4px;
  border-top: 9px solid transparent;
  border-bottom: 9px solid transparent;
  border-left: 15px solid #111111;
}

@media (max-width: 760px) {
  .short-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 12px !important;
  }

  .short-card {
    min-width: 0 !important;
    border-radius: 13px !important;
  }

  .short-card-media {
    width: 100% !important;
    aspect-ratio: 9 / 16 !important;
    min-height: 0 !important;
  }

  .short-play-icon {
    width: 44px !important;
    height: 44px !important;
  }

  .short-play-icon::before {
    border-top-width: 7px;
    border-bottom-width: 7px;
    border-left-width: 12px;
  }

  .short-card-body {
    padding: 12px 10px !important;
    gap: 12px !important;
  }

  .short-card-title {
    font-size: 14px !important;
    line-height: 1.5 !important;
  }

  .short-card-footer {
    align-items: flex-start !important;
    gap: 8px !important;
  }

  .short-channel .channel-value {
    max-width: 105px !important;
  }
}

@media (max-width: 330px) {
  .short-grid {
    grid-template-columns: 1fr !important;
  }
}

/* END SHORTS MOBILE DISPLAY FIX */

/* DARAWAN SHORTS PURPLE NAV START */
.shorts-nav-purple {
  background: #722F99 !important;
  border-color: #9450bd !important;
  color: #ffffff !important;
  box-shadow: 0 5px 18px rgba(114, 47, 153, .30) !important;
}
.shorts-nav-purple:hover,
.shorts-nav-purple:focus-visible {
  background: #873ab5 !important;
  border-color: #ae72cf !important;
  color: #ffffff !important;
  box-shadow: 0 7px 22px rgba(114, 47, 153, .42) !important;
}
.shorts-nav-purple:active {
  background: #5a2378 !important;
  transform: translateY(1px);
}
.shorts-nav-purple:disabled {
  background: #4a3158 !important;
  border-color: #5d426c !important;
  color: rgba(255,255,255,.58) !important;
  box-shadow: none !important;
}
@media (max-width: 640px) {
  .shorts-nav-purple {
    min-width: 44px !important;
    min-height: 44px !important;
  }
}
/* DARAWAN SHORTS PURPLE NAV END */


/* DIRECT PURPLE PREVIOUS NEXT START */
.short-pagination > button:first-child,
.short-pagination > button:last-child {
    background: #722F99 !important;
    border-color: #9450bd !important;
    color: #ffffff !important;
    box-shadow: 0 5px 18px rgba(114,47,153,.35) !important;
}

.short-pagination > button:first-child:hover,
.short-pagination > button:last-child:hover {
    background: #873ab5 !important;
    color: #ffffff !important;
}

.short-pagination > button:first-child:disabled,
.short-pagination > button:last-child:disabled {
    background: #4a3158 !important;
    color: rgba(255,255,255,.60) !important;
}
/* DIRECT PURPLE PREVIOUS NEXT END */


/* MOBILE SHORTS PAGE NUMBERS START */
@media (max-width: 640px) {
    .short-pagination {
        display: flex !important;
        visibility: visible !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 7px !important;
        width: 100% !important;
        padding: 12px 4px !important;
        overflow: visible !important;
    }

    .short-pagination > button {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 38px !important;
        min-height: 38px !important;
        padding: 6px 10px !important;
        margin: 0 !important;
    }

    .short-pagination > button[aria-current="page"],
    .short-pagination > button.active,
    .short-pagination > button.is-active {
        background: #722F99 !important;
        border-color: #9450bd !important;
        color: #ffffff !important;
    }
}
/* MOBILE SHORTS PAGE NUMBERS END */


/* NORMAL MOBILE PAGINATION START */
@media (max-width: 760px) {
    #shorts .short-pagination {
        position: static !important;
        z-index: auto !important;
        inset: auto !important;
        width: 100% !important;
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        justify-content: center !important;
        align-items: center !important;
        flex-wrap: wrap !important;
        gap: 6px !important;
        padding: 10px 4px !important;
        margin: 12px 0 18px !important;
        overflow: visible !important;
        background: transparent !important;
        border: 0 !important;
        box-shadow: none !important;
    }

    #shorts .short-pagination > button {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        align-items: center !important;
        justify-content: center !important;
        min-width: 38px !important;
        min-height: 38px !important;
    }

    #shorts .short-pagination > button[aria-current="page"] {
        background: #722F99 !important;
        border-color: #a963cf !important;
        color: #ffffff !important;
    }
}
/* NORMAL MOBILE PAGINATION END */


/* YELLOW ACTIVE PAGE FINAL START */
#shorts .short-pagination > button[aria-current="page"],
#shorts .short-pagination > button.short-page-number.is-active {
    background: #f3ce00 !important;
    border-color: #f3ce00 !important;
    color: #111111 !important;
    box-shadow: 0 0 0 3px rgba(243,206,0,.22) !important;
}
/* YELLOW ACTIVE PAGE FINAL END */


/* VIDEO STYLE SHORTS PAGINATION START */
#shorts .short-pagination {
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 7px !important;
}

#shorts .short-pagination > button {
    min-width: 42px !important;
    min-height: 42px !important;
}

#shorts .short-pagination > .short-page-back,
#shorts .short-pagination > .short-page-next {
    background: #722F99 !important;
    border-color: #9d55c6 !important;
    color: #ffffff !important;
}

#shorts .short-pagination > .short-page-first,
#shorts .short-pagination > .short-page-last {
    background: rgba(0,160,190,.16) !important;
    border-color: #159fbb !important;
    color: #8eeaff !important;
}

#shorts .short-pagination > .short-page-first:disabled,
#shorts .short-pagination > .short-page-last:disabled {
    background: rgba(0,100,120,.13) !important;
    border-color: #245762 !important;
    color: #52747b !important;
}

#shorts .short-pagination > button[aria-current="page"] {
    background: #f3ce00 !important;
    border-color: #f3ce00 !important;
    color: #111111 !important;
    box-shadow: 0 0 0 3px rgba(243,206,0,.22) !important;
}
/* VIDEO STYLE SHORTS PAGINATION END */


/* SHORTS PAGINATION OVERLAP FIX START */
@media (max-width: 760px) {
    #shorts-grid {
        margin-bottom: 45px !important;
    }

    #shorts .short-pagination {
        position: relative !important;
        inset: auto !important;
        clear: both !important;
        width: 100% !important;
        margin: 0 0 22px !important;
        padding: 0 !important;
        z-index: 1 !important;
        transform: none !important;
    }
}
/* SHORTS PAGINATION OVERLAP FIX END */


/* SEVEN BUTTON PAGINATION GRID START */
@media (max-width: 760px) {
    #shorts .short-pagination {
        display: grid !important;
        grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
        grid-auto-flow: row !important;
        gap: 7px !important;
        width: 100% !important;
        align-items: stretch !important;
        justify-content: stretch !important;
    }

    #shorts .short-pagination > button {
        display: flex !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: none !important;
        min-height: 44px !important;
        padding: 6px 2px !important;
        margin: 0 !important;
        align-items: center !important;
        justify-content: center !important;
        font-size: clamp(.72rem, 3vw, .95rem) !important;
        white-space: nowrap !important;
    }
}
/* SEVEN BUTTON PAGINATION GRID END */


/* SHORTS MATCH VIDEOS BUTTONS START */
#shorts .short-pagination > button {
    background: #202024 !important;
    border: 1px solid #393940 !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* Back and Next */
#shorts .short-pagination > .short-page-back,
#shorts .short-pagination > .short-page-next {
    background: #722F99 !important;
    border-color: #a13ac8 !important;
    color: #ffffff !important;
    box-shadow: 0 0 12px rgba(114,47,153,.35) !important;
}

/* First and Last */
#shorts .short-pagination > .short-page-first,
#shorts .short-pagination > .short-page-last {
    background: #162b31 !important;
    border-color: #00a9c6 !important;
    color: #69d5e8 !important;
    box-shadow: 0 0 10px rgba(0,169,198,.22) !important;
}

/* Active page number */
#shorts .short-pagination > button[aria-current="page"],
#shorts .short-pagination > .is-active {
    background: #f3ce00 !important;
    border-color: #ffe000 !important;
    color: #111111 !important;
    box-shadow: 0 0 12px rgba(243,206,0,.38) !important;
}

/* Disabled buttons */
#shorts .short-pagination > button:disabled {
    opacity: .42 !important;
}

/* Your Comment menu */
nav a[href="#comment"],
nav a[href="#comments"],
nav a:last-child,
nav a:last-child span {
    font-weight: 700 !important;
}
/* SHORTS MATCH VIDEOS BUTTONS END */

/* PAGE NUMBER VIDEO HOVER START */
/* Match the Videos-tab hover on numeric pages only. */
.short-pagination > button:nth-child(n+3):nth-last-child(n+3),
.release-pagination > button:nth-child(n+3):nth-last-child(n+3) {
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

.short-pagination > button:nth-child(n+3):nth-last-child(n+3):not(:disabled):not([aria-current="page"]):hover,
.short-pagination > button:nth-child(n+3):nth-last-child(n+3):not(:disabled):not([aria-current="page"]):focus-visible,
.release-pagination > button:nth-child(n+3):nth-last-child(n+3):not(:disabled):not([aria-current="page"]):hover,
.release-pagination > button:nth-child(n+3):nth-last-child(n+3):not(:disabled):not([aria-current="page"]):focus-visible {
  border-color: #f3ce00 !important;
  box-shadow: 0 0 0 2px rgba(243,206,0,.95), 0 0 16px rgba(243,206,0,.45) !important;
  transform: translateY(-2px) !important;
  cursor: pointer !important;
}
/* PAGE NUMBER VIDEO HOVER END */

/* DARAWAN SHORTS LOGO GREEN STYLE V1 START */
.short-channel.channel-shorts{color:#fff!important;background:linear-gradient(135deg,#026c60,#079b88)!important;border-color:#13bda6!important;box-shadow:0 0 0 1px rgba(19,189,166,.28),0 5px 16px rgba(3,125,110,.28)!important}
.short-card:hover .short-channel.channel-shorts{border-color:#43dfc8!important;box-shadow:0 0 0 1px rgba(67,223,200,.4),0 0 20px rgba(3,125,110,.62)!important}
html[data-theme="light"] .short-channel.channel-shorts{color:#fff!important;background:linear-gradient(135deg,#026c60,#079b88)!important}
/* DARAWAN SHORTS LOGO GREEN STYLE V1 END */