/*
 * ============================================================
 * ANIMUR UI SYSTEM v1.0.13.1
 * ============================================================
 *
 * Zentrale visuelle Komponenten für:
 * - Master
 * - Grooming
 * - Barber
 * - Sicherheit
 * - Plattformverwaltung
 * - Login / Passwort
 *
 * Neue Buttons verwenden:
 *
 *   .an-btn
 *   .an-btn-primary
 *   .an-btn-secondary
 *   .an-btn-ghost
 *   .an-btn-danger
 *   .an-btn-sm
 *   .an-btn-icon
 *
 * Keine Textsuche.
 * Kein MutationObserver.
 * Keine Dialog-Verschiebung.
 */


/* ============================================================
   DESIGN TOKENS
   ============================================================ */

:root{

  --an-ui-accent:
    var(
      --an-accent,
      var(--accent,#cfff36)
    );

  --an-ui-accent-ink:
    var(
      --an-accent-ink,
      #10151b
    );

  --an-ui-text:
    var(
      --an-text,
      var(--text,#18202c)
    );

  --an-ui-muted:
    var(
      --an-muted,
      var(--muted,#718096)
    );

  --an-ui-surface:
    var(
      --an-surface,
      var(--panel,#ffffff)
    );

  --an-ui-surface-2:
    var(
      --an-surface-3,
      var(--panel2,#f3f6f8)
    );

  --an-ui-input:
    var(
      --an-input,
      var(--an-ui-surface)
    );

  --an-ui-border:
    var(
      --an-border,
      var(--line,#d9e0e6)
    );

  --an-ui-danger:#c73737;
  --an-ui-danger-hover:#aa2f2f;

  --an-ui-success:#39c978;

  --an-ui-radius:12px;
  --an-ui-radius-lg:18px;

  --an-ui-btn-height:44px;
  --an-ui-btn-height-sm:36px;

  --an-ui-focus:
    0 0 0 3px rgba(142,190,28,.22);

  --an-ui-shadow:
    0 8px 24px rgba(15,23,42,.08);
}


/* ============================================================
   BUTTON CORE
   ============================================================ */

.an-btn,

button.primary,
button.secondary,
button.ghost,

button.compact-btn,

.ap-btn,

.animur-sec-action,
#sec-refresh-users,
#sec-refresh-audit,

.booking-alert-primary,
.booking-alert-secondary,

.an-booking-save,
.an-booking-cancel,
.an-booking-find,
.an-booking-inline-action,

#new-appt,
#new-customer,
#new-pet,
#new-service,
#new-resource,

#add-exception-v1097,

#location-calendar-settings-v1097,
.employee-schedule-v1097,

.an-team-subactions-v101222 > button,

.dialog-actions > button,
.pet-dialog-actions-v101221 > button,

.ap-close,
.animur-sec-close,
.an-booking-close,
.an-help-head button,
.an-theme-panel-head button{

  appearance:none;

  min-height:var(--an-ui-btn-height);

  display:inline-flex;
  align-items:center;
  justify-content:center;

  gap:8px;

  padding:0 16px;

  border-radius:var(--an-ui-radius);

  border:1px solid transparent;

  font:inherit;
  font-size:14px;
  font-weight:800;
  line-height:1;

  text-decoration:none;

  cursor:pointer;

  transition:
    background-color .15s ease,
    border-color .15s ease,
    color .15s ease,
    box-shadow .15s ease,
    transform .08s ease,
    opacity .15s ease;
}


/* ============================================================
   PRIMARY
   ============================================================ */

.an-btn-primary,

button.primary,

#new-appt,
#new-customer,
#new-pet,
#new-service,
#new-resource,

.an-booking-save,
.booking-alert-primary,

.animur-sec-action,

#ap-save-config,
.ap-btn[data-save-module]{

  background:var(--an-ui-accent)!important;
  color:var(--an-ui-accent-ink)!important;

  border-color:
    color-mix(
      in srgb,
      var(--an-ui-accent) 78%,
      #000
    )!important;

  box-shadow:
    0 2px 0 rgba(0,0,0,.06);
}


.an-btn-primary:hover,
button.primary:hover,

#new-appt:hover,
#new-customer:hover,
#new-pet:hover,
#new-service:hover,
#new-resource:hover,

.an-booking-save:hover,
.booking-alert-primary:hover,

.animur-sec-action:hover,

#ap-save-config:hover,
.ap-btn[data-save-module]:hover{

  filter:brightness(.96);

  transform:translateY(-1px);
}


/* ============================================================
   SECONDARY
   ============================================================ */

.an-btn-secondary,

button.secondary,
button.ghost,

button.compact-btn,

.ap-btn,

#sec-refresh-users,
#sec-refresh-audit,

.booking-alert-secondary,

.an-booking-cancel,
.an-booking-find,
.an-booking-inline-action,

#location-calendar-settings-v1097,
.employee-schedule-v1097,

.an-team-subactions-v101222 > button,

.dialog-actions > button.secondary,
.pet-dialog-actions-v101221 > button.secondary{

  background:var(--an-ui-surface-2)!important;
  color:var(--an-ui-text)!important;

  border-color:var(--an-ui-border)!important;

  box-shadow:none;
}


.an-btn-secondary:hover,
button.secondary:hover,
button.ghost:hover,

button.compact-btn:hover,

.ap-btn:hover,

#sec-refresh-users:hover,
#sec-refresh-audit:hover,

.booking-alert-secondary:hover,

.an-booking-cancel:hover,
.an-booking-find:hover,

#location-calendar-settings-v1097:hover,
.employee-schedule-v1097:hover{

  border-color:
    color-mix(
      in srgb,
      var(--an-ui-border) 55%,
      var(--an-ui-text)
    )!important;

  filter:brightness(.98);
}


/* ============================================================
   GHOST
   ============================================================ */

.an-btn-ghost,

.ap-close,
.animur-sec-close,
.an-booking-close,
.an-help-head button,
.an-theme-panel-head button{

  background:transparent!important;

  color:var(--an-ui-text)!important;

  border-color:transparent!important;

  box-shadow:none!important;
}


.an-btn-ghost:hover,
.ap-close:hover,
.animur-sec-close:hover,
.an-booking-close:hover,
.an-help-head button:hover,
.an-theme-panel-head button:hover{

  background:var(--an-ui-surface-2)!important;

  border-color:var(--an-ui-border)!important;
}


/* ============================================================
   DANGER
   ============================================================ */

.an-btn-danger,

button[data-user-action="deactivate"],

.row-actions
button[onclick^="deleteMasterUserV101263"],

button[data-delete-exception],

button[data-user-admin-action="delete"]{

  background:var(--an-ui-danger)!important;

  color:#fff!important;

  border-color:var(--an-ui-danger)!important;
}


.an-btn-danger:hover,

button[data-user-action="deactivate"]:hover,

.row-actions
button[onclick^="deleteMasterUserV101263"]:hover,

button[data-delete-exception]:hover,

button[data-user-admin-action="delete"]:hover{

  background:var(--an-ui-danger-hover)!important;

  border-color:var(--an-ui-danger-hover)!important;
}


/* ============================================================
   SMALL
   ============================================================ */

.an-btn-sm,

button.compact,
button.compact-btn,

.ap-btn,

.animur-sec-rowactions button{

  min-height:var(--an-ui-btn-height-sm);

  padding:0 12px;

  font-size:13px;
}


/* ============================================================
   ICON BUTTON
   ============================================================ */

.an-btn-icon,

button.icon,

.ap-close,
.animur-sec-close,
.an-booking-close,
.an-help-head button[data-help-close],
.an-theme-panel-head button[data-close],

button[data-delete-exception],
button[data-action="remove-new-pet"]{

  width:40px;
  min-width:40px;
  height:40px;
  min-height:40px;

  padding:0;

  border-radius:10px;
}


/* ============================================================
   DIALOG ACTIONS
   ============================================================ */

.dialog-actions,
.pet-dialog-actions-v101221,
.animur-sec-user-dialog-actions-v10123,
.an-theme-actions{

  gap:10px;
}


.dialog-actions > button,
.pet-dialog-actions-v101221 > button,
.animur-sec-user-dialog-actions-v10123 > button{

  min-width:120px;
}


/*
 * Primary Submit innerhalb einer echten Aktionszone.
 * Kein Text-Matching.
 */

.dialog-actions > button[type="submit"],
.pet-dialog-actions-v101221 > button[type="submit"],
.animur-sec-user-dialog-actions-v10123
  > button[type="submit"]{

  background:var(--an-ui-accent)!important;

  color:var(--an-ui-accent-ink)!important;

  border-color:var(--an-ui-accent)!important;
}


/* ============================================================
   FORM CONTROLS
   ============================================================ */

input:not([type="checkbox"])
     :not([type="radio"])
     :not([type="color"])
     :not([type="file"]),

select,
textarea{
  font:inherit;
}


/*
 * Browser unterstützt die obige verkettete Schreibweise nicht
 * überall zuverlässig, daher die produktive Variante separat.
 */

input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
select,
textarea{

  width:100%;

  min-height:44px;

  padding:10px 12px!important;

  border:
    1px solid var(--an-ui-border)!important;

  border-radius:
    var(--an-ui-radius)!important;

  background:
    var(--an-ui-input)!important;

  color:
    var(--an-ui-text)!important;

  outline:none;

  box-shadow:none;
}


textarea{
  min-height:96px;
  resize:vertical;
}


input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]):focus,
select:focus,
textarea:focus{

  border-color:
    color-mix(
      in srgb,
      var(--an-ui-accent) 60%,
      var(--an-ui-border)
    )!important;

  box-shadow:
    var(--an-ui-focus)!important;
}


/* ============================================================
   FOCUS / ACCESSIBILITY
   ============================================================ */

button:focus-visible,
.an-btn:focus-visible{

  outline:none;

  box-shadow:
    var(--an-ui-focus)!important;
}


button:disabled,
.an-btn:disabled,
button[aria-disabled="true"]{

  opacity:.46!important;

  cursor:not-allowed!important;

  transform:none!important;

  filter:none!important;
}


/* ============================================================
   MASTER ACTIONS
   ============================================================ */

.row-actions{

  display:flex;

  gap:8px;

  flex-wrap:wrap;
}


/* Bearbeiten */

.row-actions
button[onclick^="editMasterUserV101263"]{

  min-height:var(--an-ui-btn-height-sm);

  padding:0 12px;

  border:
    1px solid var(--an-ui-border)!important;

  border-radius:
    var(--an-ui-radius)!important;

  background:
    var(--an-ui-surface-2)!important;

  color:
    var(--an-ui-text)!important;

  font-weight:800;
}


/* ============================================================
   SECURITY
   ============================================================ */

.animur-sec-rowactions button{

  border-radius:var(--an-ui-radius)!important;

  font-weight:800!important;
}


button[data-user-action="activate"]{

  background:
    var(--an-ui-surface-2)!important;

  color:
    var(--an-ui-text)!important;

  border:
    1px solid var(--an-ui-border)!important;
}


/* ============================================================
   PLATFORM ADMIN
   ============================================================ */

.ap-btn{

  border-radius:
    var(--an-ui-radius)!important;

  font-weight:800!important;
}


.ap-close{

  font-size:22px;
}


/* ============================================================
   BOOKING
   ============================================================ */

.booking-alert-actions button{

  border-radius:
    var(--an-ui-radius)!important;

  font-weight:900!important;
}


.an-booking-save,
.an-booking-cancel{

  min-height:46px;
}


/* ============================================================
   CALENDAR TOOLBAR
   ============================================================ */

.an-cal-toolbar button,
.timeline-toolbar-v1096 button{

  border-radius:
    10px!important;

  font-weight:750!important;
}


/*
 * Navigation, Zeit-Slots, Theme-Karten und Toggle-Gruppen
 * bleiben bewusst eigene Komponenten.
 *
 * Sie verwenden dieselben Tokens, werden aber NICHT zu
 * Primary-Aktionsbuttons umgefärbt.
 */


/* ============================================================
   MOBILE
   ============================================================ */

@media(max-width:600px){

  .an-btn,
  button.primary,
  button.secondary,
  button.ghost,

  #new-appt,
  #new-customer,
  #new-pet,
  #new-service,
  #new-resource,

  .dialog-actions > button{

    min-height:46px;
  }


  .dialog-actions,
  .pet-dialog-actions-v101221{

    gap:8px;
  }

}