/* =============================================================================
   Zimozo z-* component library
   -----------------------------------------------------------------------------
   Several modules (HRM/Essentials, Sales Commission, CRM) were redesigned to use
   z-* component classes, but those classes were only ever implemented inside
   accounting2-odoo.css, which loads on Accounting pages alone. Everywhere else
   the markup rendered completely unstyled - stat cards became stacked text and
   badges became plain words.

   This file implements the component set globally, on the same design tokens and
   with the same visual language as the accounting2 implementation, so nothing
   changes on pages that already looked correct.

   NOTE: `z-10`, `z-20`, `z-50` are Tailwind z-index utilities, not part of this
   system. They are deliberately NOT defined here.
   ========================================================================== */

:root {
  --z-primary:      var(--zmz-primary, #059669);
  --z-info:         #0284c7;
  --z-success:      #16a34a;
  --z-warning:      #d97706;
  --z-danger:       #dc2626;
  --z-text-strong:  var(--zmz-text, #111827);
  --z-text-muted:   var(--zmz-text-muted, #6b7280);
  --z-border-light: var(--zmz-border, #e5e7eb);
  --z-bg-subtle:    var(--zmz-border-soft, #f9fafb);
  --z-surface:      #ffffff;
  --z-radius:       12px;
  --z-radius-sm:    8px;
  --z-shadow:       0 1px 2px rgba(0,0,0,.05);
  --z-shadow-hover: 0 4px 6px rgba(0,0,0,.06);
}

/* ============================ layout ============================ */
.z-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-bottom:18px;}
.z-stat-grid--2{grid-template-columns:repeat(auto-fit,minmax(260px,1fr));}
.z-stat-grid--3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));}
.z-stat-grid--4{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
@media (max-width:640px){
  .z-stat-grid,.z-stat-grid--2,.z-stat-grid--3,.z-stat-grid--4{grid-template-columns:1fr;}
}
.z-divider{height:1px;background:var(--z-border-light);border:0;margin:16px 0;}

/* ============================ page header ============================ */
.z-page-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;
  gap:12px;margin-bottom:18px;}
.z-page-header__title,.z-page-title{font-size:20px;font-weight:600;color:var(--z-text-strong);margin:0;line-height:1.3;}
.z-page-header__title small,.z-page-title small{font-size:13px;font-weight:400;color:var(--z-text-muted);margin-left:6px;}
.z-page-header__actions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;}
.z-page-subtitle{font-size:13.5px;color:var(--z-text-muted);margin:2px 0 0;}

/* ============================ stat tile ============================ */
.z-card-stat{background:var(--z-surface);border:1px solid var(--z-border-light);border-radius:var(--z-radius);
  box-shadow:var(--z-shadow);padding:16px;transition:box-shadow .15s ease,transform .15s ease;}
.z-card-stat:hover{box-shadow:var(--z-shadow-hover);transform:translateY(-1px);}
.z-card-stat--inline{display:flex;align-items:center;gap:14px;}
.z-card-stat__header{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;margin-bottom:8px;}
.z-card-stat__info{min-width:0;}
.z-card-stat__title{color:var(--z-text-muted);font-size:12px;margin:0 0 2px;font-weight:500;}
.z-card-stat__value{font-size:22px;font-weight:600;color:var(--z-text-strong);line-height:1.2;
  font-variant-numeric:tabular-nums;}
.z-card-stat__unit{font-size:13px;font-weight:500;color:var(--z-text-muted);}
.z-card-stat__meta{margin-top:8px;display:flex;flex-wrap:wrap;gap:6px;align-items:center;}
.z-card-stat__footer{margin-top:6px;font-size:12px;color:var(--z-text-muted);}
.z-card-stat__footer a{color:var(--z-primary);text-decoration:none;}
.z-card-stat__footer a:hover{text-decoration:underline;}
.z-card-stat__footer i{margin-left:3px;font-size:11px;}
.z-card-stat__icon{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;
  border-radius:10px;font-size:17px;flex-shrink:0;background:var(--z-bg-subtle);color:var(--z-text-muted);}
.z-card-stat__icon--primary{background:#d1fae5;color:var(--z-primary);}
.z-card-stat__icon--info{background:#e0f2fe;color:var(--z-info);}
.z-card-stat__icon--success{background:#dcfce7;color:var(--z-success);}
.z-card-stat__icon--warning{background:#fef3c7;color:var(--z-warning);}
.z-card-stat__icon--danger{background:#fee2e2;color:var(--z-danger);}

/* ============================ card ============================ */
.z-card{background:var(--z-surface);border:1px solid var(--z-border-light);border-radius:var(--z-radius);
  box-shadow:var(--z-shadow);margin-bottom:18px;}
.z-card__header{padding:12px 16px;border-bottom:1px solid var(--z-border-light);font-weight:600;
  font-size:14px;color:var(--z-text-strong);display:flex;align-items:center;justify-content:space-between;gap:10px;}
.z-card__header-inner{display:flex;align-items:center;gap:10px;flex-wrap:wrap;}
.z-card__title{font-weight:600;font-size:14px;margin:0;color:var(--z-text-strong);}
.z-card__title--lg{font-size:16px;}
.z-card__body{padding:16px;}

/* ============================ table card ============================ */
.z-table-card{background:var(--z-surface);border:1px solid var(--z-border-light);border-radius:var(--z-radius);
  box-shadow:var(--z-shadow);margin-bottom:18px;overflow:hidden;}
.z-table-card__header{padding:12px 16px;border-bottom:1px solid var(--z-border-light);
  display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.z-table-card__title{font-weight:600;font-size:14px;margin:0;color:var(--z-text-strong);}
.z-table-card__body{padding:0;overflow-x:auto;}
.z-table-card table{margin-bottom:0;width:100%;}
.z-table-card thead th{background:var(--z-bg-subtle);color:var(--z-text-muted);font-size:11px;
  text-transform:uppercase;letter-spacing:.04em;font-weight:600;padding:10px 12px;border-bottom:1px solid var(--z-border-light);}
.z-table-card tbody td{padding:10px 12px;border-top:1px solid var(--z-border-light);vertical-align:middle;}
.z-table{width:100%;margin-bottom:0;}
.z-table thead th{background:var(--z-bg-subtle);color:var(--z-text-muted);font-size:11px;
  text-transform:uppercase;letter-spacing:.04em;font-weight:600;padding:10px 12px;}
.z-table tbody td{padding:10px 12px;border-top:1px solid var(--z-border-light);vertical-align:middle;}

/* ============================ badge ============================ */
.z-badge{display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;
  font-size:11.5px;font-weight:600;line-height:1.7;white-space:nowrap;
  background:var(--z-bg-subtle);color:var(--z-text-muted);}
.z-badge--primary{background:#d1fae5;color:#047857;}
.z-badge--success{background:#dcfce7;color:#15803d;}
.z-badge--info   {background:#e0f2fe;color:#0369a1;}
.z-badge--warning{background:#fef3c7;color:#b45309;}
.z-badge--danger {background:#fee2e2;color:#b91c1c;}
.z-badge--neutral{background:var(--z-bg-subtle);color:var(--z-text-muted);}

/* ============================ buttons ============================ */
.z-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;
  padding:8px 15px;font-size:13.5px;font-weight:500;line-height:1.4;border-radius:var(--z-radius-sm);
  border:1px solid var(--z-border-light);background:var(--z-surface);color:var(--z-text-strong);
  cursor:pointer;text-decoration:none;transition:background .15s ease,border-color .15s ease,box-shadow .15s ease;}
.z-btn:hover{background:var(--z-bg-subtle);color:var(--z-text-strong);text-decoration:none;}
.z-btn:focus-visible{outline:2px solid var(--z-primary);outline-offset:2px;}
.z-btn:disabled,.z-btn.disabled{opacity:.55;cursor:not-allowed;}
.z-btn-xs{padding:3px 9px;font-size:11.5px;border-radius:6px;}
.z-btn-sm{padding:5px 11px;font-size:12.5px;}
.z-btn-lg{padding:11px 20px;font-size:15px;}
.z-btn-primary{background:var(--z-primary);border-color:var(--z-primary);color:#fff;}
.z-btn-primary:hover{filter:brightness(.94);color:#fff;}
.z-btn-secondary,.z-btn-default{background:var(--z-surface);border-color:var(--z-border-light);color:var(--z-text-strong);}
.z-btn-secondary:hover,.z-btn-default:hover{background:var(--z-bg-subtle);}
.z-btn-info{background:var(--z-info);border-color:var(--z-info);color:#fff;}
.z-btn-success{background:var(--z-success);border-color:var(--z-success);color:#fff;}
.z-btn-warning{background:var(--z-warning);border-color:var(--z-warning);color:#fff;}
.z-btn-danger{background:var(--z-danger);border-color:var(--z-danger);color:#fff;}
.z-btn-info:hover,.z-btn-success:hover,.z-btn-warning:hover,.z-btn-danger:hover{filter:brightness(.94);color:#fff;}
.z-btn-outline-primary{background:transparent;border-color:var(--z-primary);color:var(--z-primary);}
.z-btn-outline-primary:hover{background:var(--z-primary);color:#fff;}
.z-btn-outline-warning{background:transparent;border-color:var(--z-warning);color:var(--z-warning);}
.z-btn-outline-warning:hover{background:var(--z-warning);color:#fff;}

/* ============================ forms ============================ */
.z-form-group{margin-bottom:14px;display:flex;flex-direction:column;gap:5px;}
.z-label{font-size:12.5px;font-weight:600;color:var(--z-text-strong);margin:0;}
.z-input{width:100%;padding:8px 12px;font-size:14px;line-height:1.45;color:var(--z-text-strong);
  background:var(--z-surface);border:1px solid var(--z-border-light);border-radius:var(--z-radius-sm);}
.z-input:focus{outline:none;border-color:var(--z-primary);box-shadow:0 0 0 3px rgba(5,150,105,.12);}
.z-form-hint{font-size:12px;color:var(--z-text-muted);}
.z-filter-bar{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px;padding:14px 16px;
  background:var(--z-surface);border:1px solid var(--z-border-light);border-radius:var(--z-radius);margin-bottom:16px;}

/* ============================ tabs ============================ */
.z-tabs{display:flex;flex-wrap:wrap;gap:4px;border-bottom:1px solid var(--z-border-light);margin-bottom:16px;}
.z-tabs__item{padding:9px 15px;font-size:13.5px;font-weight:500;color:var(--z-text-muted);
  text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px;}
.z-tabs__item:hover{color:var(--z-text-strong);text-decoration:none;}
.z-tabs__item.active,.z-tabs__item[aria-selected="true"]{color:var(--z-primary);border-bottom-color:var(--z-primary);}

/* ============================ progress ============================ */
.z-progress{height:7px;background:var(--z-bg-subtle);border-radius:999px;overflow:hidden;width:100%;}
.z-progress__bar{height:100%;border-radius:999px;background:var(--z-primary);transition:width .3s ease;}
.z-progress__bar--info{background:var(--z-info);}
.z-progress__bar--success{background:var(--z-success);}
.z-progress__bar--warning{background:var(--z-warning);}
.z-progress__bar--danger{background:var(--z-danger);}

/* ============================ list / empty ============================ */
.z-list__item{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:11px 0;border-bottom:1px solid var(--z-border-light);}
.z-list__item:last-child{border-bottom:0;}
.z-empty-state{text-align:center;padding:34px 18px;color:var(--z-text-muted);}
.z-empty-state__icon{font-size:34px;opacity:.35;margin-bottom:10px;display:block;}
.z-empty-state__title{font-size:15px;font-weight:600;color:var(--z-text-strong);margin-bottom:4px;}
.z-empty-state__text{font-size:13.5px;color:var(--z-text-muted);margin:0;}
.z-pagination-wrap{display:flex;justify-content:flex-end;padding:12px 16px;}
.z-text-muted{color:var(--z-text-muted)!important;}

/* ============================ dark mode ============================ */
@media (prefers-color-scheme:dark){
  body.zmz-dark{
    --z-surface:#1b2027;--z-bg-subtle:#232932;--z-border-light:#2f3742;
    --z-text-strong:#e8ecf1;--z-text-muted:#9aa4b2;
  }
}

/* ============================ print ============================ */
@media print{
  .z-card,.z-card-stat,.z-table-card{box-shadow:none;border-color:#ccc;}
  .z-btn,.z-page-header__actions{display:none!important;}
}
