html.dark .home-page {
  background: #0f172a;
}

/* ========================================
   



    ranking




   ======================================== */

html.dark .Card {
  background: #111827;
  border-color: #243041;
}

html.dark .SampleSearch-header {
  border-bottom-color: #243041;
}

html.dark .SampleSearch-footer {
  border-top-color: #243041;
}

html.dark .SampleSearchCard-item:hover {
  background-color: #182235;
}

html.dark .SampleSearchCard-item {
  border-bottom-color: #243041;
}

html.dark .SampleSearchCard-primary-heading-title {
  color: #f9fafb;
}

html.dark .SampleSearchCard-primary-heading-text {
  color: #cbd5e1;
}

html.dark .SampleSearchCard-primary-heading-days {
  color: #94a3b8;
}

html.dark .RankingEmptyCard-title {
  color: #f9fafb;
}

html.dark .RankingEmptyCard-text {
  color: #94a3b8;
}

html.dark .RankingEmptyCard-content {
  border-bottom: 1px solid #1f2937;
}

html.dark .Pagination-item:first-child .Pagination-link {
  border-left-color: #334155;
}

html.dark .Pagination-link {
  color: #e5e7eb;
  background: #111827;
  border-color: #334155;
}

html.dark .Pagination-link:hover {
  background: #1f2937;
  border-color: #475569;
}

html.dark .Pagination-link:active,
html.dark .Pagination-link.is-active,
html.dark .Pagination-link.paginate_active {
  color: #ffffff !important;
  background: #2563eb !important;
  border-color: #2563eb;
}

html.dark .Pagination-link.disabled {
  color: #64748b;
  background: #0f172a;
  border-color: #334155;
}

html.dark .Pagination-link [class*="flicon-pagination"] {
  fill: #e5e7eb;
}

html.dark .Pagination-link.disabled [class*="flicon-pagination"] {
  fill: #64748b;
}

html.dark .Pagination-link:active [class*="flicon-pagination"],
html.dark .Pagination-link.is-active [class*="flicon-pagination"],
html.dark .Pagination-link.paginate_active [class*="flicon-pagination"] {
  fill: #ffffff;
}

html.dark .Pagination-link:focus-visible {
  outline: 2px solid #60a5fa;
}

/** like button **/

html.dark .SampleSearchCard-primary-heading .LikeButton {
  color: #e5e7eb;
  background: #020617;
  border-color: #334155;
}

html.dark .SampleSearchCard-primary-heading .LikeButton:hover {
  background: #0f172a;
  border-color: #475569;
}

html.dark .SampleSearchCard-primary-heading .LikeButton-icon {
  color: #94a3b8;
}

html.dark .SampleSearchCard-primary-heading .LikeButton-text,
html.dark .SampleSearchCard-primary-heading .LikeButton-count {
  color: #f9fafb;
}

html.dark .SampleSearchCard-primary-heading .LikeButton-count {
  border-left-color: #334155;
}

html.dark
  .SampleSearchCard-primary-heading
  .LikeButton.is-liked
  .LikeButton-icon {
  color: #facc15;
}

/** dislike button **/

html.dark .SampleSearchCard-primary-heading .DislikeButton {
  color: #e5e7eb;
  background: #020617;
  border-color: #334155;
}

html.dark .SampleSearchCard-primary-heading .DislikeButton:hover {
  background: #0f172a;
  border-color: #475569;
}

html.dark .SampleSearchCard-primary-heading .DislikeButton-icon {
  color: #94a3b8;
}

html.dark .SampleSearchCard-primary-heading .DislikeButton-text,
html.dark .SampleSearchCard-primary-heading .DislikeButton-count {
  color: #f9fafb;
}

html.dark .SampleSearchCard-primary-heading .DislikeButton-count {
  border-left-color: #334155;
}

/** gallery **/

html.dark .SampleSearchCard-primary .gallery-item::before,
html.dark .SampleSearchCard-primary .PlaylistLabel {
  color: #ffffff;
  background: rgba(0, 0, 0, 0.72);
}

html.dark .SampleSearchCard-primary .gallery-title {
  color: rgba(255, 255, 255, 0.88);
  text-decoration-color: rgba(255, 255, 255, 0.28);
}

/* ========================================
   Dark mode
   html.dark が付いた時だけ上書き
   ======================================== */

/* ==============================
   Filter panel
============================== */

html.dark .SectionSampleFilter-inner {
  background: #111827;
  color: #e5e7eb;
}

html.dark .SectionSampleFilter-content {
  background: #111827;
}

/* Header */
html.dark .SectionSampleFilter-header {
  border-bottom: 1px solid #1f2937;
  background: #111827;
}

html.dark .SectionSampleFilter-header-heading {
  color: #f9fafb;
}

html.dark .SectionSampleFilter-header-link {
  color: #9ca3af;
}

html.dark .SectionSampleFilter-header-link:hover {
  color: #f9fafb;
  background: #1f2937;
}

html.dark .SectionSampleFilter-header-link svg,
html.dark .SectionSampleFilter-header-link tyt-icon {
  fill: currentColor;
}

/* Body */
html.dark .SectionSampleFilter-sectionList {
  background: #111827;
}

html.dark .SectionSampleFilter-section {
  border-bottom: 1px solid #1f2937;
}

html.dark .SectionSampleFilter-mainHeading,
html.dark .SectionSampleFilter-heading {
  color: #f3f4f6;
}

/* Sort */
html.dark .SectionSampleFilter-sortLabel {
  color: #9ca3af;
}

/* Select / Input */
html.dark .SectionSampleFilter-sort-select,
html.dark .SectionSampleFilter-sliderItem .default-input {
  background-color: #0f172a;
  color: #f9fafb;
  border: 1px solid #374151;
}

html.dark .SectionSampleFilter-sort-select:hover,
html.dark .SectionSampleFilter-sliderItem .default-input:hover {
  border-color: #4b5563;
}

html.dark .SectionSampleFilter-sort-select:focus,
html.dark .SectionSampleFilter-sliderItem .default-input:focus {
  border-color: #60a5fa;
  box-shadow: 0 0 0 3px rgba(96, 165, 250, 0.18);
  outline: none;
}

html.dark .SectionSampleFilter-sliderItem .default-input::placeholder {
  color: #6b7280;
}

/* select の option */
html.dark .SectionSampleFilter-sort-select option {
  background: #111827;
  color: #f9fafb;
}

/* Like count min / max */
html.dark .SectionSampleFilter-sliderItem-label {
  color: #9ca3af;
}

/* Error / Alert */
html.dark .SectionSampleFilter-alert {
  color: #fecaca;
  background: #7f1d1d;
  border: 1px solid #b91c1c;
}

/* Footer */
html.dark .SectionSampleFilter-footer {
  background: linear-gradient(
    to top,
    #111827 0%,
    #111827 72%,
    rgba(17, 24, 39, 0) 100%
  );
}

/* Footer button */
html.dark .SectionSampleFilter-footer-btn {
  color: #ffffff;
}

/* Active state */
html.dark .is-SectionSampleFilter-active .SectionSampleFilter-inner {
  background: #111827;
}

/* PC時のサイドバー表示 */
@media (min-width: 960px) {
  html.dark .SectionSampleFilter-inner,
  html.dark .is-SectionSampleFilter-active .SectionSampleFilter-inner {
    background: transparent;
  }

  html.dark .SectionSampleFilter-content {
    background: #111827;
    border: 1px solid #1f2937;
    border-radius: 16px;
    overflow: hidden;
  }
}

/* Advertisement */
html.dark .SampleSearch-adSlot.Card {
  color: #9ca3af;
  background: #111827;
  border: 1px dashed #374151;
  box-shadow: none;
}

/* color-scheme */
html.dark .SectionSampleFilter-inner,
html.dark .SectionSampleFilter-sort-select,
html.dark .SectionSampleFilter-sliderItem .default-input {
  color-scheme: dark;
}