/* VISTORA LMS — instructor dashboard (frontend).
   Reuses the theme's brand tokens (--primary, --accent, …) with safe fallbacks. */
.vlms {
  --p: var(--primary, #4A3B6B);
  --a: var(--accent, #C9A961);
  --fg: var(--fg, #2D2D2D);
  --mut: var(--muted, #5A5A5A);
  --bd: var(--border, #E5E5E5);
  --sec: var(--secondary, #F5E6D3);
  max-width: 1040px; margin: 0 auto; padding: 1rem 0 3rem;
  color: var(--fg);
}
.vlms * { box-sizing: border-box; }

/* Notices */
.vlms-note { padding: .8rem 1rem; border-radius: 10px; margin-bottom: 1.25rem; font-size: .92rem; }
.vlms-note.ok  { background: #e9f6ec; border: 1px solid #b6e0c1; color: #1e7e34; }
.vlms-note.err { background: #fdecea; border: 1px solid #f3c2bd; color: #b3261e; }

/* Buttons */
.vlms-btn {
  display: inline-flex; align-items: center; gap: .4rem; cursor: pointer;
  background: var(--p); color: #fff; border: 0; border-radius: 999px;
  padding: .7rem 1.4rem; font-weight: 600; font-size: .92rem; text-decoration: none;
  transition: transform .2s, box-shadow .2s, opacity .2s;
}
.vlms-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 22px -12px rgba(74,59,107,.6); color: #fff; }
.vlms-btn-lg { padding: .9rem 1.8rem; font-size: 1rem; }
.vlms-btn-sm { padding: .45rem 1rem; font-size: .82rem; }
.vlms-btn-ghost { background: transparent; color: var(--p); border: 1px solid var(--bd); }
.vlms-btn-ghost:hover { background: var(--sec); color: var(--p); }
.vlms-link-danger { background: none; border: 0; color: #b3261e; cursor: pointer; font-size: .85rem; padding: .2rem .4rem; }
.vlms-link-danger:hover { text-decoration: underline; }

/* Header */
.vlms-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.vlms h1 { font-family: 'Playfair Display', Georgia, serif; font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 .25rem; color: var(--fg); }
.vlms-sub { color: var(--mut); margin: 0; }
.vlms-back { display: inline-block; color: var(--p); text-decoration: none; font-weight: 600; font-size: .88rem; margin-bottom: .75rem; }
.vlms-back:hover { text-decoration: underline; }

/* Become / empty hero */
.vlms-hero, .vlms-empty {
  background: linear-gradient(135deg, color-mix(in srgb, var(--sec) 55%, #fff), #fff);
  border: 1px solid var(--bd); border-radius: 20px; padding: 2.5rem; text-align: center;
}
.vlms-hero p, .vlms-empty p { color: var(--mut); max-width: 38rem; margin: .5rem auto 1.5rem; }
.vlms-perks { list-style: none; padding: 0; margin: 1.5rem 0 0; display: flex; gap: 1.25rem; justify-content: center; flex-wrap: wrap; color: var(--mut); font-size: .88rem; }
.vlms-perks li::before { content: "✓ "; color: var(--a); font-weight: 700; }

/* Course grid */
.vlms-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
@media (max-width: 900px) { .vlms-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .vlms-grid { grid-template-columns: 1fr; } }
.vlms-card { background: #fff; border: 1px solid var(--bd); border-radius: 16px; overflow: hidden; display: flex; flex-direction: column; transition: transform .35s, box-shadow .35s; }
.vlms-card:hover { transform: translateY(-4px); box-shadow: 0 22px 44px -26px rgba(74,59,107,.5); }
.vlms-card-media { position: relative; aspect-ratio: 16/9; background: var(--sec); display: grid; place-items: center; }
.vlms-card-media img { width: 100%; height: 100%; object-fit: cover; }
.vlms-ph { color: var(--mut); font-size: .8rem; }
.vlms-badge { position: absolute; top: .6rem; inset-inline-start: .6rem; font-size: .68rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: .2rem .55rem; border-radius: 6px; }
.vlms-badge.ok { background: #e6f4ea; color: #1e7e34; }
.vlms-badge.warn { background: #fff3df; color: #9a6a00; }
.vlms-badge.mut { background: #eee; color: #555; }
.vlms-card-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; flex: 1; }
.vlms-card-body h3 { margin: 0 0 .35rem; font-size: 1.02rem; line-height: 1.3; color: var(--fg); }
.vlms-card-meta { color: var(--mut); font-size: .82rem; margin-bottom: .9rem; }
.vlms-card-actions { margin-top: auto; display: flex; align-items: center; gap: .5rem; }

/* Forms */
.vlms-form { background: #fff; border: 1px solid var(--bd); border-radius: 16px; padding: 1.5rem; margin: 1.25rem 0; }
.vlms-field { margin-bottom: 1rem; display: flex; flex-direction: column; }
.vlms-field > label { font-weight: 600; font-size: .85rem; margin-bottom: .35rem; color: var(--fg); }
.vlms-field input:not([type=checkbox]):not([type=radio]),
.vlms-field select,
.vlms-field textarea {
  width: 100%; padding: .65rem .8rem; border: 1px solid var(--bd); border-radius: 10px;
  font: inherit; line-height: 1.4; color: var(--fg); background: #fff;
  box-sizing: border-box; min-height: 2.9rem;
}
/* textarea is multi-line; file input needs a touch less padding */
.vlms-field textarea { min-height: 5rem; }
.vlms-field input[type=file] { padding: .55rem .8rem; }
.vlms-field input:focus, .vlms-field select:focus, .vlms-field textarea:focus { outline: 2px solid color-mix(in srgb, var(--p) 40%, transparent); border-color: var(--p); }
.vlms-row { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem; }
@media (max-width: 760px) { .vlms-row { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .vlms-row { grid-template-columns: 1fr; } }
.vlms-check { justify-content: flex-end; }
.vlms-check label { display: flex; align-items: center; gap: .5rem; font-weight: 500; font-size: .9rem; }
.vlms-thumb { margin-bottom: .6rem; }
.vlms-thumb img { max-width: 220px; border-radius: 10px; border: 1px solid var(--bd); }
.vlms-hint { color: var(--mut); font-size: .82rem; margin: .6rem 0 0; }

/* Curriculum */
.vlms-curriculum { margin-top: 2rem; }
.vlms-curriculum h2 { font-family: 'Playfair Display', Georgia, serif; color: var(--fg); }
.vlms-section { background: #fff; border: 1px solid var(--bd); border-radius: 14px; padding: 1rem 1.2rem; margin-bottom: 1rem; }
.vlms-section h3 { margin: 0 0 .6rem; font-size: 1rem; color: var(--p); }
.vlms-lessons { list-style: none; margin: 0; padding: 0; }
.vlms-lessons li { display: flex; align-items: center; gap: .6rem; padding: .55rem 0; border-bottom: 1px solid color-mix(in srgb, var(--bd) 70%, transparent); }
.vlms-lessons li:last-child { border-bottom: 0; }
.vlms-lesson-ic { color: var(--a); }
.vlms-lesson-title { font-weight: 500; }
.vlms-lesson-meta { color: var(--mut); font-size: .78rem; }
.vlms-add-lesson h3 { margin-top: 0; color: var(--fg); }
.lang-ar .vlms h1, .lang-ar .vlms-curriculum h2, .is-rtl .vlms h1 { font-family: 'Cairo', serif; }

/* Tabs */
.vlms-tabs { display: flex; gap: .35rem; border-bottom: 1px solid var(--bd); margin-bottom: 1.5rem; }
.vlms-tabs a { padding: .7rem 1.1rem; text-decoration: none; color: var(--mut); font-weight: 600; font-size: .92rem; border-bottom: 2px solid transparent; margin-bottom: -1px; }
.vlms-tabs a:hover { color: var(--p); }
.vlms-tabs a.on { color: var(--p); border-bottom-color: var(--a); }

/* Earnings */
.vlms-earn-stats { display: grid; grid-template-columns: repeat(3,1fr); gap: 1rem; }
@media (max-width:600px){ .vlms-earn-stats { grid-template-columns: 1fr; } }
.vlms-earn-card { background:#fff; border:1px solid var(--bd); border-radius:14px; padding:1.25rem 1.4rem; }
.vlms-earn-card .n { font-family:'Playfair Display',serif; font-size:1.8rem; font-weight:700; color:var(--p); line-height:1; }
.vlms-earn-card .l { color:var(--mut); font-size:.82rem; margin-top:.4rem; }
.vlms-table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--bd); border-radius:12px; overflow:hidden; }
.vlms-table th, .vlms-table td { text-align:start; padding:.7rem .9rem; border-bottom:1px solid color-mix(in srgb,var(--bd) 70%,transparent); font-size:.88rem; }
.vlms-table th { background:color-mix(in srgb,var(--sec) 35%,#fff); font-weight:700; }
.vlms-table tr:last-child td { border-bottom:0; }
.vlms-badge { font-size:.68rem; font-weight:700; text-transform:uppercase; letter-spacing:.04em; padding:.18rem .5rem; border-radius:6px; }
.vlms-badge.ok { background:#e6f4ea; color:#1e7e34; }
.vlms-badge.warn { background:#fff3df; color:#9a6a00; }
.vlms-badge.mut { background:#eee; color:#555; }

/* Booking slot picker (frontend /book/) */
.vd-book-slots { border: 1px solid var(--bd); border-radius: 12px; padding: 1rem; background: #fff; max-height: 22rem; overflow: auto; }
.vd-book-slots.vd-book-need { border-color: #DC2626; box-shadow: 0 0 0 3px rgba(220,38,38,.12); }
.vd-book-day { margin-bottom: 1rem; }
.vd-book-day:last-child { margin-bottom: 0; }
.vd-book-date { font-weight: 700; font-size: .85rem; color: var(--p); margin-bottom: .5rem; }
.vd-book-pills { display: flex; flex-wrap: wrap; gap: .45rem; }
/* Two-step picker: day row (step 1) then times (step 2) */
.vd-book-days { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: .65rem; margin-bottom: .9rem; border-bottom: 1px solid var(--bd); scrollbar-width: thin; }
.vd-book-daybtn { flex: 0 0 auto; min-width: 4.6rem; cursor: pointer; border: 1px solid var(--bd); background: #fff; color: var(--fg); border-radius: 12px; padding: .5rem .65rem; display: flex; flex-direction: column; align-items: center; gap: .08rem; font: inherit; line-height: 1.15; transition: all .15s; }
.vd-book-daybtn:hover { border-color: var(--p); background: color-mix(in srgb, var(--secondary) 45%, #fff); }
.vd-book-daybtn.sel { background: var(--p); border-color: var(--p); color: #fff; box-shadow: 0 8px 18px -10px rgba(74,59,107,.6); }
.vd-book-wd { font-weight: 700; font-size: .82rem; }
.vd-book-md { font-size: .74rem; opacity: .85; }
.vd-book-n { font-size: .64rem; opacity: .7; margin-top: .12rem; white-space: nowrap; }
.vd-book-times { min-height: 2.5rem; }
.vd-book-slot { cursor: pointer; border: 1px solid var(--bd); background: #fff; color: var(--fg); border-radius: 999px; padding: .5rem .9rem; font: inherit; font-size: .85rem; font-weight: 600; transition: all .15s; }
.vd-book-slot:hover { border-color: var(--p); background: color-mix(in srgb, var(--secondary) 50%, #fff); }
.vd-book-slot.sel { background: var(--p); color: #fff; border-color: var(--p); box-shadow: 0 8px 18px -10px rgba(74,59,107,.7); }

/* Floating "back to dashboard" button (site-wide, for creators) */
.vd-fab {
  position: fixed; inset-block-end: 1.25rem; inset-inline-end: 1.25rem; z-index: 95;
  display: inline-flex; align-items: center; gap: .5rem;
  background: var(--primary, #4A3B6B); color: #fff; text-decoration: none;
  padding: .75rem 1.2rem; border-radius: 999px; font-weight: 600; font-size: .9rem;
  box-shadow: 0 16px 32px -12px rgba(74,59,107,.75);
  transition: transform .2s, box-shadow .2s;
}
.vd-fab:hover { transform: translateY(-2px); color: #fff; box-shadow: 0 22px 40px -14px rgba(74,59,107,.85); }
.vd-fab svg { color: var(--accent, #C9A961); }
@media (max-width: 560px) { .vd-fab span { display: none; } .vd-fab { padding: .85rem; inset-block-end: 1rem; inset-inline-end: 1rem; } }

/* Digital-product builder — type picker, chips, deliverable fields */
.vlms-newbar { display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; margin-bottom:1.25rem; }
.vlms-newbar-label { font-weight:700; color:var(--muted,#5A5A5A); font-size:.85rem; margin-inline-end:.25rem; }
.vlms-newchip { display:inline-flex; align-items:center; gap:.35rem; border:1px solid var(--border,#E5E5E5); background:#fff; color:var(--fg,#2D2D2D); border-radius:999px; padding:.4rem .85rem; font-size:.83rem; font-weight:600; text-decoration:none; transition:border-color .2s, background .2s; }
.vlms-newchip:hover { border-color:var(--primary,#4A3B6B); background:color-mix(in srgb,var(--secondary,#F5E6D3) 40%,#fff); }
.vlms-typechip { display:inline-flex; align-items:center; gap:.4rem; font-weight:700; color:var(--primary,#4A3B6B); background:color-mix(in srgb,var(--secondary,#F5E6D3) 50%,#fff); padding:.55rem .9rem; border-radius:.6rem; }
.vlms-filechip { font-size:.85rem; color:var(--fg,#2D2D2D); background:color-mix(in srgb,var(--secondary,#F5E6D3) 40%,#fff); border-radius:.5rem; padding:.45rem .7rem; margin-bottom:.5rem; display:inline-block; }
.vlms-filechip em { color:var(--muted,#5A5A5A); font-style:normal; }
.vlms-hint-inline { font-weight:400; color:var(--muted,#5A5A5A); font-size:.78rem; }

/* Seller-plan quota UI */
.vlms-newchip-off { opacity:.55; cursor:not-allowed; border-style:dashed; }
.vlms-newbar-quota { font-size:.8rem; color:var(--muted,#5A5A5A); margin-inline-start:auto; }

/* Withdrawal request box + history (instructor earnings view) */
.vlms-wd-box { background:color-mix(in srgb,var(--secondary,#F5E6D3) 30%,#fff); border:1px solid var(--border,#E5E5E5); border-radius:1rem; padding:1.25rem 1.5rem; }
.vlms-wd-box.muted { background:#fff; color:var(--muted,#5A5A5A); }
.vlms-wd-box p { margin:0 0 .75rem; }
.vlms-wd-box p:last-child { margin-bottom:0; }
.vlms-wd-form { display:grid; gap:.75rem; max-width:30rem; margin-top:.5rem; }
.vlms-wd-form textarea { width:100%; }

/* Required-field asterisk (booking + forms) */
.vlms-req { color:#DC2626; font-weight:700; }

/* ---- Consultation booking type cards (booking form) ---- */
.vd-book-types { display:flex; gap:.6rem; flex-wrap:wrap; }
.vd-book-type { flex:1 1 12rem; cursor:pointer; text-align:start; border:1px solid var(--bd); background:#fff; border-radius:12px; padding:.7rem .9rem; font:inherit; display:flex; flex-direction:column; gap:.25rem; transition:all .15s; }
.vd-book-type:hover { border-color:var(--p); }
.vd-book-type.sel { border-color:var(--p); background:color-mix(in srgb,var(--secondary) 45%,#fff); box-shadow:0 8px 18px -12px rgba(74,59,107,.6); }
.vd-book-type-name { font-weight:700; color:var(--fg); font-size:.9rem; }
.vd-book-type-price { color:var(--p); font-weight:700; font-size:1.05rem; }

/* ---- Consultant rates form ---- */
.vd-rates { display:flex; gap:1rem; align-items:flex-end; flex-wrap:wrap; }
.vd-rates .vlms-field { margin:0; min-width:12rem; }

/* ---- Bookings panel (consultant dashboard) ---- */
.vd-bookings h3 { margin:0 0 1rem; }
.vd-bk { border:1px solid var(--border,#E5E5E5); border-radius:14px; padding:1rem 1.1rem; margin-bottom:.9rem; background:#fff; }
.vd-bk-requested { border-inline-start:4px solid #C9A961; }
.vd-bk-accepted  { border-inline-start:4px solid #4A3B6B; }
.vd-bk-confirmed { border-inline-start:4px solid #2E9E5B; }
.vd-bk-rejected  { opacity:.6; }
.vd-bk-top { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; }
.vd-bk-who strong { display:block; color:var(--fg,#2D2D2D); }
.vd-bk-who span { font-size:.85rem; color:var(--muted,#5A5A5A); }
.vd-bk-badge { font-size:.7rem; font-weight:700; text-transform:uppercase; padding:.22rem .6rem; border-radius:999px; white-space:nowrap; }
.vd-bk-badge.warn { background:#FDF3E2; color:#9A6A12; }
.vd-bk-badge.ok   { background:#E9F7EF; color:#1E7E45; }
.vd-bk-badge.mut  { background:#eee; color:#777; }
.vd-bk-when { font-size:.88rem; color:var(--fg,#2D2D2D); margin:.55rem 0 .35rem; }
.vd-bk-contact { display:flex; gap:1rem; flex-wrap:wrap; font-size:.84rem; color:var(--muted,#5A5A5A); }
.vd-bk-contact a { color:var(--primary,#4A3B6B); font-weight:600; text-decoration:none; }
.vd-bk-wa { color:#25D366 !important; }
.vd-bk-note { font-size:.85rem; color:#555; background:#faf8fc; border-radius:8px; padding:.5rem .7rem; margin:.6rem 0 0; }
.vd-bk-actions, .vd-bk-pay, .vd-bk-meeting { margin-top:.85rem; padding-top:.85rem; border-top:1px solid #f0f0f4; }
.vd-bk-check { display:flex; align-items:center; gap:.45rem; font-size:.85rem; color:var(--fg,#2D2D2D); margin-bottom:.6rem; }
.vd-bk-btns { display:flex; gap:.5rem; flex-wrap:wrap; }
.vd-bk-paylbl { display:block; font-size:.8rem; color:var(--muted,#5A5A5A); margin-bottom:.35rem; }
.vd-bk-link { width:100%; font-size:.8rem; padding:.5rem .6rem; border:1px solid var(--border,#E5E5E5); border-radius:8px; background:#fafafa; margin-bottom:.5rem; }
.vd-bk-meeting label { display:block; font-weight:600; font-size:.85rem; margin-bottom:.45rem; }
.vd-bk-meeting-row { display:flex; gap:.5rem; }
.vd-bk-meeting-row input { flex:1; }
.vd-bk-sent { color:#2E9E5B; font-style:normal; font-size:.78rem; margin-inline-start:.4rem; }