/* IOTSIEMENS Siemens Theme */
/* Primary: #009999 (Siemens Teal) | Accent: #00b3b3 (Light Teal) */

:root {
  --primary-color: #009999 !important;
  --accent-color: #00b3b3 !important;
}

/* ===== TOOLBAR / HEADER ===== */
.mat-toolbar.mat-primary,
.mat-mdc-toolbar.mat-primary,
mat-toolbar.mat-primary {
  background-color: #009999 !important;
}

/* ===== BUTTONS ===== */
.mat-raised-button.mat-primary,
.mat-flat-button.mat-primary,
.mat-mdc-raised-button.mat-primary,
.mat-mdc-unelevated-button.mat-primary,
.mdc-button--raised.mat-primary {
  background-color: #009999 !important;
}

.mat-fab.mat-accent,
.mat-mini-fab.mat-accent,
.mat-raised-button.mat-accent,
.mat-mdc-fab.mat-accent,
.mat-mdc-mini-fab.mat-accent {
  background-color: #00b3b3 !important;
}

.mat-stroked-button.mat-primary,
.mat-mdc-outlined-button.mat-primary {
  border-color: #009999 !important;
  color: #009999 !important;
}

/* ===== SIDEBAR / MENU ===== */
.tb-side-menu,
.mat-drawer,
.mat-sidenav {
  background-color: #006666 !important;
}

.tb-side-menu .mat-list-item.active,
.mat-nav-list .mat-list-item.active {
  background-color: #009999 !important;
}

.tb-side-menu .mat-list-item:hover {
  background-color: rgba(0, 153, 153, 0.3) !important;
}

/* ===== PROGRESS BARS ===== */
.mat-progress-bar-fill::after,
.mat-mdc-progress-bar .mdc-linear-progress__bar-inner {
  background-color: #00b3b3 !important;
}

.mat-progress-spinner circle,
.mat-spinner circle {
  stroke: #00b3b3 !important;
}

/* ===== TABS ===== */
.mat-tab-group.mat-primary .mat-ink-bar,
.mat-mdc-tab-group.mat-primary .mdc-tab-indicator__content--underline {
  background-color: #00b3b3 !important;
}

.mat-tab-label.mat-tab-label-active,
.mdc-tab--active .mdc-tab__text-label {
  color: #009999 !important;
}

/* ===== TOGGLES & CHECKBOXES ===== */
.mat-slide-toggle.mat-checked .mat-slide-toggle-bar {
  background-color: rgba(0, 179, 179, 0.5) !important;
}

.mat-slide-toggle.mat-checked .mat-slide-toggle-thumb {
  background-color: #00b3b3 !important;
}

.mat-checkbox-checked .mat-checkbox-background,
.mat-mdc-checkbox.mat-accent .mdc-checkbox__background {
  background-color: #00b3b3 !important;
}

.mat-radio-button.mat-accent .mat-radio-inner-circle {
  background-color: #00b3b3 !important;
}

/* ===== LINKS ===== */
a:not(.mat-button):not(.mat-raised-button):not(.mat-flat-button) {
  color: #009999 !important;
}

a:hover:not(.mat-button):not(.mat-raised-button):not(.mat-flat-button) {
  color: #00b3b3 !important;
}

/* ===== FORM INPUTS ===== */
.mat-form-field.mat-focused .mat-form-field-label,
.mat-mdc-form-field.mat-focused .mdc-floating-label {
  color: #009999 !important;
}

.mat-form-field.mat-focused .mat-form-field-ripple,
.mat-mdc-form-field.mat-focused .mdc-line-ripple::after {
  background-color: #009999 !important;
}

.mat-form-field-appearance-outline.mat-focused .mat-form-field-outline-thick {
  color: #009999 !important;
}

/* ===== CARDS & WIDGETS ===== */
.mat-card-header .mat-card-title,
.tb-widget-title {
  color: #009999 !important;
}

/* ===== CHIPS ===== */
.mat-chip.mat-primary,
.mat-mdc-chip.mat-primary {
  background-color: #009999 !important;
  color: white !important;
}

/* ===== SELECTION / HIGHLIGHT ===== */
.mat-option.mat-selected:not(.mat-option-disabled),
.mat-mdc-option.mdc-list-item--selected {
  color: #009999 !important;
}

.mat-primary .mat-option.mat-selected:not(.mat-option-disabled) {
  color: #009999 !important;
}

/* ===== STEPPER ===== */
.mat-step-header .mat-step-icon-selected {
  background-color: #009999 !important;
}

/* ===== DATEPICKER ===== */
.mat-datepicker-toggle-active,
.mat-calendar-body-selected {
  background-color: #00b3b3 !important;
  color: white !important;
}

/* ===== SNACKBAR ===== */
.mat-snack-bar-container.mat-accent {
  background-color: #00b3b3 !important;
}

/* ===== LOGIN PAGE ===== */
.tb-login-page {
  background: linear-gradient(135deg, #006666 0%, #009999 100%) !important;
}

/* Login card/container centering */
.tb-login-page .tb-login-card,
.tb-login-page mat-card {
  margin: 0 auto;
}

/* Login logo - comprehensive centering fix */
.tb-login-page .tb-login-logo,
.tb-login-page .logo-container,
.tb-login-page img[src*="logo"],
.tb-login-page .tb-logo-title,
.tb-login-page [class*="logo"],
.tb-login-page mat-card-header,
.tb-login-page .mat-card-header,
.tb-login-page .mat-card-header-text {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  width: 100% !important;
  text-align: center !important;
}

/* Ensure SVG/image itself is centered */
.tb-login-page img,
.tb-login-page svg,
.tb-login-page .tb-login-logo img,
.tb-login-page .tb-login-logo svg,
.tb-login-page img[src*="logo_title"] {
  margin: 0 auto !important;
  margin-left: auto !important;
  margin-right: auto !important;
  display: block !important;
  float: none !important;
}

/* Card title container */
.tb-login-page .mat-card-title,
.tb-login-page .mat-mdc-card-title,
.tb-login-page .mat-card-avatar {
  width: 100% !important;
  text-align: center !important;
  display: flex !important;
  justify-content: center !important;
}

/* Force center any logo wrapper */
.tb-login-page [class*="logo"] img,
.tb-login-page [class*="Logo"] img {
  margin: 0 auto !important;
  display: block !important;
}

/* Login button styling */
.tb-login-page button[type="submit"],
.tb-login-page .mat-raised-button,
.tb-login-page .mat-flat-button,
.tb-login-page .mdc-button {
  background-color: #009999 !important;
  color: white !important;
}

.tb-login-page .mat-button-wrapper {
  color: white !important;
}

/* Loading spinner (bouncing dots) */
.sk-bounce .sk-child,
.tb-login-page .spinner-bounce > div,
[class*="bounce"] > div,
.tb-login-page [class*="spinner"] {
  background-color: #009999 !important;
}

/* Form input focus states on login */
.tb-login-page .mat-form-field-underline,
.tb-login-page .mat-form-field-ripple,
.tb-login-page .mdc-line-ripple::after {
  background-color: #009999 !important;
}

/* Links on login page */
.tb-login-page a {
  color: #00b3b3 !important;
}

.tb-login-page a:hover {
  color: #00cccc !important;
}

/* ===== DASHBOARD STATES ===== */
.tb-entity-state.tb-success,
.tb-online-status {
  color: #00cccc !important;
}

/* ===== TABLE HEADERS ===== */
.mat-header-cell {
  color: #009999 !important;
  font-weight: 600;
}

/* ===== WARN/ERROR COLOR OVERRIDES (Orange → Teal) ===== */

/* Override ALL warn colors globally */
.mat-warn,
.mat-form-field.mat-warn .mat-form-field-label,
.mat-form-field.mat-warn .mat-form-field-underline,
.mat-form-field.mat-warn .mat-form-field-ripple,
.mat-mdc-form-field.mat-warn .mdc-floating-label,
.mat-mdc-form-field.mat-warn .mdc-line-ripple,
.mat-mdc-form-field.mat-warn .mdc-line-ripple::after,
.mat-form-field-invalid .mat-form-field-label,
.mat-form-field-invalid .mat-form-field-ripple {
  color: #009999 !important;
  background-color: #009999 !important;
}

/* Form field underline in invalid/error state - THE ORANGE LINE FIX */
.mat-form-field-invalid .mat-form-field-underline,
.mat-form-field.ng-invalid .mat-form-field-underline,
.mat-form-field-invalid .mat-form-field-underline .mat-form-field-ripple,
.mat-form-field.mat-form-field-invalid .mat-form-field-underline,
.mdc-text-field--invalid .mdc-line-ripple::before,
.mdc-text-field--invalid .mdc-line-ripple::after,
.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::before,
.mdc-text-field--invalid:not(.mdc-text-field--disabled) .mdc-line-ripple::after {
  background-color: #009999 !important;
}

/* Error messages */
.mat-error,
.mat-mdc-form-field-error,
mat-error,
.mat-hint.mat-error {
  color: #009999 !important;
}

/* Form field labels (always, not just focused) */
.mat-form-field-label,
.mdc-floating-label,
.mat-form-field-label-wrapper label {
  color: rgba(0, 0, 0, 0.6) !important;
}

/* Form field labels when focused */
.mat-form-field.mat-focused .mat-form-field-label,
.mat-mdc-form-field.mat-focused .mdc-floating-label {
  color: #009999 !important;
}

/* Form field underlines (default state) */
.mat-form-field-underline .mat-form-field-ripple,
.mdc-line-ripple::before,
.mdc-line-ripple::after {
  background-color: #009999 !important;
}

/* Loading spinner - override the cyan rgb(43,160,199) */
.tb-loading-spinner > div,
[class*="tb-bounce"],
.tb-bounce1,
.tb-bounce2,
.tb-bounce3 {
  background-color: #009999 !important;
}

/* Primary color buttons (ensure login button is teal) */
.mat-raised-button.mat-primary,
.mat-flat-button.mat-primary,
.mat-button.mat-primary,
button.mat-primary,
.mat-mdc-raised-button.mat-primary,
.mat-mdc-unelevated-button.mat-primary {
  background-color: #009999 !important;
  color: white !important;
}

/* Accent buttons */
.mat-raised-button.mat-accent,
.mat-flat-button.mat-accent,
.mat-mdc-raised-button.mat-accent {
  background-color: #00b3b3 !important;
  color: white !important;
}

/* ===== ADDITIONAL GLOBAL COVERAGE ===== */

/* Dialogs/Modals */
.mat-dialog-title,
.mat-mdc-dialog-title {
  color: #009999 !important;
}

/* Menu items */
.mat-menu-item:hover,
.mat-mdc-menu-item:hover {
  background-color: rgba(0, 153, 153, 0.1) !important;
}

/* Expansion panels */
.mat-expansion-panel-header.mat-expanded,
.mat-expansion-indicator::after {
  color: #009999 !important;
}

/* Autocomplete */
.mat-autocomplete-panel .mat-option.mat-selected {
  background-color: rgba(0, 153, 153, 0.1) !important;
}

/* Paginator */
.mat-paginator .mat-select-value,
.mat-paginator-icon {
  color: #009999 !important;
}

/* Slider */
.mat-slider.mat-primary .mat-slider-thumb,
.mat-slider.mat-primary .mat-slider-track-fill {
  background-color: #009999 !important;
}

/* Badge */
.mat-badge-content {
  background-color: #009999 !important;
}

/* Icon buttons */
.mat-icon-button.mat-primary {
  color: #009999 !important;
}

/* Select dropdown arrow */
.mat-select-arrow {
  color: #009999 !important;
}

/* Tree nodes */
.mat-tree-node:hover {
  background-color: rgba(0, 153, 153, 0.1) !important;
}

/* Sort headers */
.mat-sort-header-arrow {
  color: #009999 !important;
}

/* Tooltip */
.mat-tooltip {
  background-color: #006666 !important;
}

/* ThingsBoard specific - entity tables */
.tb-entity-table .mat-row:hover {
  background-color: rgba(0, 153, 153, 0.05) !important;
}

/* ThingsBoard specific - breadcrumbs */
.tb-breadcrumb a {
  color: #009999 !important;
}

/* ThingsBoard specific - dashboard edit mode */
.tb-dashboard-page.tb-edit-mode .mat-toolbar {
  background-color: #006666 !important;
}