/* ─────────────────────────────────────────────
   WyderNet LTI Pages — lti-pages.css
   Matches the clean, minimal design in the brief
   ───────────────────────────────────────────── */

:root {
    --wy-teal:        #3a7d6e;
    --wy-teal-dark:   #2d6359;
    --wy-teal-light:  #e8f4f1;
    --wy-teal-icon:   #4a9183;
    --wy-text:        #1a1a1a;
    --wy-text-muted:  #6b7280;
    --wy-text-hint:   #9ca3af;
    --wy-border:      #e5e7eb;
    --wy-bg:          #f9f9f8;
    --wy-card-bg:     #ffffff;
    --wy-radius:      12px;
    --wy-radius-sm:   8px;
    --wy-shadow:      0 1px 4px rgba(0,0,0,0.06), 0 4px 16px rgba(0,0,0,0.06);
    --wy-font:        'DM Sans', 'Helvetica Neue', Arial, sans-serif;
}

/* Google Font */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&display=swap');

/* Page wrapper */
.wy-lti-page {
    font-family:      var(--wy-font);
    background:       var(--wy-bg);
    min-height:       100vh;
    padding:          2rem 1rem;
    color:            var(--wy-text);
    -webkit-font-smoothing: antialiased;
}

/* Hide default Neve header/footer chrome on LTI pages */
.wy-lti-page ~ footer,
header.site-header {
    display: none !important;
}

/* Container */
.wy-container {
    max-width: 720px;
    margin:    0 auto;
}

/* ── Course header ── */
.wy-course-header {
    margin-bottom: 1.5rem;
}

.wy-label {
    font-size:      0.75rem;
    font-weight:    600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color:          var(--wy-text-muted);
}

.wy-course-title {
    font-size:   1.75rem;
    font-weight: 600;
    margin:      0.25rem 0 0;
    color:       var(--wy-text);
    line-height: 1.2;
}

.wy-placeholder {
    color: var(--wy-text-muted);
}

/* ── Card ── */
.wy-card {
    background:    var(--wy-card-bg);
    border-radius: var(--wy-radius);
    box-shadow:    var(--wy-shadow);
    padding:       2.5rem 2rem;
    text-align:    center;
}

/* Card icon */
.wy-card-icon {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           72px;
    height:          72px;
    background:      var(--wy-teal-light);
    border-radius:   50%;
    margin-bottom:   1.25rem;
    color:           var(--wy-teal-icon);
}

.wy-card-title {
    font-size:     1.25rem;
    font-weight:   600;
    margin:        0 0 0.75rem;
    color:         var(--wy-text);
}

.wy-card-description {
    font-size:   0.95rem;
    color:       var(--wy-text-muted);
    line-height: 1.6;
    max-width:   540px;
    margin:      0 auto 1.75rem;
}

/* ── Drop zone ── */
.wy-dropzone {
    position:      relative;
    border:        2px dashed var(--wy-border);
    border-radius: var(--wy-radius-sm);
    padding:       2.5rem 1.5rem;
    margin-bottom: 1.5rem;
    cursor:        pointer;
    transition:    border-color 0.2s ease, background 0.2s ease;
}

.wy-dropzone:hover,
.wy-dropzone.wy-drag-over {
    border-color: var(--wy-teal);
    background:   var(--wy-teal-light);
}

.wy-dropzone.wy-drag-over .wy-upload-icon {
    color: var(--wy-teal);
}

/* Hidden real file input covers the whole dropzone */
.wy-file-input {
    position: absolute;
    inset:    0;
    opacity:  0;
    cursor:   pointer;
    width:    100%;
    height:   100%;
}

.wy-upload-icon {
    color:         var(--wy-text-hint);
    margin-bottom: 0.5rem;
    transition:    color 0.2s ease;
}

.wy-dropzone-text {
    font-size:   0.95rem;
    color:       var(--wy-text-muted);
    margin:      0 0 0.25rem;
}

.wy-link {
    color:           var(--wy-teal);
    font-weight:     500;
    text-decoration: underline;
    cursor:          pointer;
}

.wy-dropzone-hint {
    font-size: 0.8rem;
    color:     var(--wy-text-hint);
    margin:    0.1rem 0 0;
}

/* Selected file state */
.wy-dropzone-selected {
    display:     flex;
    align-items: center;
    gap:         0.75rem;
    color:       var(--wy-teal-dark);
    font-weight: 500;
    font-size:   0.95rem;
}

.wy-dropzone-selected svg {
    flex-shrink: 0;
    color:       var(--wy-teal);
}

#selected-filename {
    flex:          1;
    text-align:    left;
    overflow:      hidden;
    text-overflow: ellipsis;
    white-space:   nowrap;
}

.wy-remove-file {
    background:  none;
    border:      none;
    cursor:      pointer;
    color:       var(--wy-text-muted);
    font-size:   1rem;
    padding:     0.25rem;
    line-height: 1;
    transition:  color 0.15s;
}

.wy-remove-file:hover {
    color: #e53e3e;
}

/* ── Submit button ── */
.wy-btn {
    display:          inline-flex;
    align-items:      center;
    gap:              0.5rem;
    background:       var(--wy-teal);
    color:            #fff;
    border:           none;
    border-radius:    var(--wy-radius-sm);
    padding:          0.75rem 1.75rem;
    font-family:      var(--wy-font);
    font-size:        0.95rem;
    font-weight:      600;
    cursor:           pointer;
    transition:       background 0.2s ease, opacity 0.2s ease, transform 0.1s ease;
}

.wy-btn:hover:not(:disabled) {
    background: var(--wy-teal-dark);
    transform:  translateY(-1px);
}

.wy-btn:active:not(:disabled) {
    transform: translateY(0);
}

.wy-btn:disabled {
    opacity: 0.45;
    cursor:  not-allowed;
}

/* ── Alert ── */
.wy-alert {
    display:       flex;
    align-items:   center;
    gap:           0.5rem;
    padding:       0.75rem 1rem;
    border-radius: var(--wy-radius-sm);
    font-size:     0.875rem;
    margin-bottom: 1.25rem;
    text-align:    left;
}

.wy-alert--error {
    background: #fef2f2;
    color:      #b91c1c;
    border:     1px solid #fecaca;
}

/* ── Success state ── */
.wy-success-state {
    text-align: center;
    padding:    4rem 2rem;
}

.wy-success-icon {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           80px;
    height:          80px;
    background:      var(--wy-teal-light);
    border-radius:   50%;
    color:           var(--wy-teal);
    margin-bottom:   1.5rem;
    animation:       wy-pop 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

.wy-success-state h2 {
    font-size:     1.5rem;
    font-weight:   600;
    margin-bottom: 0.5rem;
}

.wy-success-state p {
    color: var(--wy-text-muted);
}

@keyframes wy-pop {
    from { transform: scale(0.5); opacity: 0; }
    to   { transform: scale(1);   opacity: 1; }
}

/* ── Responsive ── */
@media (max-width: 480px) {
    .wy-card {
        padding: 1.75rem 1.25rem;
    }
    .wy-course-title {
        font-size: 1.4rem;
    }
}


/* ─────────────────────────────────────────────
   WyderNet Header & Footer
   ───────────────────────────────────────────── */

/* Reset body margin that Neve adds */
body.wy-lti-body {
    margin:     0;
    padding:    0;
    background: var(--wy-bg);
}

/* ── Header ── */
.wy-header {
    background:   var(--wy-card-bg);
    border-bottom: 1px solid var(--wy-border);
    padding:      0 1.5rem;
    height:       56px;
    display:      flex;
    align-items:  center;
    position:     sticky;
    top:          0;
    z-index:      100;
}

.wy-header-inner {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    width:           100%;
    max-width:       960px;
    margin:          0 auto;
}

.wy-header-logo a,
.wy-header-logo img {
    display:    block;
    max-height: 32px;
    width:      auto;
}

.wy-header-sitename {
    font-family: var(--wy-font);
    font-weight: 600;
    font-size:   1rem;
    color:       var(--wy-teal);
    letter-spacing: -0.01em;
}

.wy-header-right {
    display:     flex;
    align-items: center;
    gap:         1.25rem;
}

.wy-header-user {
    display:     flex;
    align-items: center;
    gap:         0.35rem;
    font-size:   0.85rem;
    color:       var(--wy-text-muted);
}

.wy-header-return {
    display:         flex;
    align-items:     center;
    gap:             0.3rem;
    font-size:       0.85rem;
    font-weight:     500;
    color:           var(--wy-teal);
    text-decoration: none;
    transition:      color 0.15s;
}

.wy-header-return:hover {
    color: var(--wy-teal-dark);
}

/* ── Main content area ── */
.wy-main {
    min-height: calc(100vh - 56px - 48px);
    padding:    2rem 1rem;
}

/* ── Footer ── */
.wy-footer {
    border-top:  1px solid var(--wy-border);
    background:  var(--wy-card-bg);
    height:      48px;
    display:     flex;
    align-items: center;
}

.wy-footer-inner {
    display:     flex;
    align-items: center;
    gap:         0.6rem;
    font-size:   0.8rem;
    color:       var(--wy-text-hint);
    padding:     0 1.5rem;
    max-width:   960px;
    margin:      0 auto;
    width:       100%;
}

.wy-footer-divider {
    color: var(--wy-border);
}

.wy-footer-powered a {
    color:           var(--wy-teal);
    text-decoration: none;
}

.wy-footer-powered a:hover {
    text-decoration: underline;
}

.wy-footer-course {
    margin-left: auto;
    font-style:  italic;
}


/* ─────────────────────────────────────────────
   Research Guide Page — full-width banded layout
   ───────────────────────────────────────────── */

/* Override base page padding for the guide — bands handle their own spacing */
.wy-guide-page {
    padding: 0;
}

/* ── Full-width bands ── */
.wy-guide-band {
    width:      100%;
    border-bottom: 1px solid var(--wy-border);
}

.wy-guide-inner {
    max-width: 1200px;
    margin:    0 auto;
    padding:   1.5rem 2.5rem;
}

/* Band 1 — title */
.wy-guide-band--title {
    background: var(--wy-teal-light);
}

.wy-guide-band--title .wy-label {
    display: block;
    margin-bottom: 0.4rem;
}

.wy-guide-band--title .wy-course-title {
    margin: 0;
    font-size: 1.9rem;
}

/* Band 2 — share */
.wy-guide-band--share {
    background: #ffffff;
}

/* Band 3 — edit actions */
.wy-guide-band--actions {
    background: #f5faf8;
    border-bottom: none;
}

.wy-guide-band--actions .wy-guide-inner {
    padding-top:    1rem;
    padding-bottom: 1rem;
}

/* Band 4 — guide body content */
.wy-guide-band--body {
    background:    #ffffff;
    border-bottom: none;
}

/* ── Share box (inside Band 2) ── */
.wy-guide-share-box {
    display:       flex;
    flex-direction: column;
    gap:           0.35rem;
}

.wy-share-title-row {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    color:       var(--wy-text-muted);
}

.wy-share-label {
    font-weight: 600;
    font-size:   0.9rem;
    color:       var(--wy-text);
    flex:        1;
}

.wy-share-hint {
    font-size:   0.8rem;
    color:       var(--wy-text-hint);
    margin:      0;
    line-height: 1.5;
    padding-left: 1.5rem;
}

/* ── Toggle switch ── */
.wy-toggle {
    position:    relative;
    display:     inline-block;
    width:       36px;
    height:      20px;
    flex-shrink: 0;
}

.wy-toggle input {
    opacity: 0;
    width:   0;
    height:  0;
}

.wy-toggle-slider {
    position:      absolute;
    inset:         0;
    background:    var(--wy-border);
    border-radius: 20px;
    cursor:        not-allowed;
    transition:    background 0.2s;
}

.wy-toggle-slider::before {
    content:       '';
    position:      absolute;
    width:         14px;
    height:        14px;
    left:          3px;
    top:           3px;
    background:    #fff;
    border-radius: 50%;
    transition:    transform 0.2s;
    box-shadow:    0 1px 3px rgba(0,0,0,0.15);
}

.wy-toggle input:checked + .wy-toggle-slider            { background: var(--wy-teal); }
.wy-toggle input:checked + .wy-toggle-slider::before    { transform: translateX(16px); }

/* ── Secondary button ── */
.wy-btn--secondary {
    background:   transparent;
    color:        var(--wy-teal);
    border:       1.5px solid var(--wy-teal);
}

.wy-btn--secondary:hover:not(:disabled) {
    background:   var(--wy-teal-light);
    border-color: var(--wy-teal-dark);
    color:        var(--wy-teal-dark);
    transform:    translateY(-1px);
}

/* ── Guide text sections ── */
.wy-guide-section {
    margin-bottom: 2.25rem;
    color:         var(--wy-text);
    line-height:   1.75;
    font-size:     0.95rem;
}

.wy-guide-section h2 {
    font-size:      1.05rem;
    font-weight:    700;
    color:          var(--wy-teal-dark);
    margin:         0 0 0.75rem;
    padding-bottom: 0.45rem;
    border-bottom:  2px solid var(--wy-teal-light);
    text-transform: uppercase;
    letter-spacing: 0.04em;
}

.wy-guide-section p {
    margin: 0 0 0.85rem;
    color:  var(--wy-text-muted);
}

.wy-guide-section ul,
.wy-guide-section ol {
    padding-left: 0;
    margin:       0 0 0.85rem;
    list-style:   none;
    color:        var(--wy-text-muted);
}

.wy-guide-section li {
    position:      relative;
    padding-left:  1.35rem;
    margin-bottom: 0.55rem;
    line-height:   1.65;
}

.wy-guide-section li::before {
    content:     '';
    position:    absolute;
    left:        0;
    top:         0.55em;
    width:       7px;
    height:      7px;
    border-radius: 50%;
    background:  var(--wy-teal);
    flex-shrink: 0;
}

.wy-guide-section li strong {
    color:       var(--wy-text);
    font-weight: 600;
}

.wy-guide-section em {
    font-style: italic;
}

/* ── Resource tables ── */
.wy-guide-table-block {
    margin-bottom: 2.5rem;
}

.wy-guide-table-wrap {
    border:        1px solid var(--wy-border);
    border-radius: var(--wy-radius-sm);
    overflow-x:    auto;
    box-shadow:    0 1px 3px rgba(0,0,0,0.04);
}

.wy-guide-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
}

.wy-guide-table thead tr {
    background: var(--wy-teal-light);
}

.wy-guide-table th {
    padding:       0.65rem 1rem;
    text-align:    left;
    font-weight:   600;
    font-size:     0.78rem;
    color:         var(--wy-teal-dark);
    white-space:   nowrap;
    border-bottom: 1px solid #c9e3de;
    text-transform: uppercase;
    letter-spacing: 0.03em;
}

.wy-guide-table td {
    padding:        0.7rem 1rem;
    border-bottom:  1px solid var(--wy-border);
    color:          var(--wy-text);
    vertical-align: middle;
}

.wy-guide-table tbody tr:last-child td { border-bottom: none; }
.wy-guide-table tbody tr:hover         { background: #f7fbf9; }

.wy-col-filter {
    color:          var(--wy-text-hint);
    margin-left:    0.3rem;
    vertical-align: middle;
}

.wy-col-action {
    width:      44px;
    text-align: center;
}

.wy-table-link {
    color:           var(--wy-teal);
    text-decoration: none;
    font-weight:     500;
}

.wy-table-link:hover {
    text-decoration: underline;
    color:           var(--wy-teal-dark);
}

.wy-table-empty,
.wy-table-loading {
    padding:    1.5rem 1rem;
    text-align: center;
    color:      var(--wy-text-hint);
    font-size:  0.875rem;
}

/* ── Eye button ── */
.wy-table-eye-btn {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           28px;
    height:          28px;
    border-radius:   6px;
    color:           var(--wy-teal);
    transition:      background 0.15s, color 0.15s;
    text-decoration: none;
}

.wy-table-eye-btn:hover {
    background: var(--wy-teal-light);
    color:      var(--wy-teal-dark);
}

/* ── Availability badges ── */
.wy-badge {
    display:       inline-flex;
    align-items:   center;
    gap:           0.3rem;
    padding:       0.2rem 0.6rem;
    border-radius: 999px;
    font-size:     0.76rem;
    font-weight:   500;
    white-space:   nowrap;
}

.wy-badge--open-access { background: #e8f4f1; color: #2d6359; }
.wy-badge--library     { background: #ecfdf5; color: #065f46; }
.wy-badge--ai-only     { background: #fff7ed; color: #9a3412; }
.wy-badge--doi         { background: #eff6ff; color: #1e40af; }
.wy-badge--default     { background: #f3f4f6; color: #4b5563; }

/* ── Pagination ── */
.wy-pagination {
    display:         flex;
    align-items:     center;
    justify-content: flex-end;
    gap:             0.75rem;
    padding:         0.65rem 0.25rem 0;
    font-size:       0.8rem;
    color:           var(--wy-text-muted);
}

.wy-pagination-nav {
    display:     flex;
    align-items: center;
    gap:         0.2rem;
}

.wy-pagination-pages {
    padding:    0 0.3rem;
    font-size:  0.8rem;
    color:      var(--wy-text-muted);
}

.wy-page-btn {
    display:         inline-flex;
    align-items:     center;
    justify-content: center;
    width:           28px;
    height:          28px;
    border:          1px solid #c9e3de;
    border-radius:   6px;
    background:      #f0f9f6;
    color:           var(--wy-teal-dark);
    cursor:          pointer;
    padding:         0;
    transition:      background 0.15s, border-color 0.15s, color 0.15s;
    /* Override any browser / theme blue defaults */
    outline:         none;
    -webkit-appearance: none;
    appearance:      none;
}

.wy-page-btn:hover:not(:disabled) {
    background:   var(--wy-teal-light);
    border-color: var(--wy-teal);
    color:        var(--wy-teal);
}

.wy-page-btn:focus-visible {
    outline: 2px solid var(--wy-teal);
    outline-offset: 1px;
}

.wy-page-btn:disabled {
    opacity: 0.35;
    cursor:  default;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .wy-guide-inner {
        padding: 1.25rem 1rem;
    }
    .wy-guide-band--title .wy-course-title {
        font-size: 1.45rem;
    }
}

/* ═══════════════════════════════════════════════════════════════
   Edit Research Guide Wizard
   ═══════════════════════════════════════════════════════════════ */

/* ── Wizard page wrapper ── */
.wy-wizard-page {
    padding: 0;
}

/* ── Wizard header bar ── */
.wy-wizard-header {
    background:    var(--wy-card-bg);
    border-bottom: 1px solid var(--wy-border);
    padding:       1.25rem 2rem;
    display:       flex;
    align-items:   center;
    gap:           2.5rem;
    position:      sticky;
    top:           0;
    z-index:       100;
}

.wy-back-btn {
    display:       flex;
    align-items:   center;
    gap:           0.4rem;
    color:         var(--wy-text-muted);
    font-size:     0.875rem;
    font-weight:   500;
    text-decoration: none;
    white-space:   nowrap;
    flex-shrink:   0;
}
.wy-back-btn:hover { color: var(--wy-teal); }
.wy-back-btn svg   { flex-shrink: 0; }

/* ── Step indicator ── */
.wy-wizard-steps {
    display:     flex;
    align-items: center;
    gap:         0;
    flex:        1;
}

.wy-wizard-step {
    display:       flex;
    align-items:   center;
    gap:           0.6rem;
    text-decoration: none;
    padding:       0.15rem 0;
    flex-shrink:   0;
}

.wy-wizard-step-circle {
    width:         32px;
    height:        32px;
    border-radius: 50%;
    border:        2px solid var(--wy-border);
    background:    transparent;
    display:       flex;
    align-items:   center;
    justify-content: center;
    font-size:     0.875rem;
    font-weight:   600;
    color:         var(--wy-text-muted);
    flex-shrink:   0;
    transition:    background 0.2s, border-color 0.2s, color 0.2s;
}

.wy-wizard-step-labels {
    display:        flex;
    flex-direction: column;
    line-height:    1.2;
}

.wy-wizard-step-title {
    font-size:   0.875rem;
    font-weight: 500;
    color:       var(--wy-text-muted);
}

.wy-wizard-step-sub {
    font-size: 0.75rem;
    color:     var(--wy-text-hint);
}

/* Active step */
.wy-wizard-step--active .wy-wizard-step-circle {
    background:   var(--wy-teal);
    border-color: var(--wy-teal);
    color:        #fff;
}
.wy-wizard-step--active .wy-wizard-step-title { color: var(--wy-text); font-weight: 600; }

/* Done step (clickable) */
.wy-wizard-step--done .wy-wizard-step-circle {
    border-color: var(--wy-teal);
    color:        var(--wy-teal);
}
.wy-wizard-step--done .wy-wizard-step-title { color: var(--wy-teal); }
.wy-wizard-step--done { cursor: pointer; }
.wy-wizard-step--done:hover .wy-wizard-step-circle {
    background: var(--wy-teal-light);
}

/* Locked step */
.wy-wizard-step--locked { cursor: default; pointer-events: none; }

/* Connector line between steps */
.wy-wizard-connector {
    flex:            1;
    height:          1px;
    background:      var(--wy-border);
    margin:          0 0.75rem;
    min-width:       1.5rem;
    max-width:       4rem;
}

/* ── Wizard body (form card) ── */
.wy-wizard-body {
    max-width:  860px;
    margin:     2.5rem auto;
    padding:    0 1.5rem 3rem;
}

/* ── Wizard field groups ── */
.wy-wizard-field {
    margin-bottom: 2rem;
}

.wy-wizard-field > label,
.wy-wizard-field-label {
    display:     block;
    font-size:   1rem;
    font-weight: 600;
    color:       var(--wy-text);
    margin-bottom: 0.35rem;
}

.wy-wizard-field .wy-field-hint {
    font-size:    0.825rem;
    color:        var(--wy-teal);
    margin:       0 0 0.65rem;
    line-height:  1.4;
}

.wy-wizard-field input[type="text"] {
    width:        100%;
    padding:      0.65rem 0.9rem;
    font-size:    0.95rem;
    font-family:  var(--wy-font);
    border:       1.5px solid var(--wy-border);
    border-radius: var(--wy-radius-sm);
    background:   var(--wy-card-bg);
    color:        var(--wy-text);
    outline:      none;
    box-sizing:   border-box;
    transition:   border-color 0.15s;
}
.wy-wizard-field input[type="text"]:focus {
    border-color: var(--wy-teal);
    box-shadow:   0 0 0 3px rgba(58,125,110,0.12);
}
.wy-wizard-field input[type="text"].wy-input-error {
    border-color: #ef4444;
}

.wy-wizard-field .wy-error-msg {
    font-size:   0.8rem;
    color:       #ef4444;
    margin-top:  0.3rem;
    display:     none;
}
.wy-wizard-field .wy-error-msg.wy-visible { display: block; }

/* ── Quill editor inside wizard ── */
.wy-wizard-field .ql-toolbar.ql-snow {
    border:        1.5px solid var(--wy-border);
    border-bottom: none;
    border-radius: var(--wy-radius-sm) var(--wy-radius-sm) 0 0;
    font-family:   var(--wy-font);
    background:    #fafafa;
}
.wy-wizard-field .ql-container.ql-snow {
    border:        1.5px solid var(--wy-border);
    border-radius: 0 0 var(--wy-radius-sm) var(--wy-radius-sm);
    font-family:   var(--wy-font);
    font-size:     0.9rem;
    color:         var(--wy-text);
}
.wy-wizard-field .ql-editor {
    min-height: 220px;
    line-height: 1.65;
}
.wy-wizard-field .ql-editor.ql-blank::before {
    color: var(--wy-text-hint);
    font-style: normal;
}
.wy-wizard-field .ql-container.ql-snow:focus-within {
    border-color: var(--wy-teal);
    box-shadow:   0 0 0 3px rgba(58,125,110,0.12);
}
.wy-wizard-field .ql-snow .ql-stroke { stroke: var(--wy-text-muted); }
.wy-wizard-field .ql-snow .ql-fill   { fill:   var(--wy-text-muted); }
.wy-wizard-field .ql-snow.ql-toolbar button:hover .ql-stroke,
.wy-wizard-field .ql-snow.ql-toolbar button.ql-active .ql-stroke { stroke: var(--wy-teal); }
.wy-wizard-field .ql-snow.ql-toolbar button:hover .ql-fill,
.wy-wizard-field .ql-snow.ql-toolbar button.ql-active .ql-fill   { fill:   var(--wy-teal); }

/* ── Wizard action row ── */
.wy-wizard-actions {
    display:         flex;
    justify-content: flex-end;
    margin-top:      2rem;
    padding-top:     1.5rem;
    border-top:      1px solid var(--wy-border);
}

/* ── Add Document stub button ── */
.wy-btn--outline {
    background:    transparent;
    border:        1.5px solid var(--wy-border);
    color:         var(--wy-text-muted);
    padding:       0.55rem 1.1rem;
    border-radius: var(--wy-radius-sm);
    font-size:     0.875rem;
    font-family:   var(--wy-font);
    cursor:        default;
    display:       inline-flex;
    align-items:   center;
    gap:           0.4rem;
    opacity:       0.7;
}

/* ── Analysis / loading state ── */
.wy-analysis-state {
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    justify-content: center;
    min-height:      60vh;
    text-align:      center;
    gap:             0.75rem;
}

.wy-analysis-state h2 {
    font-size:   1.1rem;
    font-weight: 600;
    color:       var(--wy-teal-dark);
    margin:      0.25rem 0 0;
}

.wy-analysis-state p {
    font-size: 0.9rem;
    color:     var(--wy-teal);
    margin:    0;
}

.wy-analysis-state .wy-error-banner {
    color:       #ef4444;
    font-size:   0.9rem;
    margin-top:  0.5rem;
}

/* ── Sparkle animation (3 diamonds) ── */
.wy-sparkle {
    display:  flex;
    position: relative;
    width:    52px;
    height:   44px;
}

.wy-sparkle-diamond {
    position:   absolute;
    width:       14px;
    height:      14px;
    background:  var(--wy-teal-dark);
    transform:   rotate(45deg);
    border-radius: 2px;
    animation:  wy-sparkle-pulse 1.4s ease-in-out infinite;
}
.wy-sparkle-diamond:nth-child(1) { top: 0;   left: 10px; animation-delay: 0s;     width: 10px; height: 10px; }
.wy-sparkle-diamond:nth-child(2) { top: 15px; left: 0;   animation-delay: 0.2s; }
.wy-sparkle-diamond:nth-child(3) { top: 15px; left: 20px; animation-delay: 0.4s; width: 10px; height: 10px; }

@keyframes wy-sparkle-pulse {
    0%, 100% { opacity: 0.35; transform: rotate(45deg) scale(0.8); }
    50%       { opacity: 1;    transform: rotate(45deg) scale(1);   }
}

/* ── Wizard error banner (top of form) ── */
.wy-wizard-error-banner {
    background:    #fef2f2;
    border:        1px solid #fecaca;
    color:         #b91c1c;
    border-radius: var(--wy-radius-sm);
    padding:       0.75rem 1rem;
    font-size:     0.875rem;
    margin-bottom: 1.25rem;
    display:       none;
}
.wy-wizard-error-banner.wy-visible { display: block; }

/* ── Wizard responsive ── */
@media (max-width: 768px) {
    .wy-wizard-header {
        padding:    1rem;
        gap:        1rem;
        flex-wrap:  wrap;
    }
    .wy-wizard-connector { display: none; }
    .wy-wizard-step-sub  { display: none; }
    .wy-wizard-body      { padding: 0 1rem 2rem; margin-top: 1.5rem; }
}

@media (max-width: 480px) {
    .wy-wizard-step-labels { display: none; }
    .wy-wizard-steps       { gap: 0.5rem; }
}

/* ═══════════════════════════════════════════════════════════════
   Curate Resources — Step 2
   ═══════════════════════════════════════════════════════════════ */

/* ── Step indicator: done state (checkmark) ── */
.wy-wizard-step--done .wy-wizard-step-circle {
    background:   var(--wy-teal);
    border-color: var(--wy-teal);
    color:        #fff;
}

/* ── Curate page body ── */
.wy-curate-body {
    max-width:  1100px;
    margin:     2rem auto;
    padding:    0 1.5rem 3rem;
}

.wy-curate-heading {
    font-size:   1.1rem;
    font-weight: 700;
    color:       var(--wy-text);
    margin:      0 0 1.25rem;
}

/* ── Tab bar ── */
.wy-curate-tabs {
    display:       flex;
    gap:           0;
    border-bottom: 2px solid var(--wy-border);
    margin-bottom: 1.25rem;
}

.wy-curate-tab {
    display:         flex;
    align-items:     center;
    gap:             0.45rem;
    padding:         0.6rem 1.1rem;
    font-size:       0.875rem;
    font-weight:     500;
    color:           var(--wy-text-muted);
    cursor:          pointer;
    border-bottom:   3px solid transparent;
    margin-bottom:   -2px;
    background:      none;
    border-top:      none;
    border-left:     none;
    border-right:    none;
    font-family:     var(--wy-font);
    transition:      color 0.15s, border-color 0.15s;
    white-space:     nowrap;
}

.wy-curate-tab:hover { color: var(--wy-text); }

.wy-curate-tab--active {
    color:        var(--wy-teal);
    border-bottom-color: var(--wy-teal);
    font-weight:  600;
}

.wy-curate-tab-icon {
    opacity: 0.6;
}
.wy-curate-tab--active .wy-curate-tab-icon { opacity: 1; }

.wy-curate-tab-count {
    display:       inline-flex;
    align-items:   center;
    justify-content: center;
    min-width:     22px;
    height:        18px;
    padding:       0 5px;
    border-radius: 9px;
    background:    var(--wy-teal-light);
    color:         var(--wy-teal-dark);
    font-size:     0.72rem;
    font-weight:   600;
}

/* ── Tab panels ── */
.wy-curate-panel { display: none; }
.wy-curate-panel--active { display: block; }

/* ── Resource table (reuses existing .wy-guide-table styles, adds row-level actions) ── */
.wy-curate-table-wrap { overflow-x: auto; }

.wy-curate-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
}

.wy-curate-table thead th {
    text-align:    left;
    padding:       0.6rem 0.75rem;
    font-size:     0.8rem;
    font-weight:   600;
    color:         var(--wy-text-muted);
    border-bottom: 1.5px solid var(--wy-border);
    white-space:   nowrap;
}

.wy-curate-table tbody td {
    padding:       0.65rem 0.75rem;
    border-bottom: 1px solid var(--wy-border);
    vertical-align: middle;
    color:         var(--wy-text);
}

.wy-curate-table tbody tr:last-child td { border-bottom: none; }

.wy-curate-table tbody tr:hover td { background: #fafafa; }

.wy-curate-table .wy-col-title { width: 30%; }
.wy-curate-table .wy-col-actions {
    width:      80px;
    text-align: right;
    white-space: nowrap;
}

.wy-curate-row-being-deleted { opacity: 0.4; pointer-events: none; }

/* Action icon buttons (delete / view / add) */
.wy-row-action-btn {
    display:       inline-flex;
    align-items:   center;
    justify-content: center;
    width:         28px;
    height:        28px;
    border-radius: 6px;
    border:        none;
    background:    transparent;
    cursor:        pointer;
    padding:       0;
    transition:    background 0.15s;
}
.wy-row-action-btn--delete { color: #ef4444; }
.wy-row-action-btn--delete:hover { background: #fef2f2; }
.wy-row-action-btn--view   { color: var(--wy-teal); }
.wy-row-action-btn--view:hover { background: var(--wy-teal-light); }
.wy-row-action-btn--add    { color: var(--wy-teal); }
.wy-row-action-btn--add:hover { background: var(--wy-teal-light); }

/* Pagination (shared with guide page, re-declared for curate context) */
.wy-curate-pagination {
    display:         flex;
    align-items:     center;
    justify-content: flex-end;
    gap:             0.5rem;
    padding:         0.6rem 0.75rem;
    font-size:       0.8rem;
    color:           var(--wy-text-muted);
    border-top:      1px solid var(--wy-border);
}

/* ── Add More Resources panel ── */
.wy-search-panel {
    background:    var(--wy-card-bg);
    border:        1.5px solid var(--wy-border);
    border-radius: var(--wy-radius);
    padding:       1.25rem 1.5rem;
    margin-top:    1.5rem;
}

.wy-search-panel-title {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    font-size:   0.95rem;
    font-weight: 600;
    color:       var(--wy-text);
    margin:      0 0 0.2rem;
}

.wy-search-panel-hint {
    font-size:   0.8rem;
    color:       var(--wy-teal);
    margin:      0 0 1rem;
}

.wy-search-row {
    display: flex;
    gap:     0.75rem;
}

.wy-search-input {
    flex:        1;
    padding:     0.6rem 0.9rem;
    font-size:   0.9rem;
    font-family: var(--wy-font);
    border:      1.5px solid var(--wy-border);
    border-radius: var(--wy-radius-sm);
    color:       var(--wy-text);
    outline:     none;
    transition:  border-color 0.15s;
}
.wy-search-input:focus {
    border-color: var(--wy-teal);
    box-shadow:   0 0 0 3px rgba(58,125,110,0.12);
}

.wy-search-btn {
    padding:       0.6rem 1.25rem;
    background:    var(--wy-card-bg);
    border:        1.5px solid var(--wy-border);
    border-radius: var(--wy-radius-sm);
    font-size:     0.875rem;
    font-weight:   500;
    font-family:   var(--wy-font);
    color:         var(--wy-text);
    cursor:        pointer;
    transition:    border-color 0.15s, color 0.15s;
    white-space:   nowrap;
}
.wy-search-btn:hover {
    border-color: var(--wy-teal);
    color:        var(--wy-teal);
}
.wy-search-btn:disabled {
    opacity: 0.5;
    cursor:  default;
}

/* Search results area */
.wy-search-results {
    margin-top: 1.25rem;
    display:    none;
}
.wy-search-results--visible { display: block; }

.wy-search-results-heading {
    font-size:   0.8rem;
    font-weight: 600;
    color:       var(--wy-text-muted);
    text-transform: uppercase;
    letter-spacing: 0.04em;
    margin:      0 0 0.75rem;
}

.wy-search-no-results {
    font-size:  0.875rem;
    color:      var(--wy-text-hint);
    padding:    1rem 0;
    text-align: center;
}

/* ── Bottom actions ── */
.wy-curate-actions {
    display:         flex;
    justify-content: flex-start;
    margin-top:      2rem;
    padding-top:     1.5rem;
    border-top:      1px solid var(--wy-border);
}

/* ── Curate loading overlay ── */
.wy-curate-loading {
    display:         flex;
    flex-direction:  column;
    align-items:     center;
    justify-content: center;
    min-height:      60vh;
    text-align:      center;
    gap:             0.75rem;
}
.wy-curate-loading h2 {
    font-size:   1.1rem;
    font-weight: 600;
    color:       var(--wy-teal-dark);
    margin:      0.25rem 0 0;
}
.wy-curate-loading p {
    font-size: 0.9rem;
    color:     var(--wy-teal);
    margin:    0;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .wy-curate-body  { padding: 0 1rem 2rem; margin-top: 1rem; }
    .wy-curate-tab   { padding: 0.5rem 0.75rem; font-size: 0.8rem; }
    .wy-search-row   { flex-direction: column; }
}

/* ═══════════════════════════════════════════════════════════════
   Review and Edit — Step 3
   ═══════════════════════════════════════════════════════════════ */

/* ── Review page body ── */
.wy-review-body {
    max-width:  960px;
    margin:     2rem auto;
    padding:    0 1.5rem 4rem;
}

/* ── Block card ── */
.wy-block-card {
    background:    var(--wy-card-bg);
    border:        1.5px solid var(--wy-border);
    border-radius: var(--wy-radius);
    margin-bottom: 1rem;
    overflow:      hidden;
    transition:    opacity 0.2s, border-color 0.2s;
}

.wy-block-card--hidden {
    opacity:       0.45;
    border-style:  dashed;
}

.wy-block-card--dragging {
    box-shadow: 0 8px 24px rgba(0,0,0,0.12);
    border-color: var(--wy-teal);
    z-index: 50;
}

/* ── Block header bar ── */
.wy-block-header {
    display:         flex;
    align-items:     center;
    justify-content: space-between;
    padding:         0.55rem 0.85rem 0.55rem 0.6rem;
    background:      #f7f8f8;
    border-bottom:   1px solid var(--wy-border);
    gap:             0.5rem;
    min-height:      38px;
}

.wy-block-header-left {
    display:     flex;
    align-items: center;
    gap:         0.5rem;
    min-width:   0;
}

.wy-block-handle {
    color:      var(--wy-text-hint);
    cursor:     grab;
    flex-shrink: 0;
    display:    flex;
    align-items: center;
    padding:    2px;
    border-radius: 4px;
    transition: color 0.15s, background 0.15s;
}
.wy-block-handle:hover { color: var(--wy-text-muted); background: var(--wy-border); }
.wy-block-card--title .wy-block-handle { cursor: default; opacity: 0.3; pointer-events: none; }

.wy-block-label {
    font-size:   0.8rem;
    font-weight: 500;
    color:       var(--wy-text-muted);
    white-space: nowrap;
    overflow:    hidden;
    text-overflow: ellipsis;
}
.wy-block-card--hidden .wy-block-label { text-decoration: line-through; }

.wy-block-header-right {
    display:     flex;
    align-items: center;
    gap:         0.1rem;
    flex-shrink: 0;
}

.wy-save-indicator {
    font-size:   0.72rem;
    color:       var(--wy-text-hint);
    margin-right: 0.4rem;
    min-width:   36px;
    text-align:  right;
}
.wy-save-indicator--saving { color: var(--wy-text-hint); }
.wy-save-indicator--saved  { color: var(--wy-teal); }
.wy-save-indicator--error  { color: #ef4444; }

/* ── Block action icon buttons ── */
.wy-block-action-btn {
    display:       inline-flex;
    align-items:   center;
    justify-content: center;
    width:         28px;
    height:        28px;
    border-radius: 6px;
    border:        none;
    background:    transparent;
    cursor:        pointer;
    padding:       0;
    color:         var(--wy-text-hint);
    transition:    color 0.15s, background 0.15s;
}
.wy-block-action-btn:hover             { background: var(--wy-teal-light); color: var(--wy-teal); }
.wy-block-action-btn--delete:hover     { background: #fef2f2; color: #ef4444; }
.wy-block-action-btn--delete           { color: #f87171; }
.wy-block-action-btn--hidden-active    { color: var(--wy-teal); }

/* ── Block content area ── */
.wy-block-content {
    padding: 0;
}

/* Title block content */
.wy-review-title {
    font-size:   1.6rem;
    font-weight: 700;
    color:       var(--wy-text);
    margin:      0;
    padding:     1rem 1.25rem;
    line-height: 1.3;
}

/* ── Quill editor in review blocks ── */
.wy-block-editor-wrap .ql-toolbar.ql-snow {
    border:      none;
    border-bottom: 1px solid var(--wy-border);
    background:  #fcfcfc;
    font-family: var(--wy-font);
    padding:     6px 10px;
}
.wy-block-editor-wrap .ql-container.ql-snow {
    border:      none;
    font-family: var(--wy-font);
    font-size:   0.9rem;
    color:       var(--wy-text);
}
.wy-block-editor-wrap .ql-editor {
    min-height:  80px;
    padding:     0.9rem 1.1rem;
    line-height: 1.7;
}
.wy-block-editor-wrap .ql-editor p   { margin-bottom: 0.5em; }
.wy-block-editor-wrap .ql-editor h2  { font-size: 1.25rem; font-weight: 700; margin: 0.75em 0 0.35em; color: var(--wy-text); }
.wy-block-editor-wrap .ql-editor h3  { font-size: 1.05rem; font-weight: 600; margin: 0.6em 0 0.3em; color: var(--wy-text); }
.wy-block-editor-wrap .ql-editor ul,
.wy-block-editor-wrap .ql-editor ol  { padding-left: 1.5rem; margin-bottom: 0.5em; }
.wy-block-editor-wrap .ql-snow .ql-stroke { stroke: var(--wy-text-muted); }
.wy-block-editor-wrap .ql-snow .ql-fill   { fill:   var(--wy-text-muted); }
.wy-block-editor-wrap .ql-snow.ql-toolbar button:hover .ql-stroke,
.wy-block-editor-wrap .ql-snow.ql-toolbar button.ql-active .ql-stroke { stroke: var(--wy-teal); }
.wy-block-editor-wrap .ql-snow.ql-toolbar button:hover .ql-fill,
.wy-block-editor-wrap .ql-snow.ql-toolbar button.ql-active .ql-fill   { fill:   var(--wy-teal); }

/* ── Resource table in review blocks (no toolbar, row delete) ── */
.wy-block-resource-table {
    width:           100%;
    border-collapse: collapse;
    font-size:       0.875rem;
}
.wy-block-resource-table thead th {
    text-align:    left;
    padding:       0.55rem 0.75rem;
    font-size:     0.78rem;
    font-weight:   600;
    color:         var(--wy-text-muted);
    border-bottom: 1.5px solid var(--wy-border);
    white-space:   nowrap;
}
.wy-block-resource-table tbody td {
    padding:       0.6rem 0.75rem;
    border-bottom: 1px solid var(--wy-border);
    vertical-align: middle;
}
.wy-block-resource-table tbody tr:last-child td { border-bottom: none; }
.wy-block-resource-table tbody tr:hover td      { background: #fafafa; }
.wy-block-resource-table .wy-col-actions        { width: 70px; text-align: right; }

/* Pagination row inside review blocks */
.wy-block-resource-pagination {
    display:         flex;
    align-items:     center;
    justify-content: flex-end;
    gap:             0.4rem;
    padding:         0.5rem 0.75rem;
    font-size:       0.78rem;
    color:           var(--wy-text-muted);
    border-top:      1px solid var(--wy-border);
}

/* ── Add-block drop zone (visible between cards on hover) ── */
.wy-add-block-row {
    display:         flex;
    justify-content: center;
    padding:         0.25rem 0;
    opacity:         0;
    transition:      opacity 0.2s;
}
.wy-add-block-row:hover,
.wy-block-card:hover + .wy-add-block-row { opacity: 1; }

/* ── Bottom actions ── */
.wy-review-actions {
    display:         flex;
    justify-content: flex-start;
    margin-top:      2rem;
    padding-top:     1.5rem;
    border-top:      1px solid var(--wy-border);
    gap:             1rem;
}

/* ── Responsive ── */
@media (max-width: 768px) {
    .wy-review-body { padding: 0 1rem 3rem; margin-top: 1rem; }
    .wy-review-title { font-size: 1.3rem; }
}
