/* =========================
   Employee Portal — HR parity helpers
   Keep this light so we never fight hrjtek.css
   ========================= */

   
/* Kill Astra block-content clamp on portal pages (prevents right gutter) */
body.hrjtek-portal .entry-content[data-ast-blocks-layout] > * {
  max-width: none !important;
  width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Hide stray empty <p> Gutenberg can insert before our shell */
body.hrjtek-portal .entry-content > p:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* === Employee dashboard-specific bits (HR CSS doesn't define these) === */

/* Header row holding title + check-in/out buttons */
.hrjtek-page-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin:10px 0 12px;
}

/* Two action buttons (neutral; matches HR tone) */
.hrjtek-btn{
  padding:10px 14px; border-radius:10px;
  border:1px solid var(--line); background:#fff; color:var(--ink);
  cursor:pointer;
}
.hrjtek-btn.is-ghost{
  background:transparent;
}

/* Dashboard cards layout for Employee page */
.hrjtek-cards{
  display:grid; gap:14px;
  grid-template-columns: repeat(2, minmax(0,1fr));
}
@media (max-width: 980px){
  .hrjtek-cards{ grid-template-columns: 1fr; }
}

/* 3-column row inside the "Today" card */
.hrjtek-card .body .row3{
  display:grid; gap:12px;
  grid-template-columns: repeat(3, minmax(0,1fr));
}
@media (max-width: 820px){
  .hrjtek-card .body .row3{ grid-template-columns: 1fr; }
}

/* Ensure our main area follows HR’s spacing (no extra padding) */
body.hrjtek-portal .hrjtek-main{
  padding: 0 !important;
}


/* Kill Astra clamp on portal pages */
body.hrjtek-portal .entry-content[data-ast-blocks-layout] > * {
  max-width: none !important; width: 100% !important; margin-left: 0 !important; margin-right: 0 !important;
}

/* Hide stray empty <p> from Gutenberg */
body.hrjtek-portal .entry-content > p:empty { display:none !important; margin:0 !important; padding:0 !important; }

/* ---- Employee dashboard bits (HR look, minimal) ---- */
.hrjtek-page-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin:10px 0 12px; }
.hrjtek-btn{ padding:10px 14px; border-radius:10px; border:1px solid var(--line); background:#fff; color:var(--ink); cursor:pointer; }
.hrjtek-btn.is-ghost{ background:transparent; }

.hrjtek-cards{ display:grid; gap:14px; grid-template-columns: repeat(2, minmax(0,1fr)); }
@media (max-width: 980px){ .hrjtek-cards{ grid-template-columns: 1fr; } }

.hrjtek-card .body .row3{ display:grid; gap:12px; grid-template-columns: repeat(3, minmax(0,1fr)); }
@media (max-width: 820px){ .hrjtek-card .body .row3{ grid-template-columns: 1fr; } }

/* Ensure main matches HR spacing */
body.hrjtek-portal .hrjtek-main{ padding:0 !important; }

/* Attendance actions row */
.hrjtek-attn-actions { display:flex; gap:12px; margin-top:12px; }

/* Base blue button (enabled) — blue bg, white text */
.btn.btn-blue {
  color:#fff;
  background: linear-gradient(90deg, #0b63ce, #0a7dff);
  border: 1px solid #0a7dff;
  box-shadow: 0 4px 10px rgba(11,99,206,.22);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.btn.btn-blue:hover {
  transform: translateY(-1px);
  box-shadow: 0 7px 14px rgba(11,99,206,.28);
}

/* Disabled look — light blue bg, still white text, no hover */
.btn.btn-blue.is-disabled,
.btn.btn-blue[disabled],
.btn.btn-blue[aria-disabled="true"] {
  background: #dbeafe !important;   /* light blue */
  border-color: #bfdbfe !important;  /* lighter border */
  color: #ffffff !important;         /* keep white text as requested */
  box-shadow: none !important;
  transform: none !important;
  cursor: not-allowed !important;
  opacity: 1 !important;             /* no fade */
}

/* Optional: busy pulse (while AJAX running) */
.btn.is-busy {
  position: relative;
}
.btn.is-busy::after{
  content:"";
  position:absolute; inset:0; border-radius:inherit;
  box-shadow: 0 0 0 9999px rgba(255,255,255,.0);
  animation: hrjtekBusy 1s infinite ease-in-out;
}
@keyframes hrjtekBusy {
  0% { box-shadow: 0 0 0 0 rgba(255,255,255,.15); }
  100% { box-shadow: 0 0 0 12px rgba(255,255,255,0); }
}

/* ==== FORCE BLUE BUTTON LOOK (by ID; beats Astra) ==== */
body.hrjtek-portal #hrjtek-emp-checkin,
body.hrjtek-portal #hrjtek-emp-checkout,
body.hrjtek-portal #hrjtek-emp-checkin:hover,
body.hrjtek-portal #hrjtek-emp-checkout:hover,
body.hrjtek-portal #hrjtek-emp-checkin:focus,
body.hrjtek-portal #hrjtek-emp-checkout:focus,
body.hrjtek-portal #hrjtek-emp-checkin:active,
body.hrjtek-portal #hrjtek-emp-checkout:active {
  /* keep gradient no matter what */
  background-image: linear-gradient(90deg, #0b63ce, #0a7dff) !important;
  /* kill Astra's yellow hover fill */
  background-color: transparent !important;
  border-color: #0a7dff !important;
  color: #fff !important;
  text-decoration: none !important;
  -webkit-appearance: none;
  appearance: none;
}

/* Disabled look (light blue) — also beats theme hovers */
body.hrjtek-portal #hrjtek-emp-checkin.is-disabled,
body.hrjtek-portal #hrjtek-emp-checkout.is-disabled,
body.hrjtek-portal #hrjtek-emp-checkin[disabled],
body.hrjtek-portal #hrjtek-emp-checkout[disabled],
body.hrjtek-portal #hrjtek-emp-checkin.is-disabled:hover,
body.hrjtek-portal #hrjtek-emp-checkout.is-disabled:hover,
body.hrjtek-portal #hrjtek-emp-checkin[disabled]:hover,
body.hrjtek-portal #hrjtek-emp-checkout[disabled]:hover {
  background: #dbeafe !important;
  border-color: #bfdbfe !important;
  color: #fff !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: not-allowed !important;
}

/* Optional: neutralize any other generic button hover inside the card row */
body.hrjtek-portal .hrjtek-attn-actions button:hover,
body.hrjtek-portal .hrjtek-attn-actions button:focus {
  background-color: transparent !important;
  color: inherit !important;
}


/* Never blanket-disable both buttons again */
body.hrjtek-portal #hrjtek-emp-attn .hrjtek-btn { pointer-events:auto; }

/* Make enabled button definitely look enabled (override theme) */
body.hrjtek-portal #hrjtek-emp-checkin:not([disabled]):not(.is-disabled),
body.hrjtek-portal #hrjtek-emp-checkout:not([disabled]):not(.is-disabled){
  opacity:1 !important;
  pointer-events:auto !important;
}

/* Keep disabled style the same, but only when actually disabled */
body.hrjtek-portal #hrjtek-emp-checkin[disabled],
body.hrjtek-portal #hrjtek-emp-checkout[disabled],
body.hrjtek-portal #hrjtek-emp-checkin.is-disabled,
body.hrjtek-portal #hrjtek-emp-checkout.is-disabled{
  background:#dbeafe !important;
  border-color:#bfdbfe !important;
  color:#fff !important;
  cursor:not-allowed !important;
}

/* Ensure the row class used in markup behaves (your HTML uses .hrjtek-actions) */
.hrjtek-actions { display:flex; gap:12px; margin-top:12px; }

/* Absolute guarantee: if a button is not disabled, it should behave/appear enabled */
#hrjtek-emp-attn .hrjtek-btn:not([disabled]) {
  opacity: 1 !important;
  pointer-events: auto !important;
  filter: none !important;
}

/* Ensure row class matches your markup */
.hrjtek-actions { display:flex; gap:12px; margin-top:12px; }

/* If a button is logically enabled (no .is-disabled), make sure it acts enabled */
#hrjtek-emp-attn .hrjtek-btn:not(.is-disabled) {
  opacity: 1 !important;
  pointer-events: auto !important;
  filter: none !important;
  cursor: pointer !important;
}

/* If you prefer to *only* rely on classes, you can neutralize theme :disabled looks: */
#hrjtek-emp-attn .hrjtek-btn[disabled]:not(.is-disabled) {
  /* remove unintended disabled visuals if some script flips the attribute */
  opacity: 1 !important;
  pointer-events: auto !important;
  cursor: pointer !important;
}


/* ===== Simple modal for logs ===== */
.hrjtek-modal[hidden] { display: none !important; }

.hrjtek-modal {
  position: fixed; inset: 0; z-index: 100000;
  display: block;
}
.hrjtek-modal-backdrop {
  position: absolute; inset: 0;
  background: rgba(0,0,0,.45);
}
.hrjtek-modal-dialog {
  position: relative; background: #fff; color: var(--ink);
  width: min(92vw, 760px); max-height: 88vh;
  margin: 6vh auto; border-radius: 14px;
  box-shadow: 0 20px 60px rgba(0,0,0,.25);
  display: flex; flex-direction: column;
  padding: 8px 14px 12px;
}
.hrjtek-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 2px 10px; border-bottom: 1px solid var(--line);
}
.hrjtek-modal-body { padding: 10px 0; overflow: auto; }
.hrjtek-modal-close {
  border: 0; background: transparent; font-size: 22px; line-height: 1;
  cursor: pointer; padding: 6px 8px; border-radius: 8px;
}
.hrjtek-modal-close:hover { background: #f3f4f6; }
body.hrjtek-modal-open { overflow: hidden; }


/* ===== Attendance card layout (clean & aligned) ===== */
#hrjtek-emp-attn .kpi-h { margin-bottom: 8px; }

#hrjtek-emp-attn .attn-grid {
  display: grid;
  gap: 16px;
}

/* 2-column on wide screens: clock left, meta right; actions full width */
@media (min-width: 900px) {
  #hrjtek-emp-attn .attn-grid {
    grid-template-columns: 1.6fr 1fr;
    align-items: start;
  }
  #hrjtek-emp-attn .attn-actions { grid-column: 1 / -1; }
}

/* Clock block */
#hrjtek-emp-attn .attn-clock-time {
  font-size: 42px;
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: .3px;
}
#hrjtek-emp-attn .attn-total {
  margin-top: 6px;
  color: var(--muted, #64748b);
  font-weight: 600;
}

/* Small stats (right column) */
#hrjtek-emp-attn .attn-meta {
  display: grid;
  gap: 10px;
}
#hrjtek-emp-attn .attn-meta-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 12px;
  border: 1px solid var(--line, #e5e7eb);
  background: #f8fafc;
  border-radius: 12px;
}
#hrjtek-emp-attn .attn-meta-item .lbl {
  color: var(--muted, #64748b);
  font-weight: 600;
}
#hrjtek-emp-attn .attn-meta-item .val {
  font-weight: 800;
}

/* Actions row */
#hrjtek-emp-attn .attn-actions {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  align-items: center;
}

/* Make the primary blue button look consistent */
.hrjtek-btn.btn-blue {
  color:#fff;
  background: linear-gradient(90deg, #0b63ce, #0a7dff);
  border: 1px solid #0a7dff;
  box-shadow: 0 4px 10px rgba(11,99,206,.22);
  transition: transform .15s ease, box-shadow .15s ease, opacity .15s ease;
}
.hrjtek-btn.btn-blue:hover { transform: translateY(-1px); box-shadow: 0 7px 14px rgba(11,99,206,.28); }

/* Disabled state (keeps white text as you wanted) */
.hrjtek-btn.btn-blue.is-disabled,
.hrjtek-btn.btn-blue[disabled],
.hrjtek-btn.btn-blue[aria-disabled="true"] {
  background: #dbeafe !important;
  border-color: #bfdbfe !important;
  color: #ffffff !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: not-allowed !important;
}

/* Ensure enabled buttons act enabled */
#hrjtek-emp-attn .hrjtek-btn:not([disabled]):not(.is-disabled) {
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Mobile: stack everything 1 column */
@media (max-width: 899.98px) {
  #hrjtek-emp-attn .attn-clock { order: 1; }
  #hrjtek-emp-attn .attn-meta  { order: 2; }
  #hrjtek-emp-attn .attn-actions { order: 3; }
}

@media (max-width: 899.98px){
  #hrjtek-emp-attn .attn-clock { text-align: center; }
}

/* Keep label/value on one line and aligned */
#hrjtek-emp-attn .attn-meta-item {
  display: flex;
  align-items: center;
  gap: 10px;
  /* remove space-between so long values don't get squeezed weirdly */
}

#hrjtek-emp-attn .attn-meta-item .lbl {
  flex: 0 0 auto;           /* label won't shrink */
  color: var(--muted, #64748b);
  font-weight: 600;
}

#hrjtek-emp-attn .attn-meta-item .val {
  margin-left: auto;        /* push value to the right edge */
  flex: 0 1 auto;           /* value can shrink if needed */
  min-width: 0;             /* allow flexbox to actually shrink */
  white-space: nowrap;      /* keep "Not checked in" on one line */
  overflow: hidden;         /* if too long, show ellipsis */
  text-overflow: ellipsis;
  font-weight: 800;
}

/* Optional: make Status look like a neat pill, and turn green when checked in */
#hrjtek-attn-state {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 2px 10px;
  border-radius: 999px;
  background: #f8fafc;
}

#hrjtek-attn-state.is-in {
  background: #ecfdf5;
  color: #065f46;
}

/* ===== 3-column row: Birthdays | Who is Out | Attendance ===== */
#hrjtek-emp-cards.hrjtek-cards-3col {
  display: grid;
  gap: 14px;
  grid-template-columns: 1fr 1fr 1.4fr; /* Attendance a bit wider */
  align-items: start;
}

/* Downshift to 2 columns on medium screens */
@media (max-width: 1200px){
  #hrjtek-emp-cards.hrjtek-cards-3col {
    grid-template-columns: 1fr 1fr;
  }
}

/* Single column on mobile */
@media (max-width: 720px){
  #hrjtek-emp-cards.hrjtek-cards-3col {
    grid-template-columns: 1fr;
  }
}

/* Subheads + empty state + list visuals already used by your plugin */
#hrjtek-emp-cards .subtle { color: var(--muted, #64748b); margin-bottom: 8px; }
#hrjtek-emp-cards .hrjtek-empty { text-align: center; color: #ef4444; font-weight: 600; margin: 18px 0 6px; }
#hrjtek-emp-cards .hrjtek-list { list-style: none; padding: 0; margin: 6px 0 0 0; }
#hrjtek-emp-cards .hrjtek-list li {
  padding: 8px 10px; border: 1px solid var(--line, #e5e7eb); background: #fff; border-radius: 10px;
  display: flex; justify-content: space-between; align-items: center;
}
#hrjtek-emp-cards .hrjtek-list li + li { margin-top: 8px; }


/* Stack two cards on left column, attendance on right (uses your existing 2-col grid) */
#hrjtek-emp-cards { grid-template-columns: 1fr 1fr; }
#hrjtek-emp-cards > .hrjtek-col-left,
#hrjtek-emp-cards > .hrjtek-col-right { display: grid; gap: 14px; align-content: start; }
#hrjtek-emp-cards > .hrjtek-col-right { grid-template-rows: auto; }

/* Make the Leave Calendar span both columns */
.hrjtek-span-2 { grid-column: 1 / -1; }

/* Subheads + empty state + list (reuse tone) */
#hrjtek-emp-cards .subtle { color: var(--muted, #64748b); margin-bottom: 8px; }
#hrjtek-emp-cards .hrjtek-empty { text-align:center; color:#ef4444; font-weight:600; margin:18px 0 6px; }
#hrjtek-emp-cards .hrjtek-list { list-style:none; padding:0; margin:6px 0 0 0; }
#hrjtek-emp-cards .hrjtek-list li {
  padding:8px 10px; border:1px solid var(--line, #e5e7eb); background:#fff; border-radius:10px;
  display:flex; justify-content:space-between; align-items:center;
}
#hrjtek-emp-cards .hrjtek-list li + li { margin-top:8px; }

/* ===== Calendar styles (clean and light) ===== */
.hrjtek-cal { width:100%; overflow-x:auto; }
.hrjtek-cal table { width:100%; border-collapse:collapse; table-layout:fixed; }
.hrjtek-cal thead th { text-align:center; color:var(--muted, #64748b); font-weight:700; background:#f8fafc; padding:10px; }
.hrjtek-cal td { height:86px; padding:10px; vertical-align:top; border:1px solid var(--line, #e5e7eb); background:#fff; }
.hrjtek-cal .date-num { font-weight:700; color:#111827; }
.hrjtek-cal .today { background:#fff7ed; } /* subtle highlight */
.hrjtek-cal .event {
  display:inline-block; margin-top:6px; padding:4px 8px; border-radius:10px;
  font-size:12px; font-weight:600;
  background:#fee2e2; color:#b91c1c;  /* default (rejected/other) */
}
.hrjtek-cal .event.pending  { background:#fef3c7; color:#92400e; }
.hrjtek-cal .event.approved { background:#dcfce7; color:#065f46; }


/* Tabs */
.hrjtek-tabbar{ display:flex; gap:8px; padding:0 6px 10px; border-bottom:1px solid #e5e7eb; }
.hrjtek-tab{
  border:1px solid #e5e7eb; background:#fff; padding:.5rem .75rem; border-radius:10px 10px 0 0;
  cursor:pointer; font-weight:600; color:#000;
}
.hrjtek-tab.is-active{ border-bottom-color:#fff; background:#f8fafc; }
.hrjtek-tabpanes{ padding:12px; }

/* Form controls to match dashboard */
.hrjtek-form .hrjtek-row{ display:grid; gap:6px; margin:10px 0; }
.hrjtek-form input[type="date"],
.hrjtek-form input[type="text"],
.hrjtek-form select,
.hrjtek-form textarea{
  width:100%; padding:.6rem .7rem; border:1px solid #e5e7eb; border-radius:12px;
  background:#fff; font: inherit;
}

/* HR Leaves – make "Work From Home" text white on the green pill */
#hrjtek-hr-leaves-table .hrjtek-pill,
#hrjtek-hr-leaves-table .hrjtek-pill a {
    color: #ffffff !important;
}

#hrjtek-hr-leaves-table .hrjtek-badge {
    color: #ffffff !important;
    font-weight: 600;
}


/* Fix dropdown text visibility */
#hrjtek-leave-screen select {
    color: #111 !important;
    background-color: #fff !important;
}

/* Fix the dropdown options */
#hrjtek-leave-screen select option {
    color: #111 !important;
}
#hrjtek-leave-screen .hrjtek-form select,
#hrjtek-leave-screen .hrjtek-form select * {
    color: #000 !important;
}

/* Fix leave form select alignment */
#hrjtek-leave-screen select {
    padding: 10px 14px !important;  /* equal vertical padding */
    height: 45px !important;        /* fixed height for perfect center */
    line-height: 25px !important;   /* text centers properly */
    color: #111 !important;
    background-color: #fff !important;
    display: flex !important;
    align-items: center !important;
}

/* Option text styling */
#hrjtek-leave-screen select option {
    color: #111 !important;
}

/* Hover effect for tabs */
.hrjtek-tabbar .hrjtek-tab:hover {
    background: #007bff !important;  /* blue */
    color: #fff !important;          /* white text */
    border-color: #007bff !important;
    cursor: pointer;
}

/* Active tab styling (optional stronger blue) */
.hrjtek-tabbar .hrjtek-tab.is-active {
    background: #2563eb !important;  /* bright blue */
    color: #fff !important;
    border-color: #2563eb !important;
}

.hrjtek-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 88px;
  padding: 4px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
}

/* Pending = yellow */
.hrjtek-status.pending {
  background: #facc15;
  color: #111827;
}

/* Approved = green */
.hrjtek-status.approved {
  background: #22c55e;
  color: #ffffff;
}

/* Rejected = red */
.hrjtek-status.rejected {
  background: #ef4444;
  color: #ffffff;
}
/* ---- Leave “My Requests” pager (centered) ---- */
.hrjtek-pager{
  display:flex;
  align-items:center;
  justify-content:center;   /* ✅ centered now */
  gap:12px;
  margin-top:14px;
  font-size:14px;
}

.hrjtek-pager button{
  border:1px solid #d1d5db;
  background:#ffffff;
  border-radius:999px;
  padding:6px 16px;
  font-size:13px;
  cursor:pointer;
}

.hrjtek-pager button:hover:not([disabled]){
  background:#2563eb;
  border-color:#2563eb;
  color:#ffffff;
}

.hrjtek-pager button[disabled]{
  opacity:0.45;
  cursor:default;
}

/* Leave balance table tweaks */
.hrjtek-leave-balance .hrjtek-status {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:60px;
  padding:3px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:600;
}

.hrjtek-status--ok{
  background:#22c55e;
  color:#fff;
}

.hrjtek-status--danger{
  background:#ef4444;
  color:#fff;
}

/* Base pill look for status */
.hrjtek-status {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 90px;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
  text-transform: capitalize;
}

/* Approved = green */
.hrjtek-status--approved {
  background: #dcfce7;
  border: 1px solid #bbf7d0;
  color: #166534;
}

/* Pending = amber */
.hrjtek-status--pending {
  background: #fef9c3;
  border: 1px solid #fde68a;
  color: #92400e;
}

/* Rejected = red */
.hrjtek-status--rejected {
  background: #fee2e2;
  border: 1px solid #fecaca;
  color: #b91c1c;
}


.hrjtek-cal-table {
  width: 100%;
  border-collapse: collapse;
  margin-top: 10px;
}

.hrjtek-cal-table th,
.hrjtek-cal-table td {
  border: 1px solid #e5e7eb;
  width: 14.2%;
  height: 80px;
  vertical-align: top;
  padding: 6px;
  position: relative;
}

.hrjtek-cal-table td .day {
  font-weight: 600;
  margin-bottom: 4px;
}

.dots {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 3px;
}

.dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

/* Holiday calendar highlight */
.hrjtek-holiday-cell {
  background: #fff7ed;              /* light orange */
  border-color: #fed7aa !important;
}

.hrjtek-holiday-list {
  margin: 4px 0 0;
  padding-left: 16px;
  font-size: 11px;
  line-height: 1.3;
}

/* ===== Holiday Types (badges + calendar cells) ===== */

.hrjtek-holiday-tag {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 500;
}

/* Type colors for table badges + calendar cells */
.hrjtek-holiday-tag--national,
.hrjtek-cal-day.hrjtek-holiday--national {
  background: #fee2e2;
  color: #b91c1c;
}

.hrjtek-holiday-tag--office,
.hrjtek-cal-day.hrjtek-holiday--office {
  background: #dbeafe;
  color: #1d4ed8;
}

.hrjtek-holiday-tag--optional,
.hrjtek-cal-day.hrjtek-holiday--optional {
  background: #f3e8ff;
  color: #7e22ce;
}

/* Optional: subtle border hint on calendar cells */
.hrjtek-cal-day.hrjtek-holiday--national { border-color: #fecaca; }
.hrjtek-cal-day.hrjtek-holiday--office   { border-color: #bfdbfe; }
.hrjtek-cal-day.hrjtek-holiday--optional { border-color: #ddd6fe; }

/* ============================
 * Employee Dashboard – My Leave Calendar
 * ============================ */

/* ============================
 * Employee – Leave Calendars
 * (used in /employee-portal and /leave/#calendar)
 * ============================ */

.hrjtek-cal-table {
  width: 100%;
  border-collapse: collapse;
  table-layout: fixed;
}

.hrjtek-cal-table thead th {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 0;
  color: var(--muted, #64748b);
  background: #f8fafc;
}

.hrjtek-cal-table td {
  height: 72px;
  padding: 6px 8px;
  vertical-align: top;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  position: relative;
}

.hrjtek-cal-table td .day {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
}

/* today’s date (both screens) */
.hrjtek-cal-table td.is-today {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  background: #eff6ff;
}

/* any day that has a leave (both screens) */
.hrjtek-cal-table td.has-leave {
  background: #f0f9ff;
}

/* small dots for each leave type */
.hrjtek-cal-table .dots {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.hrjtek-cal-table .dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  display: inline-block;
}

/* optional status styling */
.hrjtek-cal-table .dot.status-approved {
  box-shadow: 0 0 0 2px rgba(34,197,94,.25);
}

.hrjtek-cal-table .dot.status-pending {
  opacity: 0.8;
}

.hrjtek-cal-table .dot.status-rejected,
.hrjtek-cal-table .dot.status-cancelled {
  opacity: 0.4;
}


#hrjtek-leave-card .hrjtek-cal-table thead th {
  text-align: center;
  font-size: 13px;
  font-weight: 600;
  padding: 8px 0;
  color: var(--muted, #64748b);
  background: #f8fafc;
}

#hrjtek-leave-card .hrjtek-cal-table td {
  height: 72px;
  padding: 6px 8px;
  vertical-align: top;
  border: 1px solid #e5e7eb;
  background: #ffffff;
  position: relative;
}

#hrjtek-leave-card .hrjtek-cal-table td .day {
  font-size: 14px;
  font-weight: 600;
  color: #111827;
}

/* today’s date */
#hrjtek-leave-card .hrjtek-cal-table td.is-today {
  outline: 2px solid #2563eb;
  outline-offset: -2px;
  background: #eff6ff;
}

/* any day that has a leave */
#hrjtek-leave-card .hrjtek-cal-table td.has-leave {
  background: #f0f9ff;
}

/* small dots for each leave type */
#hrjtek-leave-card .hrjtek-cal-table .dots {
  margin-top: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

#hrjtek-leave-card .hrjtek-cal-table .dot {
  width: 8px;
  height: 8px;
  border-radius: 999px;
  display: inline-block;
}

/* subtle status variations */
#hrjtek-leave-card .hrjtek-cal-table .dot.status-approved {
  box-shadow: 0 0 0 2px rgba(34,197,94,.25);
}

#hrjtek-leave-card .hrjtek-cal-table .dot.status-pending {
  opacity: 0.8;
}

#hrjtek-leave-card .hrjtek-cal-table .dot.status-rejected,
#hrjtek-leave-card .hrjtek-cal-table .dot.status-cancelled {
  opacity: 0.4;
}
/* text label inside leave calendar cell */
.hrjtek-cal-table .leave-label {
  margin-top: 4px;
  display: inline-block;
  padding: 2px 6px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.3;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  background: #0a50e9 ; /* soft blue */
  color: #fff;        /* blue text */
  font-weight: 500;
}


/* ===== Checkout report modal ===== */
.hrjtek-checkout-dialog {
  width: min(94vw, 820px);
}

.hrjtek-checkout-form {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.hrjtek-form-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
}

@media (max-width: 767px) {
  .hrjtek-form-grid {
    grid-template-columns: 1fr;
  }
}

.hrjtek-form-group {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.hrjtek-form-group label {
  font-weight: 600;
  color: var(--ink);
}

.hrjtek-form-group input[type="text"],
.hrjtek-form-group input[type="file"],
.hrjtek-form-group select,
.hrjtek-form-group textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 10px;
  padding: 10px 12px;
  background: #fff;
  color: var(--ink);
  box-sizing: border-box;
}

.hrjtek-form-group textarea {
  resize: vertical;
  min-height: 96px;
}

.hrjtek-help {
  color: #6b7280;
  font-size: 12px;
}

.hrjtek-form-error {
  background: #fef2f2;
  color: #b91c1c;
  border: 1px solid #fecaca;
  border-radius: 10px;
  padding: 12px 14px;
  font-weight: 700;
  margin-bottom: 14px;
}
.req {
  color: #dc2626;
}

/* Checkout submit disabled state - force visible disabled look */
body.hrjtek-portal #hrjtek-checkout-report-submit,
body.hrjtek-portal #hrjtek-checkout-report-submit:hover,
body.hrjtek-portal #hrjtek-checkout-report-submit:focus,
body.hrjtek-portal #hrjtek-checkout-report-submit:active {
  transition: none !important;
}

body.hrjtek-portal #hrjtek-checkout-report-submit[disabled],
body.hrjtek-portal #hrjtek-checkout-report-submit.is-busy,
body.hrjtek-portal #hrjtek-checkout-report-submit[disabled]:hover,
body.hrjtek-portal #hrjtek-checkout-report-submit.is-busy:hover,
body.hrjtek-portal #hrjtek-checkout-report-submit[disabled]:focus,
body.hrjtek-portal #hrjtek-checkout-report-submit.is-busy:focus,
body.hrjtek-portal #hrjtek-checkout-report-submit[disabled]:active,
body.hrjtek-portal #hrjtek-checkout-report-submit.is-busy:active {
  background: #93c5fd !important;
  background-image: none !important;
  border-color: #93c5fd !important;
  color: #ffffff !important;
  opacity: 1 !important;
  cursor: not-allowed !important;
  pointer-events: none !important;
  box-shadow: none !important;
  transform: none !important;
  filter: grayscale(0.15) !important;
}
/* ===== Daily Work Reports ===== */
.hrjtek-reports-panel {
  margin-top: 12px;
  overflow: visible !important;
}

.hrjtek-reports-head {
  margin-bottom: 14px;
}

.hrjtek-reports-head h2 {
  margin: 0;
  font-size: 28px;
  line-height: 1.2;
  font-weight: 800;
  color: var(--ink, #0f172a);
}

.hrjtek-reports-filters {
  display: flex;
  gap: 12px;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 18px;
  flex-wrap: wrap;
}

.hrjtek-reports-filter-left {
  display: flex;
  gap: 12px;
  flex: 1 1 auto;
  min-width: 0;
}

.hrjtek-reports-filter-right {
  display: flex;
  gap: 10px;
  flex: 0 0 auto;
}

.hrjtek-reports-date {
  width: 100%;
  min-width: 220px;
  height: 48px;
  border: 1px solid var(--line, #e5e7eb);
  border-radius: 12px;
  padding: 10px 14px;
  background: #fff;
  font: inherit;
  color: var(--ink, #111827);
  box-sizing: border-box;
}

#filter-btn {
  min-width: 96px;
  height: 48px;
}

.hrjtek-reports-table-area {
  width: 100%;
  overflow: visible !important;
}

.hrjtek-reports-table-scroll {
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  padding-bottom: 4px;
}

.hrjtek-reports-table {
  min-width: 1180px;
  width: 100%;
  table-layout: fixed;
  border-collapse: collapse;
}

.hrjtek-reports-table th,
.hrjtek-reports-table td {
  vertical-align: middle;
}

.hrjtek-reports-table th {
  font-size: 14px;
  font-weight: 700;
  color: #64748b;
}

.hrjtek-reports-table td {
  padding-top: 18px;
  padding-bottom: 18px;
}

.hrjtek-reports-table tbody tr:hover {
  background: #fafcff;
}

.hrjtek-reports-table th:nth-child(1),
.hrjtek-reports-table td:nth-child(1) {
  width: 130px;
}

.hrjtek-reports-table th:nth-child(2),
.hrjtek-reports-table td:nth-child(2) {
  width: 300px;
}

.hrjtek-reports-table th:nth-child(3),
.hrjtek-reports-table td:nth-child(3),
.hrjtek-reports-table th:nth-child(4),
.hrjtek-reports-table td:nth-child(4) {
  width: 130px;
}

.hrjtek-reports-table th:nth-child(5),
.hrjtek-reports-table td:nth-child(5) {
  width: 300px;
}

.hrjtek-reports-table th:nth-child(6),
.hrjtek-reports-table td:nth-child(6) {
  width: 150px;
}

.hrjtek-reports-table th:nth-child(7),
.hrjtek-reports-table td:nth-child(7) {
  width: 140px;
}

.hrjtek-reports-table th:nth-child(8),
.hrjtek-reports-table td:nth-child(8) {
  width: 130px;
}

.hrjtek-reports-table td:nth-child(7),
.hrjtek-reports-table td:nth-child(8) {
  white-space: nowrap;
}

.hrjtek-report-date,
.hrjtek-report-time {
  display: inline-block;
  white-space: nowrap;
  font-weight: 500;
  color: #0f172a;
}

.hrjtek-report-user {
  display: flex;
  align-items: center;
  gap: 12px;
}

.hrjtek-report-user-avatar {
  width: 42px;
  height: 42px;
  min-width: 42px;
  border-radius: 999px;
  background: #dbeafe;
  color: #1d4ed8;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 16px;
}

.hrjtek-report-user-meta {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}

.hrjtek-report-user-meta strong {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.25;
}

.hrjtek-report-user-meta span {
  color: #64748b;
  font-size: 13px;
  line-height: 1.25;
  word-break: break-word;
}

.hrjtek-report-summary {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.45;
  color: #0f172a;
}

.hrjtek-report-jira {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 600;
  max-width: 150px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.hrjtek-report-download {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 110px;
  padding: 8px 14px;
  border-radius: 12px;
  border: 1px solid #dbeafe;
  background: #f8fbff;
  color: #2563eb;
  font-weight: 700;
  text-decoration: none;
  white-space: nowrap;
}

.hrjtek-report-download:hover {
  background: #eff6ff;
}

.view-btn {
  min-width: 100px;
  justify-content: center;
  font-weight: 700;
  white-space: nowrap;
}

.hrjtek-reports-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  margin-top: 16px;
  flex-wrap: wrap;
}

.hrjtek-reports-summary {
  color: #64748b;
  font-size: 15px;
  font-weight: 500;
}

.hrjtek-reports-pagination {
  display: flex;
  align-items: center;
  gap: 10px;
}

.hrjtek-reports-pagination .hrjtek-btn {
  min-width: 90px;
  justify-content: center;
}

.hrjtek-reports-pagebox {
  min-width: 44px;
  height: 44px;
  border-radius: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: #2563eb;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  padding: 0 10px;
}

.hrjtek-report-view-dialog {
  width: min(92vw, 760px);
}

.hrjtek-report-view-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0,1fr));
  gap: 14px;
  margin-bottom: 14px;
}

.hrjtek-report-view-grid p {
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.hrjtek-report-view-grid strong {
  display: block;
  color: #334155;
  font-size: 14px;
}

.hrjtek-report-view-grid span {
  color: #0f172a;
  font-size: 15px;
  line-height: 1.5;
}

.hrjtek-report-view-block {
  margin-top: 12px;
}

.hrjtek-report-view-label {
  margin-bottom: 8px;
}

.hrjtek-report-view-box {
  border: 1px solid var(--line, #e5e7eb);
  background: #f8fafc;
  border-radius: 12px;
  padding: 12px;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.6;
  color: #0f172a;
}

@media (max-width: 767px) {
  .hrjtek-reports-filter-left {
    flex-direction: column;
    width: 100%;
  }

  .hrjtek-reports-filter-right {
    width: 100%;
  }

  .hrjtek-reports-filter-right .hrjtek-btn {
    width: 100%;
  }

  .hrjtek-report-view-grid {
    grid-template-columns: 1fr;
  }
}
.hrjtek-main,
.hrjtek-panel,
.hrjtek-shell,
.hrjtek-reports-panel,
.hrjtek-reports-table-area {
  min-width: 0;
}

/* Team Lead Announcements */
.hrjtek-ann-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hrjtek-ann-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

.hrjtek-ann-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.hrjtek-ann-head h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.hrjtek-ann-date {
  font-size: 13px;
  color: #64748b;
  white-space: nowrap;
}

.hrjtek-ann-body {
  color: #334155;
  line-height: 1.7;
}

.hrjtek-empty-state {
  padding: 28px 20px;
  text-align: center;
  color: #64748b;
}
/* Team Lead Announcements */
.hrjtek-ann-list {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.hrjtek-ann-card {
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 16px;
  padding: 18px 20px;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.04);
}

.hrjtek-ann-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 10px;
  flex-wrap: wrap;
}

.hrjtek-ann-head h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #0f172a;
}

.hrjtek-ann-date {
  font-size: 13px;
  color: #64748b;
  white-space: nowrap;
}

.hrjtek-ann-body {
  color: #334155;
  line-height: 1.7;
}

.hrjtek-ann-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.hrjtek-ann-tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 10px;
  border-radius: 999px;
  background: #eff6ff;
  border: 1px solid #bfdbfe;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 600;
}

.hrjtek-empty-state {
  padding: 28px 20px;
  text-align: center;
  color: #64748b;
}

.hrjtek-auto-checkout-notice {
  margin-top: 18px;
  padding: 16px 18px;
  border-radius: 18px;
  background: linear-gradient(137deg, rgba(12,61,244,.08) 0%, rgba(2,180,254,.12) 100%);
  border: 1px solid rgba(12,61,244,.18);
  box-shadow: 0 12px 28px rgba(15,23,42,.08);
}

.hrjtek-auto-checkout-notice strong {
  display: block;
  color: #0f172a;
  font-size: 15px;
  margin-bottom: 6px;
}

.hrjtek-auto-checkout-notice p {
  margin: 0 0 12px;
  color: #475569;
  line-height: 1.5;
}
.hrjtek-form-full {
  grid-column: 1 / -1;
}

.hrjtek-report-project {
  display: inline-flex;
  align-items: center;
  padding: 7px 12px;
  border-radius: 999px;
  background: #eef5ff;
  color: #0C3DF4;
  font-weight: 700;
  font-size: 13px;
  border: 1px solid #cfe0ff;
  white-space: nowrap;
}
.hrjtek-reports-table th:last-child,
.hrjtek-reports-table td:last-child {
  min-width: 120px;
  width: 120px;
  white-space: nowrap;
  text-align: left;
}
/* My Attendance equal height + clean action layout */
#hrjtek-shared-attendance-wrap,
#hrjtek-shared-attendance-wrap .hrjtek-card {
  height: 100%;
}

#hrjtek-emp-attn {
  min-height: 250px;
  display: flex;
  flex-direction: column;
}

#hrjtek-emp-attn .attn-grid {
  flex: 1;
  align-items: stretch;
}

#hrjtek-emp-attn .attn-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-top: 16px;
}

#hrjtek-emp-attn .attn-actions .hrjtek-btn,
#hrjtek-emp-attn .attn-actions .hrjtek-chip {
  height: 48px;
  min-width: 145px;
  padding: 0 18px;
  border-radius: 14px;
  font-size: 16px;
  font-weight: 800;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  white-space: nowrap;
}

#hrjtek-lunch-note {
  width: 100%;
  order: 20;
  margin-top: 2px !important;
  padding: 10px 14px;
  border-radius: 12px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-size: 13px !important;
  font-weight: 700;
}

#hrjtek-attn-logs {
    order: 5;
}

/* Make attendance card match Who is Out height on employee dashboard */
.employee-dashboard #hrjtek-shared-attendance-wrap,
.hrjtek-portal #hrjtek-shared-attendance-wrap {
  min-height: 255px;
}

#hrjtek-emp-attn .attn-actions {
  display: flex;
  flex-wrap: wrap;
 
  gap: 12px;
  margin-top: 18px;
}

#hrjtek-emp-attn .attn-actions .hrjtek-btn,
#hrjtek-emp-attn .attn-actions .hrjtek-chip {
  min-width: 170px;
  height: 48px;
  padding: 0 18px;
  border-radius: 14px;
  font-size: 15px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: all .2s ease;
}

/* logs button smaller */
#hrjtek-attn-logs {
  min-width: 220px;
  background: #fff;
  border: 1px solid #dbe4ff;
  color: #0f172a;
  box-shadow: none;
  margin-left: auto;
  margin-right: auto;
  min-width: 220px;
}

/* lunch message */
#hrjtek-lunch-note {
  order: 3;
  width: 100%;
  padding: 14px 16px;
  border-radius: 14px;
  background: #fff7ed;
  border: 1px solid #fed7aa;
  color: #9a3412;
  font-size: 13px !important;
  font-weight: 700;
  text-align: left;
}


/* disabled buttons softer */
#hrjtek-emp-attn .hrjtek-btn.is-disabled,
#hrjtek-emp-attn .hrjtek-btn:disabled {
  opacity: .55;
  box-shadow: none;
}

/* active resume button */
#hrjtek-emp-resume-work {
  order: 4;
  box-shadow: 0 6px 18px rgba(12, 61, 244, 0.18);
}

#hrjtek-emp-attn .attn-actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 14px;
  margin-top: 18px;
  align-items: center;
}

#hrjtek-emp-checkin {
  grid-column: 1;
  grid-row: 1;
}

#hrjtek-emp-checkout {
  grid-column: 2;
  grid-row: 1;
}

#hrjtek-lunch-note {
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  margin-top: 0 !important;
}

#hrjtek-emp-resume-work {
  grid-column: 1;
  grid-row: 3;
}

#hrjtek-attn-logs {
  grid-column: 2;
  grid-row: 3;
  justify-self: center;
}

#hrjtek-emp-start-lunch {
  grid-column: 3;
  grid-row: 1;
}

.hrjtek-native-project-select {
  display: none !important;
}

.hrjtek-project-picker {
  position: relative;
  width: 100%;
}

.hrjtek-project-picker-toggle {
  width: 100%; 
  border: 1px solid #dbe3ef;  
  background: #fff;
  min-height: 50px !important;
    height: 50px !important;
    padding: 0 14px 0 18px !important;
    border-radius: 12px !important;    
    display: flex;
    align-items: center !important;
    justify-content: space-between;
  font-size: 15px;
  font-weight: 600;
  color: #111827;
  cursor: pointer;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.04);
}
#hrjtek-work-date {
    height: 50px !important;
    min-height: 50px !important;
}
.hrjtek-project-picker-toggle:hover,
.hrjtek-project-picker.is-open .hrjtek-project-picker-toggle {
  border-color: #0c7ff4;
  box-shadow: 0 0 0 3px rgba(12, 127, 244, 0.10);
}

.hrjtek-project-picker-label {
  color: #374151;
}

.hrjtek-project-picker-arrow{
    width:38px;
    height:38px;
    background:#eef4fb;
    border-radius:50%;

    display:flex;
    align-items:center;
    justify-content:center;
}
.hrjtek-project-picker-arrow .dashicons{
    width:16px;
    height:16px;
    font-size:16px;
    line-height:16px;

    display:flex;
    align-items:center;
    justify-content:center;

    color:#64748b;
    transition:all .25s ease;
}

.hrjtek-project-picker.is-open .dashicons{
    transform:rotate(180deg);
    color:#0C7FF4;
}


.hrjtek-project-picker-arrow-icon{
    display:flex;
    align-items:center;
    justify-content:center;

    width:100%;
    height:100%;

    font-size:18px;
    font-weight:700;
    color:#64748b;
    line-height:1;
    transform:translateY(-1px);
}
.hrjtek-project-picker.is-open .hrjtek-project-picker-arrow-icon{
    transform:translateY(-1px) rotate(180deg);
    color:#0C7FF4;
}


.hrjtek-project-picker-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  right: 0;
  z-index: 9999;
  background: #fff;
  border: 1px solid #dbe3ef;
  border-radius: 14px;
  padding: 8px;
  max-height: 220px;
  overflow-y: auto;
  box-shadow: 0 18px 45px rgba(15, 23, 42, 0.16);
}

.hrjtek-project-picker.is-open .hrjtek-project-picker-menu {
  display: block;
}

.hrjtek-project-option {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-radius: 10px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 600;
  color: #1f2937;
}

.hrjtek-project-option:hover {
  background: #f1f7ff;
}

.hrjtek-project-option input {
  display: none;
}

.hrjtek-project-check {
  width: 18px;
  height: 18px;
  border: 2px solid #cbd5e1;
  border-radius: 5px;
  display: inline-block;
  position: relative;
  flex-shrink: 0;
}

.hrjtek-project-option input:checked + .hrjtek-project-check {
  background: linear-gradient(137deg, #0C3DF4 0%, #02B4FE 100%);
  border-color: #0C7FF4;
}

.hrjtek-project-option input:checked + .hrjtek-project-check::after {
  content: "✓";
  position: absolute;
  left: 3px;
  top: -3px;
  color: #fff;
  font-size: 14px;
  font-weight: 800;
}

.hrjtek-project-picker-chips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
  margin-top: 8px !important;

}

.hrjtek-project-chip {
  background: #eef6ff;
  color: #0757d8;
  border: 1px solid #cfe4ff;
  border-radius: 999px;
  padding: 5px 10px;
  font-size: 12px;
  font-weight: 700;
}

/* Project Multi Select Override */
.hrjtek-project-picker-toggle,
.hrjtek-project-picker-toggle:hover,
.hrjtek-project-picker-toggle:focus,
.hrjtek-project-picker-toggle:active {
    background: #fff !important;
    color: #374151 !important;
    border: 1px solid #0C7FF4 !important;
    box-shadow: 0 0 0 3px rgba(12,127,244,.12) !important;
    outline: none !important;
}

.hrjtek-report-icon-btn{
  width: 44px;
  height: 44px;
  min-width: 44px;
  border-radius: 14px;
  border: 1px solid #dbeafe;
  background: #ffffff;
  color: #2563eb;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
  box-shadow: 0 6px 14px rgba(15,23,42,.06);
  cursor: pointer;
  transition: all .2s ease;
}

.hrjtek-report-icon-btn .dashicons{
  width: 18px;
  height: 18px;
  font-size: 18px;
  line-height: 18px;
}

.hrjtek-report-icon-btn:hover{
  background: #2563eb;
  border-color: #2563eb;
  color: #ffffff;
  transform: translateY(-1px);
  box-shadow: 0 10px 22px rgba(37,99,235,.18);
}

.hrjtek-report-icon-btn:hover .dashicons:before{
  color: #ffffff;
}

.view-btn{
  padding: 0;
  font-weight: 700;
}

.hrjtek-report-action-head{
  text-align:center;
}

.hrjtek-report-actions{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  white-space:nowrap;
}

.hrjtek-report-icon-btn{
  width:42px;
  height:42px;
  min-width:42px;
  padding:0;
  border-radius:14px;
  border:1px solid #dbeafe;
  background:#ffffff;
  color:#2563eb;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-decoration:none;
  box-shadow:0 6px 14px rgba(15,23,42,.06);
  cursor:pointer;
  transition:all .2s ease;
}

.hrjtek-report-icon-btn .dashicons{
  width:18px;
  height:18px;
  font-size:18px;
  line-height:18px;
}

.hrjtek-report-icon-btn:hover{
  background:#2563eb;
  border-color:#2563eb;
  color:#ffffff;
  transform:translateY(-1px);
  box-shadow:0 10px 22px rgba(37,99,235,.18);
}

.hrjtek-report-icon-btn:hover .dashicons:before{
  color:#ffffff;
}

.view-btn{
  padding:0;
}
.hrjtek-reports-filter-right #filter-btn{
  height:46px !important;
  min-height:46px !important;
  padding:0 18px !important;
  border-radius:12px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  font-size:15px !important;
  line-height:1 !important;
  font-weight:700 !important;
  text-decoration:none !important;
  white-space:nowrap !important;
  background:linear-gradient(137deg,#0C3DF4 0%,#02B4FE 100%) !important;
  color:#fff !important;
  border:none !important;
  box-shadow:0 8px 18px rgba(12,61,244,.16) !important;
}

.hrjtek-reports-filter-right #filter-btn:hover,
.hrjtek-reports-filter-right #filter-btn:focus{
  background:linear-gradient(137deg,#0A32CC 0%,#0295D9 100%) !important;
  color:#fff !important;
}

.hrjtek-reports-filter-right #filter-btn .dashicons{
  width:17px !important;
  height:17px !important;
  font-size:17px !important;
  line-height:17px !important;
  margin:0 !important;
}