@font-face {
  font-family: 'IBM Plex Sans';
  src: url('/wp-content/plugins/pd-lms/assets/fonts/IBMPlexSans-Regular.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('/wp-content/plugins/pd-lms/assets/fonts/IBMPlexSans-Medium.ttf') format('truetype');
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: 'IBM Plex Sans';
  src: url('/wp-content/plugins/pd-lms/assets/fonts/IBMPlexSans-SemiBold.ttf') format('truetype');
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

.cts-wrapper {
  border:1px solid #dce3ed;
  padding:18px;
  background:#fff;
  font-family:'IBM Plex Sans','IBM Plex Sans Condensed','Inter',system-ui,-apple-system,sans-serif;
  color:#1f2937;
  border-radius:10px;
  box-shadow:0 8px 30px rgba(15,23,42,0.08);
}

.cts-header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.cts-heading h3 { display:none; }
.cts-subtitle { margin:0; color:#475569; font-size:13px; }
.cts-project-meta { display:flex; gap:14px; align-items:flex-end; width:100%; flex-wrap:wrap; }
.cts-project-meta.is-hidden { display:none; }
.cts-project-meta.is-hidden { display:none; }
.cts-project-fields { display:flex; gap:12px; flex:0 0 81%; flex-wrap:wrap; align-items:flex-end; }
.cts-project-meta label { font-weight:600; display:flex; flex-direction:column; gap:6px; font-size:13px; color:#0f172a; margin:0; }
.cts-project-meta input { min-width:220px; padding:10px; border:1px solid #cbd5e1; border-radius:6px; font-size:14px; }
.cts-load-label { width:27%; min-width:220px; font-weight:600; font-size:13px; color:#0f172a; display:flex; flex-direction:column; gap:6px; margin:0; }
.cts-project-fields label { flex:0 0 27%; min-width:200px; }
.cts-project-fields select { min-width:200px; padding:10px; border:1px solid #cbd5e1; border-radius:6px; font-size:14px; width:100%; }
.cts-project-buttons { display:flex; gap:8px; flex-wrap:nowrap; align-items:center; }
.cts-project-reveal { border:1px dashed #cbd5e1; border-radius:8px; padding:10px 12px; background:#f8fafc; display:grid; gap:6px; width:100%; }
.cts-project-reveal.is-hidden { display:none; }
.cts-project-reveal button { width:fit-content; }
.cts-project-reveal-note { margin:0; font-size:12px; color:#475569; }

.cts-wrapper .button,
.cts-wrapper .button:visited {
  background:#f4f7fb;
  border:1px solid #d4deeb;
  color:#0f172a;
  padding:8px 14px;
  border-radius:6px;
  font-weight:600;
  box-shadow:none;
  height:auto;
}
.cts-wrapper .button.button-primary {
  background:linear-gradient(135deg, #2563eb, #0ea5e9);
  border-color:#1d4ed8;
  color:#fff;
}
.cts-wrapper .button:hover { filter:brightness(0.97); }

#cts-new-project {
  background:#2957cb;
  color:#fff;
  border-color:#2957cb;
}

#cts-new-project:hover {
  background:#1b3fa1;
  border-color:#1b3fa1;
}

#cts-save-project {
  background:#2957cb;
  color:#fff;
  border-color:#2957cb;
}

#cts-save-project:hover {
  background:#1b3fa1;
  border-color:#1b3fa1;
}

#cts-delete-project { background:#2957cb; color:#fff; border-color:#2957cb; align-self:flex-start; }
#cts-delete-project:hover { background:#C15959; border-color:#fff; color:#fff;  }
.cts-project-actions { align-items:flex-start; }
.cts-export .button { background:#2957cb; color:#fff; border-color:#2957cb; }
.cts-export .button:hover { background:#1b3fa1; border-color:#1b3fa1; color:#fff; }

#cts-new-project:hover,
#cts-save-project:hover,
.cts-export .button:hover {
  filter:none;
}
.cts-controls { margin:14px 0 4px; display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:14px; }
.cts-controls label { font-weight:600; font-size:13px; color:#0f172a; display:flex; flex-direction:column; gap:6px; }
.cts-controls input { padding:10px; border:1px solid #cbd5e1; border-radius:6px; font-size:14px; }

.cts-table-wrap { margin-top:8px; overflow-x:auto; }
.cts-table { width:100%; min-width:1100px; border-collapse:separate; border-spacing:0; }
.cts-table th, .cts-table td { border:1px solid #e5e7eb; padding:8px 10px; text-align:left; font-size:13px; vertical-align:middle; }
.cts-table th { background:#EAEEFA; color:#0f172a; letter-spacing:0.05em; text-transform:uppercase; font-size:12px; }
.cts-table tbody tr:nth-child(even) { background:#f9fbff; }
.cts-table input, .cts-table select { width:100%; padding:8px; border:1px solid #cbd5e1; border-radius:6px; font-size:13px; font-family:'IBM Plex Sans','IBM Plex Sans Condensed','Inter',system-ui,-apple-system,sans-serif; }
.cts-col-ref input, .cts-col-desc input { font-size:13px; }
.cts-col-sku { min-width:300px; width:30%; }
.cts-col-qty { width:90px; min-width:90px; text-align:center; }
.cts-table .cts-qty { text-align:center; max-width:120px; }
.cts-col-ref { min-width:120px; max-width:150px; }
.cts-col-desc { min-width:230px; }
.cts-col-fixed10 { min-width:70px; }
.cts-col-narrow { width:86px; min-width:86px; }
.cts-col-fixed10 { text-align:center; }
.cts-col-fixed10 { vertical-align:top; }
.cts-col-fixed10 .button-link-delete { padding:6px 10px; font-size:14px; background:#2957cb; color:#fff; border:1px solid #2957cb; border-radius:6px; }
.cts-col-qty input { text-align:center; }
.cts-col-ref input { max-width:160px; }
.cts-col-desc input { min-width:240px; }
.cts-table .cts-qty { text-align:center; }
.cts-summary td { font-weight:700; background:#f1f5f9; }

.cts-locked-note {
  position:absolute;
  inset:0;
  background:rgba(255,255,255,0.9);
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:24px;
  border-radius:10px;
  border:1px dashed #94a3b8;
  backdrop-filter: blur(2px);
}

.cts-locked-note .cts-locked-inner { max-width:560px; display:grid; gap:8px; }
.cts-locked-note h3 { margin:0; font-size:20px; }
.cts-locked-note p { margin:0; color:#475569; }
.cts-locked-note .cts-locked-actions { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:6px; }

.cts-wrapper.is-locked { position:relative; overflow:hidden; }
.cts-wrapper.is-locked .cts-blur { filter:blur(1px); pointer-events:none; user-select:none; }

.cts-results { margin-top:16px; background:#f8fafc; border:1px solid #e2e8f0; border-radius:8px; padding:12px; display:grid; gap:6px; }
.cts-final { font-size:18px; color:#2957cb; margin-top:4px; }
.cts-export { margin-top:8px; display:flex; gap:10px; flex-wrap:wrap; }

.cts-locked { text-align:center; }
.cts-locked-inner { max-width:520px; margin:0 auto; display:grid; gap:10px; }
.cts-locked h3 { margin:0; }
.cts-locked p { margin:0; color:#475569; }
.cts-locked-actions { display:flex; gap:10px; justify-content:center; flex-wrap:wrap; margin-top:6px; }

.cts-auth-modal { position:fixed; inset:0; background:rgba(15,23,42,0.4); display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; pointer-events:none; transition:opacity 0.2s ease; z-index:9999; }
.cts-auth-modal.is-open { opacity:1; pointer-events:auto; }
.cts-auth-dialog { background:#fff; border-radius:12px; padding:18px; max-width:520px; width:100%; box-shadow:0 18px 60px rgba(15,23,42,0.25); position:relative; }
.cts-auth-close { position:absolute; top:10px; right:10px; border:none; background:transparent; font-size:20px; cursor:pointer; }
.cts-auth-tabs { display:flex; gap:6px; margin-bottom:12px; flex-wrap:wrap; }
.cts-auth-tabs.is-hidden { display:none; }
.cts-auth-tab { flex:1; padding:10px; border:1px solid #cbd5e1; background:#f8fafc; border-radius:8px; cursor:pointer; font-weight:600; min-width:160px; text-align:center; }
.cts-auth-tab[data-tab="signup"] { flex:0 0 78%; max-width:78%; }
.cts-auth-tab.is-active { background:#2957cb; color:#fff; border-color:#2957cb; }
.cts-auth-panels { display:block; }
.cts-auth-panel { display:none; }
.cts-auth-panel.is-active { display:block; }
.cts-auth-panel p { margin-top:0; color:#475569; }
.cts-auth-hint { margin-top:10px; font-size:12px; color:#6b7280; }
.cts-auth-note { margin-top:10px; font-size:12px; color:#0f172a; font-weight:600; }
.cts-auth-dialog form p { margin:0 0 10px; }
.cts-auth-dialog label { font-weight:600; color:#0f172a; display:block; margin-bottom:4px; }
.cts-auth-dialog input[type="text"], .cts-auth-dialog input[type="password"] { width:100%; padding:10px; border:1px solid #cbd5e1; border-radius:8px; }
.cts-auth-dialog .forgetmenot { display:flex; align-items:center; gap:6px; }
.cts-auth-dialog .submit input { width:100%; }

.cts-confirm-modal { position:fixed; inset:0; background:rgba(15,23,42,0.35); display:flex; align-items:center; justify-content:center; padding:20px; opacity:0; pointer-events:none; transition:opacity 0.2s ease; z-index:9998; }
.cts-confirm-modal.is-open { opacity:1; pointer-events:auto; }
.cts-confirm-dialog { background:#fff; padding:16px; border-radius:10px; box-shadow:0 18px 60px rgba(15,23,42,0.25); max-width:420px; width:100%; display:grid; gap:12px; }
.cts-confirm-text { margin:0; font-weight:600; color:#0f172a; }
.cts-confirm-actions { display:flex; gap:10px; justify-content:flex-end; flex-wrap:wrap; }

@media (max-width: 720px) {
  .cts-project-meta { grid-template-columns:1fr; }
  .cts-project-actions { flex-direction:row; flex-wrap:wrap; align-items:flex-end; }
  .cts-project-actions select { min-width:180px; }
  .cts-auth-dialog { max-width:100%; }

  /* Allow buttons to wrap on smaller screens */
  .cts-project-buttons { flex-wrap:wrap; }
}