/*
 * admin-dark.css — Cloud IBR Filament Admin Panel Matte Dark Mode Overrides
 * Registered via AdminPanelProvider ->stylesheet(asset('css/admin-dark.css'))
 *
 * Filament 3.x uses its own bundled CSS and does NOT include app.css, so
 * all admin matte dark-mode overrides must live here.  This file is loaded on
 * every admin panel page (after Filament's own CSS), so !important is
 * used throughout to win the specificity battle.
 */

/* ==========================================================================
    1. BUTTONS — outline style instead of solid in matte dark mode
   Targets: .fi-color-* coloured action buttons (primary/danger/success…)
   Leaves alone: neutral icon-only & sidebar-nav buttons (fi-sidebar-item-btn
   etc.) that do NOT carry a fi-color-* class.
   ========================================================================== */

.dark .fi-btn.fi-color-primary,
.dark .fi-btn.fi-color-success,
.dark .fi-btn.fi-color-danger,
.dark .fi-btn.fi-color-warning,
.dark .fi-btn.fi-color-info {
    background-color: transparent !important;
    background-image: none !important;
    /* box-shadow ring acts as a 1 px border without affecting layout */
    box-shadow: inset 0 0 0 1px var(--color-400) !important;
    color: var(--color-400) !important;
}

.dark .fi-btn.fi-color-primary:hover,
.dark .fi-btn.fi-color-success:hover,
.dark .fi-btn.fi-color-danger:hover,
.dark .fi-btn.fi-color-warning:hover,
.dark .fi-btn.fi-color-info:hover {
    /* semi-transparent fill on hover */
    background-color: color-mix(in oklab, var(--color-400) 12%, transparent) !important;
}

/* Disabled state — keep outlined but at reduced opacity */
.dark .fi-btn.fi-color-primary:disabled,
.dark .fi-btn.fi-color-success:disabled,
.dark .fi-btn.fi-color-danger:disabled,
.dark .fi-btn.fi-color-warning:disabled,
.dark .fi-btn.fi-color-info:disabled {
    opacity: 0.45 !important;
}

/* Raw <button bg-blue-*> elements inside our custom Filament widget views
   (e.g. view-pnap-resources.blade.php) that load app.css via @vite are
   already covered by app.css rules.  These rules add a fallback for any
   remaining raw blue buttons on admin pages that do NOT load app.css. */
.dark button.bg-blue-600,
.dark button.bg-blue-700,
.dark a.bg-blue-600,
.dark a.bg-blue-700 {
    background-color: transparent !important;
    border: 1px solid #60a5fa !important;
    color: #60a5fa !important;
}

.dark button.bg-blue-600:hover,
.dark button.bg-blue-700:hover,
.dark a.bg-blue-600:hover,
.dark a.bg-blue-700:hover {
    background-color: rgba(96, 165, 250, 0.12) !important;
}

/* Admin brand logo background only in matte dark mode */
/* Used for: Filament admin sidebar/header brand mark background in matte dark mode. */
.dark .admin-brand-logo {
    background-color: #afafaf !important;
    border-radius: 6px;
}

/* ==========================================================================
   2. TEXT COLORS — reduce pure white (#fff) to readable light gray
    Filament sets fi-body color to var(--color-white) in matte dark mode, which
   propagates to all child text unless overridden.
   ========================================================================== */

/* Page-level headings such as resource titles and breadcrumb labels in matte dark mode. */
.dark .fi-header-heading,
.dark .fi-simple-header-heading,
.dark .fi-header-subheading,
.dark .fi-breadcrumbs-item-label {
    color: #B6C2CF !important;
}

/* Section/card headings in Filament forms, tables, and relation managers in matte dark mode. */
.dark .fi-section-header-heading,
.dark .fi-ta-header-heading,
.dark .fi-ta-header-heading * {
    color: #B6C2CF !important;
}

/* Fieldset legends and grouped form headings in matte dark mode. */
.dark .fi-fieldset > legend,
.dark .fi-fieldset > legend *,
.dark fieldset.fi-fieldset > legend,
.dark fieldset.fi-fieldset > legend * {
    color: #B6C2CF !important;
}

/* Form field labels — match page heading color (#B6C2CF = gray-300) so
   labels like "Owner" read at the same weight as headings like "Edit Company". */
.dark .fi-fo-field-label,
.dark .fi-fo-field-label-content {
    color: #B6C2CF !important;
}

.dark .fi-fo-field .fi-fo-field-label-content,
.dark .fi-fo-field .fi-fo-field-label-content *,
.dark .fi-fo-field-wrp .fi-fo-field-label-content,
.dark .fi-fo-field-wrp .fi-fo-field-label-content * {
    color: #B6C2CF !important;
}

.dark .fi-in-entry .fi-in-entry-label,
.dark .fi-in-entry .fi-in-entry-label * {
    color: #B6C2CF !important;
}

/* Form field values in inputs, selects, and textareas in matte dark mode. */
.dark input.fi-input,
.dark select.fi-select-input,
.dark textarea.fi-input {
    color: #B6C2CF !important;
    -webkit-text-fill-color: #B6C2CF !important;
}

/* Relation manager and table column headers in matte dark mode. */
.dark .fi-ta-header-cell,
.dark .fi-ta-header-cell *,
.dark .fi-ta-header-cell-label,
.dark .fi-ta-header-cell button,
.dark .fi-ta-header-cell button * {
    color: #a3a3a3 !important;
}

/* Relation manager tab labels and inactive tab text in matte dark mode. */
.dark .fi-tabs-item,
.dark .fi-tabs-item *,
.dark .fi-tabs-item-label {
    color: #a3a3a3 !important;
}
/* Active relation manager tabs and tab icons in matte dark mode. */
.dark .fi-tabs-item.fi-active,
.dark .fi-tabs-item.fi-active *,
.dark .fi-tabs-item.fi-active .fi-tabs-item-label {
    color: #B6C2CF !important;
}

/* Page sub-navigation tabs use the same tab item component but can inherit
   a different color chain on resource edit pages with relation manager tabs. */
.dark .fi-page-sub-navigation-tabs .fi-tabs-item,
.dark .fi-page-sub-navigation-tabs .fi-tabs-item .fi-tabs-item-label,
.dark .fi-page-sub-navigation-tabs .fi-tabs-item > .fi-icon,
.dark .fi-page-sub-navigation-tabs [role="tab"],
.dark .fi-page-sub-navigation-tabs [role="tab"] .fi-tabs-item-label,
.dark .fi-page-sub-navigation-tabs [role="tab"] > .fi-icon {
    color: #B6C2CF !important;
}

.dark .fi-page-sub-navigation-tabs .fi-tabs-item.fi-active,
.dark .fi-page-sub-navigation-tabs .fi-tabs-item.fi-active .fi-tabs-item-label,
.dark .fi-page-sub-navigation-tabs .fi-tabs-item.fi-active > .fi-icon,
.dark .fi-page-sub-navigation-tabs [role="tab"].fi-active,
.dark .fi-page-sub-navigation-tabs [role="tab"].fi-active .fi-tabs-item-label,
.dark .fi-page-sub-navigation-tabs [role="tab"].fi-active > .fi-icon {
    color: #B6C2CF !important;
}

/* Some resource pages render relation navigation in the side sub-navigation
   layout instead of the horizontal tabs container. */
.dark .fi-page-sub-navigation-sidebar,
.dark .fi-page-sub-navigation-sidebar *,
.dark .fi-resource-relation-manager .fi-tabs-item,
.dark .fi-resource-relation-manager .fi-tabs-item .fi-tabs-item-label,
.dark .fi-resource-relation-manager .fi-tabs-item > .fi-icon,
.dark .fi-resource-relation-manager [role="tab"],
.dark .fi-resource-relation-manager [role="tab"] .fi-tabs-item-label,
.dark .fi-resource-relation-manager [role="tab"] > .fi-icon {
    color: #B6C2CF !important;
}

.dark .fi-page-sub-navigation-sidebar .fi-sidebar-group-label,
.dark .fi-page-sub-navigation-sidebar .fi-sidebar-group-btn > .fi-icon,
.dark .fi-page-sub-navigation-sidebar .fi-sidebar-item-btn > .fi-sidebar-item-label,
.dark .fi-page-sub-navigation-sidebar .fi-sidebar-item-btn > .fi-icon,
.dark .fi-page-sub-navigation-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-label,
.dark .fi-page-sub-navigation-sidebar .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon,
.dark .fi-resource-relation-manager .fi-sidebar-group-label,
.dark .fi-resource-relation-manager .fi-sidebar-group-btn > .fi-icon,
.dark .fi-resource-relation-manager .fi-sidebar-item-btn > .fi-sidebar-item-label,
.dark .fi-resource-relation-manager .fi-sidebar-item-btn > .fi-icon,
.dark .fi-resource-relation-manager .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-sidebar-item-label,
.dark .fi-resource-relation-manager .fi-sidebar-item.fi-active > .fi-sidebar-item-btn > .fi-icon {
    color: #B6C2CF !important;
}

/* Account widget subheading/username text in matte dark mode. */
.dark .fi-account-widget-heading {
    color: #B6C2CF !important;
}

/* Empty-state headings/descriptions on admin list and relation-manager pages in matte dark mode. */
.dark .fi-empty-state-heading,
.dark .fi-empty-state-heading *,
.dark .fi-ta-empty-state-heading,
.dark .fi-ta-empty-state-heading * {
    color: #B6C2CF !important;
}

.dark .fi-empty-state-description,
.dark .fi-empty-state-description *,
.dark .fi-ta-empty-state-description,
.dark .fi-ta-empty-state-description * {
    color: #9ca3af !important;
}

/* Sidebar tenant/user trigger text in matte dark mode. */
.dark .fi-sidebar .fi-user-menu-trigger .fi-tenant-menu-trigger-text {
    color: #B6C2CF !important;
}

/* Sidebar navigation item labels in matte dark mode. */
.dark .fi-sidebar-item-label {
    color: #B6C2CF !important;
}

/* Sidebar/navigation group labels in matte dark mode. */
.dark .fi-sidebar-group-label {
    color: #9ca3af !important;
}

/* General admin content surfaces that still inherit pure white in matte dark mode.
    Used for: Filament admin detail panels, infolist entries, section content, dropdowns, and modal copy. */
.dark .fi-section-content,
.dark .fi-section-content *,
.dark .fi-fo-placeholder,
.dark .fi-fo-placeholder *,
.dark .fi-fo-field-content,
.dark .fi-fo-field-content *,
.dark .fi-fo-field-content-ctn,
.dark .fi-fo-field-content-ctn *,
.dark .fi-in,
.dark .fi-in *,
.dark .fi-in-entry-content-ctn,
.dark .fi-in-entry-content-ctn *,
.dark .fi-in-entry-content,
.dark .fi-in-entry-content *,
.dark .fi-sc-text,
.dark .fi-input-wrp,
.dark .fi-input-wrp *,
.dark .fi-ac,
.dark .fi-ac *,
.dark .fi-fo-key-value,
.dark .fi-fo-key-value *,
.dark .fi-dropdown-list,
.dark .fi-dropdown-list *,
.dark .fi-modal-content,
.dark .fi-modal-content *,
.dark .fi-pagination-overview,
.dark .fi-pagination-overview * {
    color: #B6C2CF !important;
}

/* ==========================================================================
    3. PLACEHOLDER WIDGET COMPANY-NAME FIELD
   BackupProvider & Subscription resources use a Placeholder component with
   inline style="background:white; …".  The PHP is patched separately
   to replace the hardcoded "white" with "transparent" + a neutral border.
   The rule below adds a fallback so existing (pre-patch) pages still look OK.
   ========================================================================== */
/* Admin placeholder widgets with inline white backgrounds in matte dark mode. */
.dark .fi-fo-field-wrp [style*="background: white"],
.dark .fi-fo-field-wrp [style*="background:white"],
.dark .fi-fo-field-wrp [style*="background-color: white"] {
    background-color: #2d2d2d !important;
    color: #9ca3af !important;
}

/* Links rendered inside Filament placeholders/field content in matte dark mode. */
.dark .fi-fo-placeholder a,
.dark .fi-fo-field-content a,
.dark .fi-section-content a {
    color: #B6C2CF !important;
}

/* ==========================================================================
   4. TABLE CELLS IN FILAMENT RELATION MANAGERS / LIST PAGES
    Filament's built-in matte dark mode keeps cell text white (#fff).
   Tone these down slightly for readability.
   ========================================================================== */
/* Primary table cell text in admin tables. */
.dark .fi-ta-cell {
    color: #B6C2CF !important;
}

/* Table item label text inside admin table cells. */
.dark .fi-ta-cell .fi-ta-text-item-label {
    color: #B6C2CF !important;
}

/* All other text descendants inside a table cell (spans, links, badges, etc.) */
.dark .fi-ta-cell * {
    color: inherit !important;
}

/* Secondary/description text inside admin table cells. */
.dark .fi-ta-cell .fi-ta-text-item-description {
    color: #9ca3af !important;
}

/* ==========================================================================
   5. WHITE TEXT NORMALIZATION
   Some admin widgets and inline HtmlString markup still render pure white text
   via utility classes. Normalize those to the same #B6C2CF tone used across
   the rest of the admin panel, while leaving button labels/icons alone.
   ========================================================================== */

/* Reusable helper for custom admin view text that should match the muted white theme. */
.dark .admin-text-light {
    color: #B6C2CF !important;
}

/* Generic white utility text normalization inside Filament admin pages. */
.dark .fi-body .text-white:not(input):not(textarea):not(select):not(svg):not(path),
.dark .fi-body .dark\:text-white:not(input):not(textarea):not(select):not(svg):not(path),
.dark .fi-body .dark\:text-white\/80:not(input):not(textarea):not(select):not(svg):not(path),
.dark .fi-body .dark\:text-white\/70:not(input):not(textarea):not(select):not(svg):not(path) {
    color: #B6C2CF !important;
}

/* Top-of-page neutral action buttons often remain white because Filament sets their
   label color at the header action level rather than via utility classes. */
.dark .fi-header .fi-btn:not(.fi-color-primary):not(.fi-color-success):not(.fi-color-danger):not(.fi-color-warning):not(.fi-color-info),
.dark .fi-header .fi-btn:not(.fi-color-primary):not(.fi-color-success):not(.fi-color-danger):not(.fi-color-warning):not(.fi-color-info) *,
.dark .fi-page-sub-navigation .fi-btn:not(.fi-color-primary):not(.fi-color-success):not(.fi-color-danger):not(.fi-color-warning):not(.fi-color-info),
.dark .fi-page-sub-navigation .fi-btn:not(.fi-color-primary):not(.fi-color-success):not(.fi-color-danger):not(.fi-color-warning):not(.fi-color-info) * {
    color: #B6C2CF !important;
}

/* Ensure white utility text inside colored buttons inherits the button color in matte dark mode. */
.dark .fi-btn .text-white,
.dark .fi-btn .dark\:text-white,
.dark .fi-btn .dark\:text-white\/80,
.dark .fi-btn .dark\:text-white\/70,
.dark button.bg-blue-600 .text-white,
.dark button.bg-blue-700 .text-white,
.dark a.bg-blue-600 .text-white,
.dark a.bg-blue-700 .text-white,
.dark button.bg-blue-600 .dark\:text-white,
.dark button.bg-blue-700 .dark\:text-white,
.dark a.bg-blue-600 .dark\:text-white,
.dark a.bg-blue-700 .dark\:text-white {
    color: inherit !important;
}

/* ==========================================================================
    JSON / scrollable pre blocks (ProvisionDataPhoenixnap edit page, etc.)
    Used for: matte dark-mode admin JSON preview boxes rendered from HtmlString markup.
    The PHP renders inline styles, so !important is needed to win.
    ========================================================================== */

.dark .admin-json-pre {
    background: #161b22 !important;
    border-color: #30363d !important;
    color: #c9d1d9 !important;
}
