/* 共通の区切り。各画面固有の配置・操作色は維持する。 */
:root {
  --lc-divider: #bac8d8;
  --lc-control-border: #879bb2;
  --lc-heading-surface: #eaf0f7;
  --lc-alternate-surface: #f4f7fb;
  --app-line: #bac8d8;
}

/* 一覧表は縦横の罫線で列と行を追えるようにする。 */
body :is(.admin-content, .app-shell) table {
  border: 1px solid var(--lc-divider);
  border-collapse: collapse;
}
body :is(.admin-content, .app-shell) table :is(th, td) {
  border: 1px solid var(--lc-divider);
}
body :is(.admin-content, .app-shell) table thead th {
  background: var(--lc-heading-surface);
  color: #263b53;
}
body :is(.admin-content, .app-shell) table tbody tr:nth-child(even):not(.is-inactive) {
  background: var(--lc-alternate-surface);
}

/* フォームや一覧のまとまりを囲む。 */
body :is(
  .account-card, .account-edit-card, .account-guide-card, .account-submit-card,
  .account-list-card, .my-account-card, .category-create-card, .category-list-card,
  .small-category-create-card, .small-category-list-card,
  .language-card, .language-create-card, .language-selected-card, .language-setup-card,
  .product-basic-card, .product-image-card, .product-note-card, .product-remarks-card,
  .product-detail-card, .product-detail-basic-card, .product-edit-media-card,
  .product-search-card, .product-search-panel, .product-search-results,
  .arrival-country-card, .arrival-register-card, .arrival-warning-card,
  .setting-card, .legal-card, .dashboard-product-card, .login-card
) {
  border: 1px solid var(--lc-divider);
}
body :is(
  .account-card-header, .account-edit-card-header, .account-list-card-header,
  .my-account-card-header, .category-card-header, .category-list-header,
  .small-category-card-header, .small-category-list-header,
  .product-search-card > header, .product-search-results > header,
  .setting-card > header, .product-detail-card > header
) {
  border-bottom: 1px solid var(--lc-divider);
  background: var(--lc-heading-surface);
}

/* カード型・並び替え型の一覧にも各行の境界を付ける。 */
body :is(
  .category-row, .small-category-row, .shipping-country-row,
  .language-list-item, .language-translation-row,
  .product-search-item, .sale-history-item,
  .product-detail-sale-history-list > *, .product-detail-media-item
) {
  border: 1px solid var(--lc-divider);
}
body :is(
  .category-row, .small-category-row, .shipping-country-row,
  .language-translation-row, .product-search-item, .sale-history-item
):nth-child(even):not(.is-inactive):not(.is-selected):not(.is-active) {
  background-color: var(--lc-alternate-surface);
}
body :is(.product-search-table-head, .sale-history-table-head) {
  border: 1px solid var(--lc-divider);
  background: var(--lc-heading-surface);
}

/* 入力項目ごとの横罫線。非表示要素や操作ボタンは対象にしない。 */
body :is(
  .account-field, .account-edit-field, .my-account-field, .login-field,
  .product-form-row, .product-search-field, .sale-history-field,
  .setting-field-row, .language-translation-row
) {
  border-bottom: 1px solid var(--lc-divider);
  padding-bottom: 12px;
}
body :is(
  .account-edit-summary, .my-account-summary, .account-list-summary,
  .dashboard-summary, .category-summary, .small-category-summary,
  .shipping-summary, .sale-history-summary, .language-summary
) > div {
  border: 1px solid var(--lc-divider);
}
body :is(.product-detail-card, .product-detail-basic-card, .legal-section) dl > div {
  border-bottom: 1px solid var(--lc-divider);
}

/* 入力欄は薄い線に埋もれない濃さへ。フォーカス・入力エラーは別色で保持。 */
body input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]):not([type="submit"]):not([type="button"]):not([type="range"]):not([type="color"]),
body select,
body textarea {
  border: 1px solid var(--lc-control-border) !important;
}
body :is(input, select, textarea):focus-visible {
  border-color: #0b72e7 !important;
  outline: 2px solid #0b72e7;
  outline-offset: 2px;
}
body :is(input, select, textarea)[aria-invalid="true"] {
  border-color: #c13939 !important;
  outline-color: #c13939;
}
body :is(input, select, textarea):disabled,
body input[readonly] {
  background-color: #eef2f6;
}
@media (hover: hover) {
  body :is(.account-list-table, .product-search-results) tbody tr:hover,
  body :is(.product-search-item, .sale-history-item):hover {
    background-color: #e9f1fb;
  }
}
body .product-detail-data > div {
  border-bottom: 1px solid var(--lc-divider);
}
body .product-detail-data dt {
  border-right: 1px solid var(--lc-divider);
  background: var(--lc-alternate-surface);
}
body .product-detail-card > summary {
  border-bottom: 1px solid var(--lc-divider);
  background: var(--lc-heading-surface);
}
@media (min-width: 1181px) {
  body .admin-content .product-search-table-head > span + span,
  body .admin-content .product-search-item > h3,
  body .admin-content .product-search-item-meta > *,
  body .admin-content .sale-history-table-head > span + span,
  body .admin-content .sale-history-item > :not(:first-child) {
    border-left: 1px solid var(--lc-divider);
    padding-left: 8px;
  }
}
