<div class="p-4 bg-white block sm:flex items-center justify-between border-b border-gray-200 lg:mt-1.5">
  <div class="w-full mb-1">
    <div class="mb-4">
      <nav class="flex mb-5" aria-label="Breadcrumb">
        <ol class="inline-flex items-center space-x-1 text-sm font-medium md:space-x-2">
          <li class="inline-flex items-center">
            <%= link_to tenant_admin_root_path, class: "inline-flex items-center text-gray-700 hover:text-blue-600" do %>
              <svg class="w-5 h-5 mr-2.5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path d="M10.707 2.293a1 1 0 00-1.414 0l-7 7a1 1 0 001.414 1.414L4 10.414V17a1 1 0 001 1h2a1 1 0 001-1v-2a1 1 0 011-1h2a1 1 0 011 1v2a1 1 0 001 1h2a1 1 0 001-1v-6.586l.293.293a1 1 0 001.414-1.414l-7-7z"></path></svg>
              Dashboard
            <% end %>
          </li>
          <li>
            <div class="flex items-center">
              <svg class="w-6 h-6 text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
              <%= link_to "Agencies", tenant_admin_agencies_path, class: "ml-1 text-gray-700 hover:text-blue-600 md:ml-2" %>
            </div>
          </li>
          <li>
            <div class="flex items-center">
              <svg class="w-6 h-6 text-gray-400" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>
              <span class="ml-1 text-gray-400 md:ml-2" aria-current="page"><%= @agency.company_name || @agency.display_name || "Agency ##{@agency.id}" %></span>
            </div>
          </li>
        </ol>
      </nav>
      <h1 class="text-xl font-semibold text-gray-900 sm:text-2xl"><%= @agency.company_name || @agency.display_name || "Agency ##{@agency.id}" %></h1>
    </div>
    <div class="flex items-center space-x-2 sm:space-x-3">
      <%= link_to "← Back to Agencies", tenant_admin_agencies_path, class: "inline-flex items-center px-3 py-2 text-sm font-medium text-center text-gray-500 hover:text-gray-900" %>
    </div>
  </div>
</div>

<div class="grid grid-cols-1 gap-4 my-4 xl:grid-cols-2">
  <!-- Agency Information Card -->
  <div class="p-4 bg-white border border-gray-200 rounded-lg shadow-sm">
    <div class="flex items-center justify-between mb-4">
      <h3 class="text-lg font-semibold text-gray-900">Agency Information</h3>
    </div>
    <dl class="grid grid-cols-1 gap-x-4 gap-y-6 sm:grid-cols-2">
      <div class="sm:col-span-2">
        <dt class="text-sm font-medium text-gray-500">Company Name</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.company_name || "N/A" %></dd>
      </div>
      <div class="sm:col-span-2">
        <dt class="text-sm font-medium text-gray-500">Display Name</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.display_name || "N/A" %></dd>
      </div>
      <% if @agency.respond_to?(:website) && @agency.website %>
        <div>
          <dt class="text-sm font-medium text-gray-500">Website</dt>
          <dd class="mt-1 text-sm text-gray-900">
            <%= link_to @agency.website.subdomain, tenant_admin_website_path(@agency.website), class: "text-blue-600 hover:underline" %>
          </dd>
        </div>
      <% end %>
      <div>
        <dt class="text-sm font-medium text-gray-500">Primary Email</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.email_primary || "N/A" %></dd>
      </div>
      <div>
        <dt class="text-sm font-medium text-gray-500">Primary Phone</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.phone_number_primary || "N/A" %></dd>
      </div>
      <div>
        <dt class="text-sm font-medium text-gray-500">Mobile Phone</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.phone_number_mobile || "N/A" %></dd>
      </div>
      <div class="sm:col-span-2">
        <dt class="text-sm font-medium text-gray-500">URL</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= @agency.url || "N/A" %></dd>
      </div>
      <div>
        <dt class="text-sm font-medium text-gray-500">Created</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= format_date(@agency.created_at) %></dd>
      </div>
      <div>
        <dt class="text-sm font-medium text-gray-500">Last Updated</dt>
        <dd class="mt-1 text-sm text-gray-900"><%= format_date(@agency.updated_at) %></dd>
      </div>
    </dl>
  </div>

  <!-- Additional Information -->
  <div class="p-4 bg-white border border-gray-200 rounded-lg shadow-sm">
    <h3 class="mb-4 text-lg font-semibold text-gray-900">Additional Information</h3>
    <div class="text-sm text-gray-700">
      <p class="text-gray-500 italic">Additional agency details can be displayed here.</p>
    </div>
  </div>
</div>
