/* INF-064-MOBILE-EXTENDED-UFR/1.8.0 - Part B only; Part A remains v1.7 CSS */
.inf064v18-card { display: none; }

@media (max-width: 768px) {
  .inf064v18-table {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    border: 0 !important;
    background: transparent !important;
  }

  .inf064v18-table > thead { display: none !important; }

  .inf064v18-table > tbody {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
  }

  .inf064v18-table tr.inf064v18-row {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 0 0.65rem 0 !important;
    padding: 0 !important;
    border: 1px solid rgba(100, 116, 139, 0.40) !important;
    border-radius: 0.9rem !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.76) !important;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04) !important;
  }

  html.dark .inf064v18-table tr.inf064v18-row {
    border-color: rgba(100, 116, 139, 0.48) !important;
    background: rgba(15, 23, 42, 0.72) !important;
    box-shadow: none !important;
  }

  .inf064v18-table tr.inf064v18-row::before,
  .inf064v18-table tr.inf064v18-row::after,
  .inf064v18-table tr.inf064v18-row > td::before,
  .inf064v18-table tr.inf064v18-row > td::after {
    content: none !important;
    display: none !important;
  }

  .inf064v18-table tr.inf064v18-row > td.inf064v18-host > .inf064v18-card {
    display: block !important;
    box-sizing: border-box !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0.82rem 0.9rem 0.88rem !important;
    border: 0 !important;
    background: transparent !important;
    color: rgb(15, 23, 42) !important;
    font-size: 1rem !important;
    line-height: 1.35 !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
  }

  html.dark .inf064v18-table tr.inf064v18-row > td.inf064v18-host > .inf064v18-card {
    color: rgb(248, 250, 252) !important;
  }

  .inf064v18-name {
    margin: 0;
    color: inherit;
    font-size: 1rem;
    line-height: 1.35;
    font-weight: 700;
    overflow-wrap: anywhere;
  }

  .inf064v18-identity {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 0.25rem 0.9rem;
    margin-top: 0.68rem;
    padding-top: 0.62rem;
    border-top: 1px solid rgba(100, 116, 139, 0.30);
    color: rgb(71, 85, 105);
    font-size: 0.88rem;
    line-height: 1.35;
  }

  html.dark .inf064v18-identity {
    border-top-color: rgba(100, 116, 139, 0.40);
    color: rgb(148, 163, 184);
  }

  .inf064v18-key { font-weight: 600; }
  .inf064v18-value { color: rgb(30, 41, 59); font-weight: 700; }
  html.dark .inf064v18-value { color: rgb(226, 232, 240); }

  .inf064v18-registry-date {
    width: 100%;
    margin-top: 0.62rem;
    padding: 0.60rem 0.68rem;
    border: 1px solid rgba(5, 150, 105, 0.34);
    border-radius: 0.65rem;
    background: rgba(16, 185, 129, 0.10);
    color: rgb(6, 95, 70);
    font-size: 0.88rem;
    line-height: 1.35;
  }

  html.dark .inf064v18-registry-date {
    border-color: rgba(52, 211, 153, 0.28);
    background: rgba(6, 78, 59, 0.52);
    color: rgb(167, 243, 208);
  }
}

@media (max-width: 360px) {
  .inf064v18-table tr.inf064v18-row > td.inf064v18-host > .inf064v18-card {
    padding: 0.75rem 0.72rem 0.8rem !important;
  }
  .inf064v18-name { font-size: 0.94rem; }
  .inf064v18-identity,
  .inf064v18-registry-date { font-size: 0.82rem; }
}