/*
 * Theme: dotmusic
 * Mode: Light Mode
 *
 * Auto-generated by generate-theme.py
 * Primary color: #000000
 *
 * Load this file AFTER registry-admin.css to apply the theme.
 */

:root {
  /* PRIMARY BRAND COLORS */
  --theme-primary: #000000;
  --theme-primary-hover: #000000;
  --theme-primary-light: rgba(0, 0, 0, 0.1);
  --theme-primary-shadow: rgba(0, 0, 0, 0.3);

  /* SECONDARY COLORS */
  --theme-secondary: #e4483b;
  --theme-secondary-hover: #cf2a1c;

  /* SEMANTIC COLORS - SUCCESS */
  --theme-success: #198754;
  --theme-success-bg: #d1e7dd;
  --theme-success-border: #badbcc;
  --theme-success-text: #0f5132;

  /* SEMANTIC COLORS - WARNING */
  --theme-warning: #ffc107;
  --theme-warning-bg: #fff3cd;
  --theme-warning-border: #ffeeba;
  --theme-warning-text: #856404;

  /* SEMANTIC COLORS - DANGER */
  --theme-danger: #dc3545;
  --theme-danger-hover: #c82333;
  --theme-danger-bg: #f8d7da;
  --theme-danger-border: #f5c6cb;
  --theme-danger-text: #842029;

  /* SEMANTIC COLORS - INFO */
  --theme-info: #0dcaf0;
  --theme-info-bg: #d9edf7;
  --theme-info-border: #bce8f1;
  --theme-info-text: #31708f;

  /* TEXT COLORS */
  --theme-text-primary: #212529;
  --theme-text-secondary: #495057;
  --theme-text-muted: #6c757d;
  --theme-text-light: #6b7280;
  --theme-text-on-primary: #ffffff;

  /* BACKGROUND COLORS */
  --theme-bg-page: #ffffff;
  --theme-bg-sidebar: #f8f9fa;
  --theme-bg-card: #ffffff;
  --theme-bg-header: #f8fafc;
  --theme-bg-hover: #e9ecef;
  --theme-bg-hover-subtle: rgba(0, 0, 0, 0.04);
  --theme-bg-stripe: #f8fafc;

  /* BORDER COLORS */
  --theme-border: #dee2e6;
  --theme-border-light: #e9ecef;
  --theme-border-dark: #d1d5db;

  /* LINK COLORS */
  --theme-link: #000000;
  --theme-link-hover: #000000;

  /* TOOLTIP COLORS */
  --theme-tooltip-bg: #222222;
  --theme-tooltip-text: #ffffff;

  /* TABLE COLORS */
  --theme-table-header-bg: #f8fafc;
  --theme-table-header-text: #374151;
  --theme-table-border: #e5e7eb;
  --theme-table-stripe-bg: #f8fafc;
  --theme-table-hover-bg: #f1f5f9;

  /* FORM COLORS */
  --theme-input-border: #d1d5db;
  --theme-input-focus-border: #191919;
  --theme-input-focus-shadow: rgba(0, 0, 0, 0.25);

  /* BADGE COLORS */
  --theme-badge-env: #ff0000;

  /* MISCELLANEOUS */
  --theme-crosshair-bg: #e5f2ec;
  --theme-search-query-bg: #ddffdd;
  --theme-affix-top-bg: #ffc107;
  --theme-affix-bottom-bg: #198754;
}


/* =============================================
   COMPONENT OVERRIDES USING CSS VARIABLES
   ============================================= */

/* ----- Sidebar Navigation ----- */
.sidebar-nav {
  background: var(--theme-bg-sidebar);
  border-right-color: var(--theme-border-light);
}

.sidebar-nav .nav-pills .nav-link {
  color: var(--theme-text-secondary);
}

.sidebar-nav .nav-pills .nav-link:hover {
  background-color: var(--theme-bg-hover);
  color: var(--theme-primary);
}

.sidebar-nav .nav-pills .nav-link.active {
  background-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
  box-shadow: 0 2px 4px var(--theme-primary-shadow);
}

/* ----- Navigation Tabs ----- */
.nav-tabs {
  border-bottom-color: var(--theme-border);
}

.nav-tabs .nav-link {
  color: var(--theme-primary);
}

.nav-tabs .nav-link:hover {
  border-color: var(--theme-border-light) var(--theme-border-light) var(--theme-border);
  color: var(--theme-primary-hover);
}

.nav-tabs .nav-link.active,
.nav-tabs > li.active > a,
.nav-tabs > li.active > a:focus,
.nav-tabs > li.active > a:hover {
  color: var(--theme-text-secondary);
  background-color: var(--theme-bg-card);
  border-color: var(--theme-border) var(--theme-border) var(--theme-bg-card);
}

/* ----- Registrar Tabs ----- */
.registrar-tabs {
  border-bottom-color: var(--theme-border-light);
}

.registrar-tabs .nav-link {
  color: var(--theme-text-muted);
}

.registrar-tabs .nav-link:hover {
  color: var(--theme-primary);
}

.registrar-tabs .nav-link.active {
  color: var(--theme-primary);
  border-color: transparent transparent var(--theme-primary) transparent;
}

/* ----- Page Headers ----- */
.registrar-page-header {
  border-bottom-color: var(--theme-border-light);
}

.registrar-page-header h1 {
  color: var(--theme-text-primary);
}

.registrar-page-header h1 i {
  color: var(--theme-primary);
}

/* ----- Links ----- */
a {
  color: var(--theme-link);
}

a:hover {
  color: var(--theme-link-hover);
}

.highlights-list a {
  color: var(--theme-primary);
}

/* ----- Buttons (Primary) ----- */
.btn-primary {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: var(--theme-primary-hover);
  border-color: var(--theme-primary-hover);
  color: var(--theme-text-on-primary);
}

/* ----- Buttons (Secondary) ----- */
.btn-secondary {
  background-color: var(--theme-secondary);
  border-color: var(--theme-secondary);
  color: var(--theme-text-on-primary);
}

.btn-secondary:hover,
.btn-secondary:focus {
  background-color: var(--theme-secondary-hover);
  border-color: var(--theme-secondary-hover);
}

/* ----- Buttons (Danger) ----- */
.btn-danger {
  background-color: var(--theme-danger);
  border-color: var(--theme-danger);
}

.btn-danger:hover,
.btn-danger:focus {
  background-color: var(--theme-danger-hover);
  border-color: var(--theme-danger-hover);
}

/* ----- Alerts ----- */
.alert-info {
  color: var(--theme-info-text);
  background-color: var(--theme-info-bg);
  border-color: var(--theme-info-border);
}

.alert-warning {
  color: var(--theme-warning-text);
  background-color: var(--theme-warning-bg);
  border-color: var(--theme-warning-border);
}

.alert-success {
  color: var(--theme-success-text);
  background-color: var(--theme-success-bg);
  border-color: var(--theme-success-border);
}

.alert-danger {
  color: var(--theme-danger-text);
  background-color: var(--theme-danger-bg);
  border-color: var(--theme-danger-border);
}

/* ----- Text Utilities ----- */
.text-warning {
  color: var(--theme-warning) !important;
}

.text-danger {
  color: var(--theme-danger) !important;
}

.text-success {
  color: var(--theme-success) !important;
}

.text-primary {
  color: var(--theme-primary) !important;
}

.text-muted {
  color: var(--theme-text-muted) !important;
}

.subtitle {
  color: var(--theme-text-light);
}

/* ----- Cards ----- */
.registrar-tab-content .card {
  border-color: var(--theme-border-dark);
}

.registrar-tab-content .card-header {
  background: linear-gradient(to right, var(--theme-bg-header), var(--theme-bg-stripe));
  border-bottom-color: var(--theme-border-dark);
}

.registrar-tab-content .card-title {
  color: var(--theme-text-primary);
}

/* ----- Tables ----- */
.table-header-rotated td {
  border-color: var(--theme-border);
}

.registrar-tab-content .table thead th {
  background: var(--theme-table-header-bg);
  border-bottom-color: var(--theme-table-border);
  color: var(--theme-table-header-text);
}

.registrar-tab-content .table tbody td {
  color: var(--theme-text-secondary);
}

.registrar-tab-content .table-striped > tbody > tr:nth-of-type(odd) > td {
  background-color: var(--theme-table-stripe-bg);
}

/* Contact table */
.contact-table-container .react-bs-table {
  border-color: var(--theme-border-light);
}

.contact-table-container .react-bs-table thead th {
  background: var(--theme-bg-sidebar);
  border-bottom-color: var(--theme-border);
  color: var(--theme-text-secondary);
}

.contact-table-container .react-bs-table tbody td {
  border-bottom-color: var(--theme-border-light);
}

.contact-table-container .react-bs-table tbody tr:hover {
  background-color: var(--theme-bg-hover-subtle);
}

/* ----- Filter Row ----- */
.contact-table-container .RowForm,
.contacts-toolbar {
  background: var(--theme-bg-sidebar);
  border-color: var(--theme-border-light);
}

/* ----- Action Buttons ----- */
.contact-action-link {
  color: var(--theme-text-secondary);
  background-color: var(--theme-bg-sidebar);
  border-color: var(--theme-border);
}

.contact-action-link:hover {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.contact-action-link.contact-action-delete:hover {
  background-color: var(--theme-danger-hover);
  border-color: var(--theme-danger-hover);
  color: var(--theme-text-on-primary);
}

/* Override for icon visibility */
.contact-actions-cell .contact-action-link {
  color: var(--theme-text-secondary) !important;
  background-color: var(--theme-bg-sidebar) !important;
  border-color: var(--theme-border) !important;
}

.contact-actions-cell .contact-action-link:hover {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary) !important;
  color: var(--theme-text-on-primary) !important;
}

.contact-actions-cell .contact-action-link.contact-action-delete:hover {
  background-color: var(--theme-danger-hover) !important;
  border-color: var(--theme-danger-hover) !important;
}

/* ----- Pagination ----- */
.panel-regular-table-top-page-list .pagination .page-link,
.panel-regular-table-top-page-list .pagination > li > a {
  border-color: var(--theme-border);
  color: var(--theme-text-secondary);
}

.panel-regular-table-top-page-list .pagination .page-item.active .page-link,
.panel-regular-table-top-page-list .pagination > li.active > a {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.react-bs-table-sizePerPage-dropdown .btn {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.react-bs-table-sizePerPage-dropdown .dropdown-menu {
  border-color: var(--theme-border-light);
}

.react-bs-table-sizePerPage-dropdown .dropdown-item:hover {
  background-color: var(--theme-bg-sidebar);
}

/* ----- Forms ----- */
.registrar-tab-content .form-label {
  color: var(--theme-text-secondary);
}

.registrar-tab-content .form-control {
  border-color: var(--theme-input-border);
}

.registrar-tab-content .form-control:focus {
  border-color: var(--theme-input-focus-border);
  box-shadow: 0 0 0 3px var(--theme-input-focus-shadow);
}

/* ----- Tooltips ----- */
.tooltip-inner {
  background-color: var(--theme-tooltip-bg);
  color: var(--theme-tooltip-text);
}

.tooltip.top .tooltip-arrow,
.tooltip.top-left .tooltip-arrow,
.tooltip.top-right .tooltip-arrow {
  border-top-color: var(--theme-tooltip-bg);
}

.tooltip.right .tooltip-arrow {
  border-right-color: var(--theme-tooltip-bg);
}

.tooltip.bottom .tooltip-arrow,
.tooltip.bottom-left .tooltip-arrow,
.tooltip.bottom-right .tooltip-arrow {
  border-bottom-color: var(--theme-tooltip-bg);
}

.tooltip.left .tooltip-arrow {
  border-left-color: var(--theme-tooltip-bg);
}

/* ----- Toast Notifications ----- */
.highlights-toast-container .toast-header {
  background-color: var(--theme-warning-bg);
  border-bottom-color: var(--theme-warning-border);
}

.highlights-toast-container .toast-body {
  background-color: var(--theme-bg-card);
}

/* ----- Environment Badge ----- */
.badge-env {
  background: var(--theme-badge-env);
  color: var(--theme-text-on-primary);
}

/* ----- DataTables ----- */
.dataTables_wrapper table.dataTable thead th {
  background-color: var(--theme-table-header-bg);
  border-bottom-color: var(--theme-table-border);
  color: var(--theme-table-header-text);
}

.dataTables_wrapper table.dataTable tbody td {
  border-bottom-color: var(--theme-table-border);
  color: var(--theme-text-secondary);
}

.dataTables_wrapper table.dataTable tbody tr:hover {
  background-color: var(--theme-table-hover-bg);
}

.dataTables_wrapper table.dataTable tbody tr:nth-of-type(odd) {
  background-color: var(--theme-table-stripe-bg);
}

.dataTables_wrapper table.dataTable tbody tr:nth-of-type(odd):hover {
  background-color: var(--theme-table-hover-bg);
}

.dataTables_length label,
.dataTables_filter label,
.dataTables_info {
  color: var(--theme-text-light);
}

.dataTables_length select,
.dataTables_filter input {
  color: var(--theme-text-secondary);
  border-color: var(--theme-input-border);
}

.dataTables_length select:focus,
.dataTables_filter input:focus {
  border-color: var(--theme-input-focus-border);
  box-shadow: 0 0 0 0.2rem var(--theme-input-focus-shadow);
}

.dataTables_wrapper table.dataTable thead th.sorting_asc::after,
.dataTables_wrapper table.dataTable thead th.sorting_desc::after {
  color: var(--theme-primary);
}

.dataTables_paginate .paginate_button {
  color: var(--theme-text-secondary);
  border-color: var(--theme-input-border);
}

.dataTables_paginate .paginate_button:hover:not(.disabled):not(.current) {
  background-color: var(--theme-bg-hover);
  border-color: var(--theme-text-muted);
  color: var(--theme-text-primary);
}

.dataTables_paginate .paginate_button.current {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

/* ----- Popovers ----- */
.popover {
  background-color: var(--theme-bg-card);
  border-color: rgba(0, 0, 0, 0.2);
}

.popover-header {
  background-color: var(--theme-bg-header);
}

.popover-body {
  color: var(--theme-text-primary);
}

/* ----- Miscellaneous ----- */
.form-signin {
  background-color: var(--theme-bg-card);
  border-color: var(--theme-border-light);
}

.dropdown-submenu > a:after {
  border-left-color: var(--theme-text-muted);
}

.dropdown-submenu:hover > a:after {
  border-left-color: var(--theme-text-on-primary);
}

.header {
  border-color: var(--theme-border);
}

.crosshair {
  background-color: var(--theme-crosshair-bg);
}

input.search-query {
  background-color: var(--theme-search-query-bg);
}

.affix-top {
  background: var(--theme-affix-top-bg);
}

.affix-bottom {
  background: var(--theme-affix-bottom-bg);
}

.parsley-validated {
  background-color: var(--theme-bg-sidebar);
}

/* ----- Select2 Dropdowns ----- */
.select2-drop-active {
  border-color: var(--theme-primary);
}

.select2-drop.select2-drop-above.select2-drop-active {
  border-top-color: var(--theme-primary);
}

.select2-container-active .select2-choice,
.select2-container-active .select2-choices {
  border-color: var(--theme-primary);
}

.select2-dropdown-open .select2-choice {
  border-color: var(--theme-primary);
}

.select2-container-multi.select2-container-active .select2-choices {
  border-color: var(--theme-primary);
}

.select2-results .select2-highlighted {
  background-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.select2-search input.select2-active {
  background-color: var(--theme-bg-card);
}

/* ----- Bootstrap 5 Form Select ----- */
.form-select:focus {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 0.25rem var(--theme-primary-light);
}

/* ----- Bootstrap 5 Dropdown ----- */
.dropdown-item.active,
.dropdown-item:active {
  background-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.dropdown-item:focus,
.dropdown-item:hover {
  background-color: var(--theme-bg-hover);
  color: var(--theme-text-primary);
}

/* ----- List Group Items ----- */
.list-group-item.active {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

/* ----- Focus States ----- */
.form-control:focus {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 0.25rem var(--theme-primary-light);
}

.form-check-input:checked {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
}

.form-check-input:focus {
  border-color: var(--theme-primary);
  box-shadow: 0 0 0 0.25rem var(--theme-primary-light);
}

/* ----- Navbar ----- */
.navbar {
  background-color: var(--theme-bg-card);
  border-bottom-color: var(--theme-border);
}

.navbar-brand {
  color: var(--theme-primary);
}

.navbar-nav .nav-link {
  color: var(--theme-text-secondary);
}

.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus {
  color: var(--theme-primary);
}

.navbar-nav .nav-link.active {
  color: var(--theme-primary);
}

/* ----- React Bootstrap Table Export Button ----- */
.react-bs-table-csv-btn {
  background-color: var(--theme-primary) !important;
  border-color: var(--theme-primary-hover) !important;
  color: var(--theme-text-on-primary) !important;
}

.react-bs-table-csv-btn:hover,
.react-bs-table-csv-btn:focus,
.react-bs-table-csv-btn:active {
  background-color: var(--theme-primary-hover) !important;
  border-color: var(--theme-primary-hover) !important;
  color: var(--theme-text-on-primary) !important;
}

/* ----- Bootstrap btn-info (used by various components) ----- */
.btn-info {
  background-color: var(--theme-primary);
  border-color: var(--theme-primary);
  color: var(--theme-text-on-primary);
}

.btn-info:hover,
.btn-info:focus,
.btn-info:active {
  background-color: var(--theme-primary-hover);
  border-color: var(--theme-primary-hover);
  color: var(--theme-text-on-primary);
}

/* ----- Main Content Area ----- */
.main-content {
  background: var(--theme-bg-page);
}

.Main {
  background: var(--theme-bg-page);
}

body {
  background-color: var(--theme-bg-page);
  color: var(--theme-text-primary);
}