// Copyright (C) 2025 The Android Open Source Project
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//      http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

.pf-search-benchmark-page {
  padding: 20px;
  max-width: 1200px;
  margin: 0 auto;

  h1 {
    margin-bottom: 20px;
  }

  h2 {
    margin-top: 30px;
    margin-bottom: 15px;
  }

  h3 {
    margin-top: 20px;
    margin-bottom: 10px;
  }

  h4 {
    margin-top: 15px;
    margin-bottom: 10px;
  }
}

.pf-search-benchmark-results {
  margin-top: 30px;
}

.pf-search-benchmark-summary {
  background: var(--pf-color-surface-1);
  padding: 15px;
  border-radius: 4px;
  margin-bottom: 20px;

  p {
    margin: 5px 0;
  }
}

.pf-search-benchmark-comparison {
  margin-bottom: 30px;

  table {
    width: 100%;
    border-collapse: collapse;
    background: var(--pf-color-surface-0);

    th,
    td {
      padding: 12px;
      text-align: left;
      border-bottom: 1px solid var(--pf-color-divider);
    }

    th {
      background: var(--pf-color-surface-1);
      font-weight: 600;
    }

    tr:hover {
      background: var(--pf-color-surface-1);
    }
  }
}

.pf-search-benchmark-methods {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  gap: 20px;
}

.pf-search-benchmark-method {
  background: var(--pf-color-surface-0);
  padding: 15px;
  border-radius: 4px;

  table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 10px;

    th,
    td {
      padding: 8px;
      text-align: left;
      border-bottom: 1px solid var(--pf-color-divider);
    }

    th {
      background: var(--pf-color-surface-1);
      font-weight: 600;
    }

    tr:hover {
      background: var(--pf-color-surface-1);
    }
  }
}

.pf-search-benchmark-diff {
  margin-bottom: 24px;

  .pf-diff-details {
    margin-top: 12px;
    padding-top: 12px;
    border-top: 1px solid var(--line-color);

    h4 {
      margin: 12px 0 8px 0;
      font-size: var(--pf-font-size-m);
      font-weight: 500;
    }

    ul {
      margin: 8px 0;
      padding-left: 20px;
      font-family: monospace;
      font-size: var(--pf-font-size-s);

      li {
        margin: 4px 0;
        line-height: 1.6;
      }
    }

    p {
      margin: 8px 0;
      font-style: italic;
      color: var(--subtle-foreground-color);
    }
  }
}
