/* CANONICAL BRAND CONTRACT
   FlottenPortal CD – this file is the final visual authority.
   Do not redefine brand colors in page-specific CSS.
   Green: #20c98b | Navy: #102a53 | Green hover: #18b97e | Green dark: #129a69
*/
/* FlottenPortal canonical brand colors.
   Loaded by the shared header after page-specific styles so legacy CSS
   cannot recolor the wordmark. */
.fp-appbar.topbar .fp-brand-word,
.fp-appbar.topbar .fp-brand-word > span:first-child{
    color:#20c98b!important;
}
.fp-appbar.topbar .fp-brand-word .fp-brand-accent{
    color:#102a53!important;
}
.fp-appbar.topbar .fp-brand-copy small{
    color:#74849b;
}

/* FlottenPortal CD hardening 2026-09-22 */
:root{
    --fp-brand-green:#20c98b;
    --fp-brand-green-dark:#129a69;
    --fp-brand-navy:#102a53;
    --fp-brand-green-soft:#eaf9f3;
    --blue:#20c98b;
}
.fp-appbar.topbar .fp-brand,
.fp-appbar.topbar .fp-brand-word,
.fp-appbar.topbar .fp-brand-word>span:first-child{color:var(--fp-brand-green)!important}
.fp-appbar.topbar .fp-brand-word .fp-brand-accent{color:var(--fp-brand-navy)!important}
.fp-appbar.topbar .fp-user-avatar{background:linear-gradient(145deg,#102a53,#173e75)!important;color:#fff!important}
/* Canonical primary actions. Danger/destructive actions stay red. */
.primary:not(.danger),
button.primary:not(.danger),
a.primary:not(.danger),
.admin-primary,
.users-primary,
.edit-save,
.damage-filter-actions button,
.damage-status-save,
.mail-card button,
.sync-button:not(.danger),
.tesla-primary,
.ts-actions a.primary,
.category-primary,
.category-save,
.vi-head-actions button,
.vi-footer button,
.vi-add-button,
.vehicle-inventory-save,
.vehicle-inventory-add-submit,
.vehicle-primary-action,
.vehicle-module-action:not(.secondary),
.vehicle-dialog form>button[type="submit"]:not(.danger),
.vehicle-section-actions .vehicle-module-action:not(.secondary),
.vehicle-image-upload-button,
.vehicle-registration-upload,
.costs-add-button,
.vehicle-dialog#costDialog .cost-inline-form>button[type=submit],
.vehicle-dialog#costDialog .cost-dialog-actions button[type=submit],
.asset-create-form button,
.merge-selected-button,
.import-upload button,
.import-commit,
.inv-actions .primary,
.inv-form-actions .primary,
.inv-storage-add .primary,
.tri-actions button,
.md-inventory-action.triopan{
    background:#20c98b!important;
    border-color:#20c98b!important;
    color:#083b2c!important;
    box-shadow:none!important;
}
.primary:not(.danger):hover,
button.primary:not(.danger):hover,
a.primary:not(.danger):hover,
.admin-primary:hover,
.users-primary:hover,
.edit-save:hover,
.damage-filter-actions button:hover,
.damage-status-save:hover,
.mail-card button:hover,
.sync-button:not(.danger):hover,
.tesla-primary:hover,
.ts-actions a.primary:hover,
.category-primary:hover,
.category-save:hover,
.vi-head-actions button:hover,
.vi-footer button:hover,
.vi-add-button:hover,
.vehicle-inventory-save:hover,
.vehicle-inventory-add-submit:hover,
.vehicle-primary-action:hover,
.vehicle-module-action:not(.secondary):hover,
.vehicle-dialog form>button[type="submit"]:not(.danger):hover,
.vehicle-section-actions .vehicle-module-action:not(.secondary):hover,
.vehicle-image-upload-button:hover,
.vehicle-registration-upload:hover,
.costs-add-button:hover,
.asset-create-form button:hover,
.merge-selected-button:hover,
.import-upload button:hover,
.import-commit:hover,
.tri-actions button:hover,
.md-inventory-action.triopan:hover{
    background:#18b97e!important;
    border-color:#18b97e!important;
    color:#082f24!important;
}

/* Inputs and active controls use the same CD accent. */
input:focus,select:focus,textarea:focus{
    border-color:#20c98b!important;
    box-shadow:0 0 0 3px rgba(32,201,139,.12)!important;
}
input[type="checkbox"],input[type="radio"]{accent-color:#20c98b}


/* Remaining legacy primary actions and accent labels. */
.admin-eyebrow,.eyebrow,.inv-eyebrow,.tri-eyebrow,.vi-eyebrow{color:#129a69!important}
.primary-button,
.save-card button,
.qr-admin-empty button,
.qr-admin-actions button,
.assignment-create-form button,
.assignment-edit-form button,
.logbook-driver-edit form button,
.row-editor form button,
.qr-export-btn--primary,
.qr-copy-btn,
.trip-completion-primary{
    background:#20c98b!important;
    border-color:#20c98b!important;
    color:#083b2c!important;
}
.primary-button:hover,
.save-card button:hover,
.qr-admin-empty button:hover,
.qr-admin-actions button:hover,
.assignment-create-form button:hover,
.assignment-edit-form button:hover,
.logbook-driver-edit form button:hover,
.row-editor form button:hover,
.qr-export-btn--primary:hover,
.qr-copy-btn:hover,
.trip-completion-primary:hover{
    background:#18b97e!important;
    border-color:#18b97e!important;
    color:#082f24!important;
}


/* Canonical Flotten-Portal CD · global hardening */
:root{
  --fp-brand-green:#20c98b;
  --fp-brand-green-hover:#18b97e;
  --fp-brand-green-dark:#129a69;
  --fp-brand-navy:#102a53;
  --fp-brand-soft:#eaf9f3;
}

/* Header logo/wordmark */
.fp-appbar.topbar .fp-brand,
.fp-appbar.topbar .fp-brand-word,
.fp-appbar.topbar .fp-brand-word>span:first-child{color:var(--fp-brand-green)!important}
.fp-appbar.topbar .fp-brand-word .fp-brand-accent{color:var(--fp-brand-navy)!important}

/* Notification bell is a permanent part of the shared header. */
.fp-appbar.topbar .fp-header-notifications{
  display:grid!important;
  place-items:center!important;
  color:var(--fp-brand-navy)!important;
}
.fp-appbar.topbar .fp-header-notifications:hover{background:var(--fp-brand-soft)!important}
.fp-appbar.topbar .fp-header-notification-dot{background:var(--fp-brand-green)!important;color:#fff!important}
.fp-notification-open{color:var(--fp-brand-green-dark)!important}
.fp-notification-actions button:hover{border-color:#9edfc6!important;color:var(--fp-brand-green-dark)!important;background:#f0fbf7!important}

/* All primary/action buttons use the new CD. Destructive actions remain red. */
button[class*="primary"]:not(.danger):not([class*="secondary"]),
a[class*="primary"]:not(.danger):not([class*="secondary"]),
[class$="-primary"]:is(button,a):not(.danger),
[class*="-primary "]:is(button,a):not(.danger),
.md-primary,
.diag-btn-primary,
.mail-primary,
.feedback-primary,
.qr-primary,
.inv-actions .primary,
.inv-form-actions .primary,
.inv-storage-add .primary,
.import-upload button,
.import-commit,
.damage-filter-actions button,
.damage-status-save,
.driver-active-end button,
.driver-dialog-primary,
.driver-claim-row button,
.trip-completion-primary{
  background:var(--fp-brand-green)!important;
  border-color:var(--fp-brand-green)!important;
  color:#083b2c!important;
  box-shadow:none!important;
}
button[class*="primary"]:not(.danger):not([class*="secondary"]):hover,
a[class*="primary"]:not(.danger):not([class*="secondary"]):hover,
.md-primary:hover,
.diag-btn-primary:hover,
.mail-primary:hover,
.feedback-primary:hover,
.qr-primary:hover,
.import-upload button:hover,
.import-commit:hover,
.damage-filter-actions button:hover,
.damage-status-save:hover,
.driver-active-end button:hover,
.driver-dialog-primary:hover,
.driver-claim-row button:hover,
.trip-completion-primary:hover{
  background:var(--fp-brand-green-hover)!important;
  border-color:var(--fp-brand-green-hover)!important;
  color:#082f24!important;
}

/* Legacy blue interactive accents -> canonical green. */
.admin-live-search:focus,.admin-live-select:focus,
.admin-global-search-input:focus-within,
.live-filter-menu[open] summary{
  border-color:#7cd5b4!important;
  box-shadow:0 0 0 3px rgba(32,201,139,.12)!important;
}
.admin-list-row.active,
.user-stats [data-live-chip].active,
.live-stat-filter.active,
.vehicle-row.selected{
  border-color:#9edfc6!important;
  background:#effaf5!important;
  box-shadow:0 0 0 3px rgba(32,201,139,.08)!important;
}
.live-stat-filter.active .stat-label,
.damage-vehicle-link,
.inv-eyebrow,
.inv-dialog-head small{color:var(--fp-brand-green-dark)!important}
.live-stat-all .live-stat-icon,
.inv-type,
.inv-chip.vehicle{background:var(--fp-brand-soft)!important;color:var(--fp-brand-green-dark)!important}

@media(max-width:760px){
  .fp-appbar.topbar .fp-header-notifications{
    display:grid!important;
    position:absolute!important;
    top:12px!important;
    right:62px!important;
    width:42px!important;
    height:42px!important;
    z-index:1400!important;
    background:#fff!important;
    border:1px solid #dbe4ed!important;
    border-radius:11px!important;
  }
  .fp-appbar.topbar .fp-header-notifications:hover{background:#f3fbf7!important}
}

/* Remaining legacy blue interaction states */
.admin-link,
.vehicle-trip-link,
.popup-action{
  color:#129a69!important;
}
a.admin-card:hover,
.vehicle-trip-link:hover,
.popup-action:hover{
  border-color:#9edfc6!important;
}
.vehicle-trip-link:hover,
.popup-action:hover{
  background:#f0fbf7!important;
  color:#129a69!important;
}
.vehicle-row:hover{
  background:#f5fcf9!important;
  box-shadow:inset 3px 0 0 #20c98b!important;
}
.admin-card-icon{
  background:#eaf9f3!important;
  color:#129a69!important;
}
.admin-note{
  border-color:#ccefe1!important;
  background:#f4fcf8!important;
}

/* Final wordmark lock: protects against legacy color / text-fill rules. */
.fp-appbar.topbar .fp-brand-word,
.fp-appbar.topbar .fp-brand-word > span:first-child{
  color:var(--fp-brand-green,#20c98b)!important;
  -webkit-text-fill-color:var(--fp-brand-green,#20c98b)!important;
}
.fp-appbar.topbar .fp-brand-word .fp-brand-accent{
  color:var(--fp-brand-navy,#102a53)!important;
  -webkit-text-fill-color:var(--fp-brand-navy,#102a53)!important;
}
.fp-driver-app-brand{
  color:var(--fp-brand-green,#20c98b)!important;
  -webkit-text-fill-color:var(--fp-brand-green,#20c98b)!important;
}
.fp-driver-app-brand span{
  color:var(--fp-brand-navy,#102a53)!important;
  -webkit-text-fill-color:var(--fp-brand-navy,#102a53)!important;
}

/* Login / 2FA wordmark lock */
.fp-login-brand-green{
  color:var(--fp-brand-green,#20c98b)!important;
  -webkit-text-fill-color:var(--fp-brand-green,#20c98b)!important;
}
.fp-login-brand-navy{
  color:var(--fp-brand-navy,#102a53)!important;
  -webkit-text-fill-color:var(--fp-brand-navy,#102a53)!important;
}
.fp-login-brand-copy small{
  color:#74849b!important;
  -webkit-text-fill-color:#74849b!important;
}
