<?php require __DIR__ . '/../layouts/header.php'; ?>

<?php
$lang = function_exists('current_lang')
    ? current_lang()
    : ($_SESSION['lang'] ?? 'en');

$isRtl = $lang === 'ar';
?>

<div class="alert alert-info rounded-4">

<strong>
<?= $isRtl
    ? 'جولة التحكيم'
    : 'Review Round' ?>
:</strong>

<?= (int)($assignment['round_no'] ?? 1) ?>

</div>

<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h1 class="page-title"><?= e(trans('review_assignments')) ?></h1>

        <div class="text-muted">
            <?= e((string) ($assignment['submission_no'] ?? '')) ?>
            —
            <?= e((string) ($assignment['title'] ?? '')) ?>
        </div>
    </div>

    <a href="<?= e(base_path('reviewer/assignments')) ?>"
       class="btn btn-outline-secondary rounded-3">
        <?= e(trans('back')) ?>
    </a>
</div>

<div class="card border-0 shadow-sm rounded-4"
     dir="<?= $isRtl ? 'rtl' : 'ltr' ?>">
    <div class="card-body p-4">

        <div class="section-title">
            <span class="dot"></span>
            <h2 class="h5 mb-0">
                <?= e(trans('review_guidelines')) ?>
            </h2>
        </div>

        <div>
            <?= current_lang() === 'ar'
                ? (string) ($assignment['review_instructions_ar'] ?? '')
                : (string) ($assignment['review_instructions_en'] ?? '') ?>
        </div>

    </div>
</div>

<div class="card border-0 shadow-sm rounded-4">
    <div class="card-body p-4">

<?php

$totalCriteria=
count(
$criteria
?? []
);

?>

<div
class="
card
border-0
shadow-sm
rounded-4
review-progress-card
mb-4
"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
"
>

<div>

<div class="fw-bold">

Review Completion

</div>

<div
class="
review-autosave
"
id="autosaveStatus"
>

Autosave enabled

</div>

</div>

<div
class="
score-total
"
id="reviewPercent"
>

0%

</div>

</div>

<div
class="
progress
criteria-progress
mt-3
"
>

<div
class="
progress-bar
"
id="reviewProgress"
style="
width:0%
"
></div>

</div>

</div>

</div>

        <form id="reviewForm" 
	      action="/easychair/reviewer/submit-review"
              method="POST"
              enctype="multipart/form-data">

            <input type="hidden"
                   name="_csrf"
                   value="<?= e(csrf_token()) ?>">

            <input type="hidden"
                   name="assignment_id"
                   value="<?= e((string) $assignment['id']) ?>">

            <!-- REVIEW CRITERIA -->

<div class="mb-4">

    <div class="d-flex justify-content-between align-items-center mb-4">

        <h5 class="fw-bold mb-0">
            <i class="fa fa-star text-warning me-2"></i>
            Review Criteria
        </h5>

        <div class="badge bg-primary rounded-pill px-3 py-2">

            <?= count($criteria ?? []) ?>
            Criteria

        </div>

    </div>

    <div class="row g-3">

        <?php foreach (($criteria ?? []) as $c): ?>

            <?php

            $criterionTitle =
                $lang === 'ar'
                ? ($c['title_ar'] ?? $c['title_en'] ?? 'معيار')
                : ($c['title_en'] ?? $c['title_ar'] ?? 'Criterion');

            $maxScore =
                (float)($c['max_score'] ?? 5);

            $weight =
                (float)($c['weight'] ?? 1);

            ?>

            <div class="col-lg-6">

                <div class="card border-0 shadow-sm rounded-4 h-100 reviewer-score-card">

                    <div class="card-body p-3">

                        <div class="d-flex justify-content-between align-items-start mb-3">

                            <div>

                                <div class="fw-bold mb-1">

                                    <?= htmlspecialchars($criterionTitle) ?>

                                </div>

                                <div class="small text-muted">

                                    Weight:
                                    <?= $weight ?>

                                </div>

                            </div>

                            <div class="badge bg-light text-dark rounded-pill px-3 py-2">

                                Max:
                                <?= $maxScore ?>

                            </div>

                        </div>

                        <input
                            type="range"
                            name="criteria[<?= (int)$c['id'] ?>]"
                            class="form-range reviewer-slider criterion-input focus-review"
                            min="0"
                            max="<?= $maxScore ?>"
                            step="0.1"
                            value="<?= $maxScore / 2 ?>"
                            oninput="
                                document.getElementById(
                                    'score_<?= (int)$c['id'] ?>'
                                ).innerText = this.value
                            "
                        >

                        <div class="d-flex justify-content-between align-items-center mt-2">

                            <div class="small text-muted">

                                <?= $isRtl ? 'التقييم الحالي' : 'Current Score' ?>

                            </div>

<div class="slider-hotkey">

<?= $isRtl
?
'← → للتعديل • Enter للانتقال'
:
'← → adjust • Enter next'
?>

</div>

                            <div
                                id="score_<?= (int)$c['id'] ?>"
                                class="badge bg-success rounded-pill px-3 py-2 fs-6">

                                <?= $maxScore / 2 ?>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

        <?php endforeach; ?>

    </div>

</div>
            </div>

            <!-- META -->

            <div class="row g-3">

                <div class="col-md-6">

                    <label class="form-label fw-bold">
                        Recommendation
                    </label>

                    <select id="recommendationSelect" name="recommendation"
                            class="form-select rounded-3"
                            required>

                        <option value="accept">
    <?= $isRtl ? 'قبول' : 'Accept' ?>
</option>

<option value="minor_revision">
    <?= $isRtl ? 'تعديلات طفيفة' : 'Minor Revision' ?>
</option>

<option value="major_revision">
    <?= $isRtl ? 'تعديلات جوهرية' : 'Major Revision' ?>
</option>

<option value="reject">
    <?= $isRtl ? 'رفض' : 'Reject' ?>
</option>

                    </select>

                </div>

                <div class="col-md-6">

                    <label class="form-label fw-bold">
                        <?= e(trans('upload_review_file')) ?>
                    </label>

                    <input type="file"
                           name="review_file"
id="reviewFile"                           
class="form-control rounded-3">

                </div>

                <div class="col-md-6">

                    <label class="form-label fw-bold">
                        Comments to Author
                    </label>

                    <textarea name="comments"
                              class="form-control rounded-3"
                              rows="6"></textarea>

                </div>

                <div class="col-md-6">

                    <label class="form-label fw-bold">
                        Comments to Editor
                    </label>

                    <textarea name="comments_to_editor"
                              class="form-control rounded-3"
                              rows="6"></textarea>

                </div>

            </div>
<div
class="
card
border-0
shadow-sm
rounded-4
mt-4
review-discussion
"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<h5
class="fw-bold mb-0"
>

<i class="fa fa-comments"></i>

<?= $isRtl
?
'ملاحظات المحكّم'
:
'Reviewer Workspace'
?>

</h5>

<div
class="review-ready"
id="reviewReady"
>

0%

</div>

</div>

<div class="review-note">

<label class="fw-bold mb-2">

<?= $isRtl
?
'ملاحظات شخصية (لا تُرسل)'
:
'Private Notes (not submitted)'
?>

</label>

<textarea
id="reviewPrivateNotes"
class="form-control"
rows="4"
></textarea>

</div>

<div class="mt-4">

<label class="fw-bold mb-3">

<?= $isRtl
?
'قائمة التحقق'
:
'Review Checklist'
?>

</label>

<div>

<label class="evidence-chip">

<input
type="checkbox"
class="review-check"
>

Scope

</label>

<label class="evidence-chip">

<input
type="checkbox"
class="review-check"
>

Methods

</label>

<label class="evidence-chip">

<input
type="checkbox"
class="review-check"
>

Results

</label>

<label class="evidence-chip">

<input
type="checkbox"
class="review-check"
>

References

</label>

<label class="evidence-chip">

<input
type="checkbox"
class="review-check"
>

Language

</label>

</div>

</div>

<div
class="
upload-preview
"
id="uploadPreview"
>

No review evidence uploaded

</div>

</div>

</div>

<div
class="
card
border-0
shadow-sm
decision-card
mt-4
"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<div>

<h5 class="fw-bold mb-1">

<i class="fa fa-scale-balanced"></i>

<?= $isRtl
?
'مساعد القرار'
:
'Recommendation Assistant'
?>

</h5>

<div class="decision-help">

<?= $isRtl
?
'واجهة إرشادية فقط — القرار النهائي للمحكّم'
:
'Visual guidance only — final decision belongs to reviewer'
?>

</div>

</div>

<div
class="decision-score"
id="decisionScore"
>

0

</div>

</div>

<div class="progress criteria-progress mb-3">

<div
class="progress-bar"
id="decisionProgress"
style="width:0%"
></div>

</div>

<div
class="decision-label"
id="decisionLabel"
>

—

</div>

<div
class="decision-pill"
id="decisionReason"
>

Waiting for evaluation

</div>

<div class="mt-4">

<label class="fw-bold mb-2">

<?= $isRtl
?
'مبررات القرار (اختياري)'
:
'Decision Notes (optional)'
?>

</label>

<textarea
id="decisionNotes"
class="form-control"
rows="3"
></textarea>

</div>

</div>

</div>

<div
class="
mobile-submit-bar
gap-2
"
>

<button
type="button"
class="
btn
btn-outline-primary
flex-fill
"
id="prevCriterion"
>

←

</button>

<button
type="submit"
class="
btn
btn-success
flex-fill
"
form="reviewForm"

>

<?= $isRtl
?
'إرسال'
:
'Submit'
?>

</button>

<button
type="button"
class="
btn
btn-outline-primary
flex-fill
"
id="nextCriterion"
>

→

</button>

</div>

<div
class="
card
border-0
shadow-sm
rounded-4
deep-reading
mt-4
"
id="readingWorkspace"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<div>

<h5 class="fw-bold">

<i class="fa fa-book-open"></i>

<?= $isRtl
?
'وضع القراءة العميقة'
:
'Deep Reading'
?>

</h5>

</div>

<div
class="focus-clock"
id="focusClock"
>

25:00

</div>

</div>

<div class="mb-4">

<button
type="button"
id="toggleReading"
class="
btn
btn-outline-primary
"
>

Focus Mode

</button>

</div>

<div
class="
annotation-box
p-3
mb-4
"
>

<label class="fw-bold mb-2">

Annotations

</label>

<textarea
id="annotationBox"
class="form-control"
rows="6"
></textarea>

</div>

<div
class="
annotation-box
p-3
"
>

<label class="fw-bold mb-3">

Citation Workspace

</label>

<input
id="citationInput"
class="form-control mb-3"
>

<div
id="citationList"
></div>

</div>

</div>

</div>

<div
class="
card
border-0
shadow-sm
confidence-panel
mt-4
"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<div>

<h5 class="fw-bold">

<i class="fa fa-brain"></i>

<?= $isRtl
?
'مؤشر الثقة'
:
'Review Confidence'
?>

</h5>

<div class="workspace-note">

<?= $isRtl
?
'لا يؤثر على القرار النهائي'
:
'Does not affect final decision'
?>

</div>

</div>

<div
class="confidence-score"
id="confidenceValue"
>

50%

</div>

</div>

<div
class="
progress
confidence-progress
mb-4
"
>

<div
class="progress-bar"
id="confidenceBar"
style="width:50%"
></div>

</div>

<div class="row g-3">

<div class="col-md-6">

<div class="compare-box">

<div class="compare-label">

Strengths

</div>

<textarea
id="strengthBox"
class="form-control"
rows="5"
></textarea>

</div>

</div>

<div class="col-md-6">

<div class="compare-box">

<div class="compare-label">

Weaknesses

</div>

<textarea
id="weaknessBox"
class="form-control"
rows="5"
></textarea>

</div>

</div>

</div>

</div>

</div>            

<div
class="
card
border-0
shadow-sm
summary-card
mt-4
"
id="printReviewArea"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<div>

<h5 class="fw-bold">

<i class="fa fa-file-lines"></i>

<?= $isRtl
?
'الملخص التنفيذي'
:
'Executive Summary'
?>

</h5>

</div>

<div
class="summary-stat"
id="summaryScore"
>

0%

</div>

</div>

<div
class="
print-toolbar
mb-4
"
>

<button
type="button"
id="generateSummary"
class="
btn
btn-outline-primary
"
>

Generate

</button>

<button
type="button"
id="printReview"
class="
btn
btn-outline-success
"
>

Print

</button>

<button
type="button"
id="clearSummary"
class="
btn
btn-outline-danger
"
>

Clear

</button>

</div>

<textarea
id="executiveSummary"
class="
form-control
executive-summary
"
></textarea>

</div>

</div>

<!-- SUBMIT -->

            <div class="mt-4">

                <button type="submit"
                        class="btn btn-success rounded-3">

                    <?= e(trans('save')) ?>

                </button>

            </div>

        </form>

    </div>
</div>

<div
class="
card
border-0
shadow-sm
rounded-4
mt-4
evidence-card
"
>

<div class="card-body">

<div
class="
d-flex
justify-content-between
align-items-center
mb-4
"
>

<div>

<h5 class="fw-bold mb-1">

<i class="fa fa-folder-open"></i>

<?= $isRtl
?
'جلسة التحكيم'
:
'Review Session'
?>

</h5>

<div class="snapshot-label">

<?= $isRtl
?
'استرجاع وحفظ محلي فقط'
:
'Local recovery only'
?>

</div>

</div>

<div class="session-tools">

<button
type="button"
id="saveSnapshot"
class="
btn
btn-outline-primary
btn-sm
"
>

Save Snapshot

</button>

<button
type="button"
id="restoreSnapshot"
class="
btn
btn-outline-success
btn-sm
"
>

Restore

</button>

<button
type="button"
id="clearSnapshot"
class="
btn
btn-outline-danger
btn-sm
"
>

Clear

</button>

</div>

</div>

<div
id="snapshotStatus"
class="alert alert-light mb-0"
>

Ready

</div>

</div>

</div>

<?php if (!empty($files)): ?>

<div class="card border-0 shadow-sm rounded-4 mt-4">

    <div class="card-body p-4">

        <div class="section-title">
            <span class="dot"></span>

            <h2 class="h5 mb-0">
                <?= e(trans('review_files')) ?>
            </h2>
        </div>

        <div class="table-responsive">

            <table class="table align-middle mb-0">

                <thead>
                    <tr>
                        <th><?= e(trans('review_file')) ?></th>
                        <th>Date</th>
                    </tr>
                </thead>

                <tbody>

                    <?php foreach ($files as $f): ?>

                        <tr class="evidence-file">

                            <td>

<div class="fw-bold">

<?= e(
(string)
(
$f[
'original_filename'
]
??
''
)
) ?>

</div>

<div class="small text-muted">

<?= pathinfo(

(string)(
$f[
'original_filename'
]
??
''
),

PATHINFO_EXTENSION

) ?>

</div>

</td>

                            <td>
                                <?= e((string) ($f['created_at'] ?? '')) ?>
                            </td>

                        </tr>

                    <?php endforeach; ?>

                </tbody>

            </table>

        </div>

    </div>

</div>

<?php endif; ?>
<style>

.reviewer-score-card{
    transition:all .25s ease;
    border:1px solid rgba(0,0,0,.05);
}

.reviewer-score-card:hover{
    transform:translateY(-2px);
    box-shadow:0 12px 30px rgba(0,0,0,.08)!important;
}

.reviewer-slider{
    height:8px;
}

.reviewer-slider::-webkit-slider-thumb{
    width:20px;
    height:20px;
    border-radius:50%;
    cursor:pointer;
}

.section-title{
    display:flex;
    align-items:center;
    gap:10px;
    margin-bottom:20px;
}

.section-title .dot{
    width:12px;
    height:12px;
    border-radius:50%;
    background:#0d6efd;
}

.page-title{
    font-weight:800;
}

.review-progress-card{
position:sticky;
top:20px;
z-index:100;
}

.criteria-progress{
height:7px;
border-radius:999px;
}

.score-total{
font-size:34px;
font-weight:900;
color:#1d4ed8;
}

.review-autosave{
font-size:12px;
color:#64748b;
}

.review-discussion{
border:1px solid rgba(0,0,0,.06);
border-radius:22px;
background:#fafcff;
}

.review-note{

background:#ffffff;

color:#0f172a;

border-radius:14px;

padding:14px;

}

.evidence-chip{

display:inline-flex;

align-items:center;

gap:8px;

padding:8px 14px;

border-radius:999px;

background:#eef2ff;

color:#1e3a8a;

font-weight:700;

margin:4px;

cursor:pointer;

border:1px solid #dbe6ff;

}

.evidence-chip input{

accent-color:#2563eb;

}

.evidence-chip:hover{

background:#dbeafe;

color:#1e40af;

}

.upload-preview{

font-size:13px;

color:#334155;

margin-top:10px;

}

.review-ready{
font-size:32px;
font-weight:900;
color:#0d6efd;
}

.decision-card{
border-radius:22px;
border:1px solid rgba(13,110,253,.08);
background:linear-gradient(
180deg,
#ffffff,
#f8fbff
);
}

.decision-score{
font-size:42px;
font-weight:900;
color:#0d6efd;
}

.decision-label{
font-weight:800;
}

.decision-help{
font-size:13px;
color:#64748b;
}

.decision-pill{
display:inline-flex;
padding:8px 14px;
border-radius:999px;
background:#eef4ff;
font-weight:700;
margin-top:10px;
}

.kbd-mode{
outline:3px solid rgba(37,99,235,.25);
}

.focus-review{
scroll-margin-top:120px;
}

.mobile-submit-bar{
display:none;
}

.slider-hotkey{
font-size:12px;
color:#64748b;
margin-top:8px;
}

@media(max-width:991px){

.page-title{
font-size:24px;
}

.card-body{
padding:18px!important;
}

.score-total{
font-size:28px;
}

.decision-score{
font-size:30px;
}

.mobile-submit-bar{

display:flex;

position:fixed;

bottom:0;

left:0;

right:0;

padding:14px;

background:#fff;

box-shadow:0 -10px 30px rgba(0,0,0,.08);

z-index:999;

}

body{

padding-bottom:95px;

}

}

:focus-visible{

outline:3px solid #2563eb;

outline-offset:2px;

}

.evidence-card{
border-radius:20px;
border:1px solid rgba(0,0,0,.05);
}

.timeline-item{
padding:14px;
border-left:3px solid #2563eb;
margin-bottom:12px;
background:#fafcff;
border-radius:12px;
}

.session-tools{
display:flex;
gap:10px;
flex-wrap:wrap;
}

.snapshot-label{
font-size:12px;
color:#64748b;
}

.evidence-file{
padding:12px;
border-radius:14px;
background:#f8fafc;
margin-bottom:10px;
}

@media(max-width:768px){

.timeline-item{
padding:10px;
}

}

.decision-pill{

display:inline-flex;

padding:8px 14px;

border-radius:999px;

background:#eef2ff;

color:#1e3a8a;

font-weight:700;

margin-top:10px;

border:1px solid #dbe6ff;

}

.deep-reading{

background:#fcfcfd;

}

.deep-reading-active{

background:#ffffff;

max-width:1400px;

margin:auto;

}

.annotation-box{

background:#fff;

border-radius:20px;

border:1px solid #e2e8f0;

}

.citation-chip{

background:#eef2ff;

color:#1e3a8a;

padding:8px 12px;

border-radius:999px;

display:inline-block;

margin:4px;

}

.focus-clock{

font-size:30px;

font-weight:900;

color:#2563eb;

}

@media(max-width:768px){

.focus-clock{

font-size:22px;

}

}

.confidence-panel{

border-radius:24px;

background:linear-gradient(
180deg,
#ffffff,
#f8fbff
);

}

.confidence-score{

font-size:40px;

font-weight:900;

color:#2563eb;

}

.compare-box{

border-radius:16px;

background:#ffffff;

border:1px solid #e5e7eb;

padding:16px;

}

.compare-label{

font-size:13px;

font-weight:800;

color:#475569;

}

.confidence-progress{

height:8px;

border-radius:999px;

}

.workspace-note{

font-size:13px;

color:#64748b;

}

.summary-card{

border-radius:24px;

background:
linear-gradient(
180deg,
#ffffff,
#f8fbff
);

}

.executive-summary{

min-height:180px;

}

.print-mode{

max-width:1200px;

margin:auto;

background:#fff;

}

.print-toolbar{

display:flex;

gap:10px;

flex-wrap:wrap;

}

.summary-stat{

font-size:32px;

font-weight:900;

color:#2563eb;

}

@media print{

.mobile-submit-bar,

.print-toolbar,

button{

display:none!important;

}

body{

background:#fff!important;

}

}


</style>
<script>

(function(){

const KEY=
"easychair_review_form";

const form=
document.querySelector(
"form"
);

if(
!form
){
return;
}

const fields=
form.querySelectorAll(
"[name]"
);

function restore(){

try{

const data=
JSON.parse(

localStorage
.getItem(
KEY
)

||

"{}"

);

fields.forEach(

f=>{

if(

data[
f.name
]

!==undefined

){

if(
f.type
===
'file'
){
return;
}

f.value=
data[
f.name
];

}

}

);

}catch(e){}

}

function persist(){

let x={};

fields.forEach(

f=>{

if(
f.type
===
'file'
){
return;
}

x[
f.name
]
=
f.value;

}

);

localStorage.setItem(

KEY,

JSON.stringify(
x
)

);

let st=
document.getElementById(
'autosaveStatus'
);

if(
st
){

st.innerHTML=
'Draft saved';

}

update();

}

function update(){

let total=0;

let done=0;

document
.querySelectorAll(
'.criterion-input'
)
.forEach(

(
x
)=>{

total++;

if(
x.value
!==''
){

done++;

}

let score=
document.getElementById(

'score_'

+

x.name
.match(
/\d+/
)?.[0]

);

if(
score
){

score.innerHTML=
x.value;

}

}

);

let pct=
total
?

Math.round(
(
done
/
total
)
*
100
)

:

0;

let p=
document
.getElementById(
'reviewPercent'
);

if(
p
){

p.innerHTML=
pct
+
'%';

}

let pb=
document
.getElementById(
'reviewProgress'
);

if(
pb
){

pb.style.width=
pct
+
'%';

}

}

restore();

fields.forEach(

f=>{

f.addEventListener(

'input',

persist

);

}

);

update();

form.addEventListener(

'submit',

()=>{

localStorage.removeItem(
KEY
);

}

);

})();

</script>

<script>

(function(){

const NOTES=
"easychair_private_review";

const note=
document.getElementById(
'reviewPrivateNotes'
);

if(note){

note.value=

localStorage
.getItem(
NOTES
)

||

'';

note.addEventListener(

'input',

()=>{

localStorage
.setItem(
NOTES,
note.value
);

}

);

}

const file=
document.getElementById(
'reviewFile'
);

if(file){

file.addEventListener(

'change',

()=>{

const p=
document.getElementById(
'uploadPreview'
);

if(
p
&&
file.files[0]
){

p.innerHTML=

'Selected: '

+

file.files[0].name;

}

}

);

}

function calc(){

const all=
document.querySelectorAll(
'.review-check'
);

let done=0;

all.forEach(

x=>{

if(
x.checked
){

done++;

}

}

);

const pct=

all.length

?

Math.round(
(
done
/
all.length
)
*
100
)

:

0;

let r=
document.getElementById(
'reviewReady'
);

if(
r
){

r.innerHTML=
pct
+
'%';

}

}

document
.querySelectorAll(
'.review-check'
)
.forEach(

x=>

x.addEventListener(
'change',
calc
)

);

calc();

})();

</script>

<script>

(function(){

const sliders=
document.querySelectorAll(
'.criterion-input'
);

const label=
document.getElementById(
'decisionLabel'
);

const score=
document.getElementById(
'decisionScore'
);

const progress=
document.getElementById(
'decisionProgress'
);

const reason=
document.getElementById(
'decisionReason'
);

const select=
document.getElementById(
'recommendationSelect'
);

const notes=
document.getElementById(
'decisionNotes'
);

const KEY=
"easychair_decision_notes";

if(
notes
){

notes.value=
localStorage.getItem(
KEY
)
||
'';

notes.addEventListener(
'input',
()=>{

localStorage.setItem(
KEY,
notes.value

);

}

);

}

function evaluate(){

let total=0;

let count=0;

sliders.forEach(

s=>{

total+=
Number(
s.value
||
0
);

count++;

}

);

let avg=
count
?

Math.round(
(
total
/
count
)
*
10
)

:

0;

if(score){

score.innerHTML=
avg;

}

if(progress){

progress.style.width=
Math.min(
100,
avg
)
+
'%';

}

let txt='';

let rec='';

if(avg>=85){

txt='Strong Accept';

rec='High confidence';

}

else if(avg>=70){

txt='Minor Revision';

rec='Strong paper with refinements';

}

else if(avg>=50){

txt='Major Revision';

rec='Needs substantial improvement';

}

else{

txt='Reject';

rec='Insufficient readiness';

}

if(label){

label.innerHTML=
txt;

}

if(reason){

reason.innerHTML=
rec;

}

if(select){

if(
select.value
===''

||

select.dataset.auto
!=='0'
){

const map={

'Strong Accept':'accept',

'Minor Revision':'minor_revision',

'Major Revision':'major_revision',

'Reject':'reject'

};

select.value=
map[txt];

}

}

}

sliders.forEach(

x=>

x.addEventListener(
'input',
evaluate
)

);

if(select){

select.addEventListener(
'change',
()=>{

select.dataset.auto='0';

}

);

}

evaluate();

})();

</script>

<script>

(function(){

const sliders=
[
...
document.querySelectorAll(
'.criterion-input'
)
];

if(
!sliders.length
){
return;
}

let current=0;

function focusAt(i){

if(
i<0
||
i>=sliders.length
){
return;
}

current=i;

sliders.forEach(
s=>
s.classList.remove(
'kbd-mode'
)
);

let x=
sliders[i];

x.classList.add(
'kbd-mode'
);

x.focus();

x.scrollIntoView({

behavior:'smooth',

block:'center'

});

}

function move(delta){

focusAt(
current
+
delta
);

}

sliders.forEach(

(
s,
i
)=>{

s.addEventListener(

'focus',

()=>{

current=i;

}

);

s.addEventListener(

'keydown',

e=>{

let step=
Number(
s.step
||
1
);

let val=
Number(
s.value
||
0
);

let mx=
Number(
s.max
||
100
);

if(
e.key
==='ArrowRight'
){

e.preventDefault();

s.value=
Math.min(
mx,
val+step
);

s.dispatchEvent(
new Event(
'input'
)
);

}

if(
e.key
==='ArrowLeft'
){

e.preventDefault();

s.value=
Math.max(
0,
val-step
);

s.dispatchEvent(
new Event(
'input'
)
);

}

if(
e.key
==='Enter'
){

e.preventDefault();

move(1);

}

}

);

}

);

document
.getElementById(
'nextCriterion'
)
?.addEventListener(

'click',

()=>{

move(1);

}

);

document
.getElementById(
'prevCriterion'
)
?.addEventListener(

'click',

()=>{

move(-1);

}

);

focusAt(0);

})();

</script>

<script>

(function(){

const KEY=
"easychair_review_snapshot";

const form=
document.querySelector(
"#reviewForm"
);

if(
!form
){
return;
}

const status=
document.getElementById(
'snapshotStatus'
);

function collect(){

let x={};

form
.querySelectorAll(
'[name]'
)
.forEach(

f=>{

if(
f.type
!=='file'
){

x[
f.name
]
=
f.value;

}

}

);

return x;

}

function apply(data){

Object
.keys(
data
)
.forEach(

k=>{

let el=
form.querySelector(
'[name="'+k+'"]'
);

if(
el
){

el.value=
data[
k
];

el.dispatchEvent(
new Event(
'input'
)
);

}

}

);

}

document
.getElementById(
'saveSnapshot'
)
?.addEventListener(

'click',

()=>{

localStorage
.setItem(

KEY,

JSON.stringify(
collect()
)

);

if(
status
){

status.innerHTML=
'Snapshot saved';

}

}

);

document
.getElementById(
'restoreSnapshot'
)
?.addEventListener(

'click',

()=>{

try{

apply(

JSON.parse(

localStorage
.getItem(
KEY
)

||

'{}'

)

);

if(
status
){

status.innerHTML=
'Recovered';

}

}catch(e){}

}

);

document
.getElementById(
'clearSnapshot'
)
?.addEventListener(

'click',

()=>{

localStorage
.removeItem(
KEY
);

if(
status
){

status.innerHTML=
'Cleared';

}

}

);

})();

</script>

<script>

(function(){

const KEY='review_notes';

const cite='review_citations';

const box=
document.getElementById(
'annotationBox'
);

if(box){

box.value=
localStorage.getItem(
KEY
)
||
'';

box.addEventListener(

'input',

()=>{

localStorage.setItem(
KEY,
box.value
);

}

);

}

const input=
document.getElementById(
'citationInput'
);

const list=
document.getElementById(
'citationList'
);

function render(){

let arr=
JSON.parse(
localStorage.getItem(
cite
)
||
'[]'
);

if(list){

list.innerHTML='';

arr.forEach(

x=>{

list.innerHTML+=
'<span class="citation-chip">'+
x+
'</span>';

}

);

}

}

input?.addEventListener(

'keydown',

e=>{

if(
e.key==='Enter'
){

e.preventDefault();

let arr=
JSON.parse(
localStorage.getItem(
cite
)
||
'[]'
);

arr.push(
input.value
);

localStorage.setItem(
cite,
JSON.stringify(
arr
)
);

input.value='';

render();

}

}

);

render();

let t=1500;

setInterval(

()=>{

t--;

let m=
String(
Math.floor(
t/60
)
).padStart(
2,
'0'
);

let s=
String(
t%60
).padStart(
2,
'0'
);

let c=
document.getElementById(
'focusClock'
);

if(c){

c.innerHTML=
m+
':'+
s;

}

},

1000

);

document
.getElementById(
'toggleReading'
)
?.addEventListener(

'click',

()=>{

document
.getElementById(
'readingWorkspace'
)
?.classList
.toggle(
'deep-reading-active'
);

}

);

})();

</script>

<script>

(function(){

const STORE=
'review_confidence';

const sliders=
[
...
document.querySelectorAll(
'.criterion-input'
)
];

const fields=[
'strengthBox',
'weaknessBox'
];

fields.forEach(

id=>{

let el=
document.getElementById(
id
);

if(
!el
){
return;
}

el.value=
localStorage.getItem(
STORE+
id
)
||
'';

el.addEventListener(

'input',

()=>{

localStorage.setItem(
STORE+
id,
el.value
);

update();

}

);

}

);

function calc(){

let total=0;

let max=0;

sliders.forEach(

s=>{

total+=
Number(
s.value
||
0
);

max+=
Number(
s.max
||
100
);

}

);

return max
?
Math.round(
(
total
/
max
)
*
100
)
:
50;

}

function update(){

let score=
calc();

let txt=
0;

fields.forEach(

id=>{

let el=
document.getElementById(
id
);

if(
el
){

txt+=
el.value
.length;

}

}

);

if(
txt>250
){

score=
Math.min(
100,
score+10
);

}

let v=
document.getElementById(
'confidenceValue'
);

if(v){

v.innerHTML=
score+
'%';

}

let b=
document.getElementById(
'confidenceBar'
);

if(b){

b.style.width=
score+
'%';

}

}

sliders.forEach(

x=>

x.addEventListener(
'input',
update
)

);

update();

})();

</script>

<script>

(function(){

const KEY=
"review_summary";

const summary=
document.getElementById(
'executiveSummary'
);

if(
!summary
){
return;
}

summary.value=

localStorage
.getItem(
KEY
)

||

'';

summary.addEventListener(

'input',

()=>{

localStorage.setItem(
KEY,
summary.value
);

}

);

function avg(){

let total=0;

let max=0;

document
.querySelectorAll(
'.criterion-input'
)
.forEach(

s=>{

total+=
Number(
s.value
||
0
);

max+=
Number(
s.max
||
100
);

}

);

return max
?

Math.round(
(
total
/
max
)
*
100
)

:

0;

}

document
.getElementById(
'generateSummary'
)
?.addEventListener(

'click',

()=>{

let pct=
avg();

document
.getElementById(
'summaryScore'
)
.innerHTML=
pct+
'%';

let rec=
document
.querySelector(
'#recommendationSelect'
)
?.value

||

'';

summary.value=

'Overall assessment: '

+

pct

+

'%. '

+

'Recommendation: '

+

rec

+

'. '

+

'Strengths, weaknesses and reviewer rationale should be summarized here.';

summary.dispatchEvent(
new Event(
'input'
)
);

}

);

document
.getElementById(
'printReview'
)
?.addEventListener(

'click',

()=>{

document.body
.classList
.add(
'print-mode'
);

window.print();

document.body
.classList
.remove(
'print-mode'
);

}

);

document
.getElementById(
'clearSummary'
)
?.addEventListener(

'click',

()=>{

summary.value='';

localStorage.removeItem(
KEY
);

}

);

})();

</script>

<?php require __DIR__ . '/../layouts/footer.php'; ?>

<!-- PACK740 -->

<style id="pack740_review_surface_fix">

/* lock whole review page */

body,
main,
.content,
.container,
.container-fluid{

background:
#07131c
!important;

}

/* freeze cards */

.card,
.review-card,
.review-block,
.review-panel,
.review-section,
fieldset{

background:
#0b1724
!important;

border:
1px solid
rgba(70,110,150,.28)
!important;

border-radius:
18px
!important;

box-shadow:
none
!important;

transition:
none
!important;

}

/* kill hover inversion */

.card:hover,
.review-card:hover,
.review-block:hover,
.review-panel:hover,
.review-section:hover,
fieldset:hover{

background:
#0b1724
!important;

transform:
none
!important;

}

/* stable textarea */

textarea,
input,
select,
.form-control,
.form-select{

background:
#0d1a2b
!important;

color:
#edf3ff
!important;

border:
1px solid
#28435d
!important;

transition:
none
!important;

}

/* freeze hover */

textarea:hover,
textarea:focus,
input:hover,
input:focus,
select:hover,
select:focus,
.form-control:hover,
.form-control:focus{

background:
#0d1a2b
!important;

color:
#ffffff
!important;

border-color:
#3b82f6
!important;

box-shadow:
none
!important;

outline:
none
!important;

}

/* labels */

label,
h1,
h2,
h3,
h4,
h5,
h6{

color:
#f4f8ff
!important;

}

/* checklist pills */

.badge,
.btn-outline-primary{

background:
#132235
!important;

color:
#dce9ff
!important;

}

/* review criteria */

.row.g-3{

display:grid
!important;

grid-template-columns:
repeat(
3,
1fr
)
!important;

gap:
18px
!important;

}

@media(max-width:1300px){

.row.g-3{

grid-template-columns:
repeat(
2,
1fr
)
!important;

}

}

@media(max-width:900px){

.row.g-3{

grid-template-columns:
1fr
!important;

}

}

/* remove weird white strips */

hr,
.progress,
.progress-bar{

filter:none!important;

}

</style>

<!-- END PACK740 -->


<!-- PACK741 -->

<style id="pack741_easychair_pro">

:root{

--bg:#eef3f8;

--card:#ffffff;

--line:#d8e1ec;

--text:#10243b;

--muted:#60748b;

--primary:#2563eb;

}

body,
.container,
.container-fluid{

background:
var(--bg)
!important;

}

/* remove huge spacing */

.card,
.review-card,
.review-panel,
.review-section,
fieldset{

background:
var(--card)
!important;

border:
1px solid
var(--line)
!important;

border-radius:
14px
!important;

padding:
16px
!important;

margin-bottom:
14px
!important;

box-shadow:
0 2px 10px rgba(0,0,0,.04)
!important;

}

/* review criteria width */

.review-criteria,
.row.g-3{

display:
grid
!important;

grid-template-columns:
repeat(
4,
minmax(260px,1fr)
)
!important;

gap:
14px
!important;

align-items:start
!important;

}

@media(max-width:1500px){

.review-criteria,
.row.g-3{

grid-template-columns:
repeat(
3,
1fr
)
!important;

}

}

@media(max-width:1100px){

.review-criteria,
.row.g-3{

grid-template-columns:
repeat(
2,
1fr
)
!important;

}

}

@media(max-width:700px){

.review-criteria,
.row.g-3{

grid-template-columns:
1fr
!important;

}

}

/* criteria cards */

.review-criteria .card{

min-height:
170px
!important;

}

/* text */

body,
label,
span,
div,
p{

color:
var(--text)
!important;

}

small{

color:
var(--muted)
!important;

}

/* inputs */

textarea,
input,
select,
.form-control{

background:
#ffffff
!important;

color:
#0f172a
!important;

border:
1px solid
#c9d5e4
!important;

border-radius:
10px
!important;

}

/* compact */

textarea{

min-height:
120px
!important;

}

/* NO COLOR CHANGE */

textarea:hover,
textarea:focus,
input:hover,
input:focus,
select:hover,
select:focus{

background:
#ffffff
!important;

color:
#0f172a
!important;

border-color:
var(--primary)
!important;

box-shadow:
0 0 0 2px rgba(37,99,235,.12)
!important;

}

/* completion */

.progress{

height:
10px
!important;

border-radius:
999px
!important;

background:
#dfe8f2
!important;

}

.progress-bar{

background:
linear-gradient(
90deg,
#2563eb,
#3b82f6
)
!important;

}

/* checklist */

.badge,
.btn-outline-primary{

background:
#f5f8fc
!important;

color:
#24476d
!important;

border:
1px solid
#d7e1ef
!important;

}

/* buttons */

.btn{

border-radius:
10px
!important;

}

</style>

<!-- END PACK741 -->


<!-- PACK742 -->

<style id="pack742_workspace">

:root{

--bg:#f6f8fb;
--card:#ffffff;
--line:#dce6f2;
--text:#15263a;
--muted:#64748b;
--blue:#2563eb;

}

html,
body{

background:
var(--bg)
!important;

}

/* FULL PAGE */

.container,
.container-fluid,
main{

max-width:
100%
!important;

width:
100%
!important;

padding:
12px 18px
!important;

}

/* PANELS */

.card,
.review-panel,
.review-section,
.review-block,
fieldset{

background:
var(--card)
!important;

border:
1px solid
var(--line)
!important;

border-radius:
16px
!important;

padding:
18px
!important;

margin:
0 0 14px 0
!important;

}

/* REVIEW CRITERIA */

.review-criteria,
.criteria-grid,
.row.g-3{

display:
grid
!important;

grid-template-columns:
repeat(
4,
1fr
)
!important;

gap:
12px
!important;

align-items:
stretch
!important;

}

/* CRITERIA CARD */

.review-criteria > *,
.criteria-grid > *,
.row.g-3 > *{

min-width:
0
!important;

height:
100%
!important;

}

.review-criteria .card{

min-height:
180px
!important;

display:
flex
!important;

flex-direction:
column
!important;

justify-content:
space-between
!important;

}

/* SCORE SLIDER */

input[type=range]{

width:
100%
!important;

}

/* TEXT */

body,
label,
div,
span{

color:
var(--text)
!important;

}

small{

color:
var(--muted)
!important;

}

/* INPUTS */

textarea,
input,
select{

width:
100%
!important;

background:
#fff
!important;

color:
#0f172a
!important;

border:
1px solid
#cfd9e6
!important;

border-radius:
10px
!important;

}

/* COMMENTS */

textarea{

min-height:
140px
!important;

}

/* REMOVE HOVER FLASH */

textarea:hover,
textarea:focus,
input:hover,
input:focus,
select:hover,
select:focus{

background:
#fff
!important;

color:
#111827
!important;

border-color:
var(--blue)
!important;

box-shadow:
0 0 0 2px rgba(37,99,235,.10)
!important;

}

/* RESPONSIVE */

@media(max-width:1600px){

.review-criteria,
.criteria-grid,
.row.g-3{

grid-template-columns:
repeat(
3,
1fr
)
!important;

}

}

@media(max-width:1200px){

.review-criteria,
.criteria-grid,
.row.g-3{

grid-template-columns:
repeat(
2,
1fr
)
!important;

}

}

@media(max-width:800px){

.review-criteria,
.criteria-grid,
.row.g-3{

grid-template-columns:
1fr
!important;

}

}

</style>

<!-- END PACK742 -->



<!-- Pack UI EasyChair/EDAS redesign -->

<style>
:root{
--ec-primary:#1e5eff;
--ec-primary-2:#5b7cff;
--ec-bg:#f3f7fc;
--ec-card:#ffffff;
--ec-text:#0f172a;
--ec-muted:#64748b;
--ec-border:#dbe7f6;
--ec-radius:28px;
}
body{
background:
radial-gradient(circle at top,#f7fbff 0,#eef5fd 45%,#f5f7fb 100%);
}
.page-title{
font-size:2.2rem!important;
letter-spacing:-.03em;
color:var(--ec-text);
}
.card{
background:rgba(255,255,255,.88)!important;
backdrop-filter:blur(18px);
border:1px solid rgba(220,230,244,.9)!important;
border-radius:var(--ec-radius)!important;
box-shadow:0 12px 44px rgba(15,23,42,.06)!important;
overflow:hidden;
}
.card:hover{
transform:translateY(-2px);
transition:.25s ease;
}
.reviewer-score-card{
background:linear-gradient(180deg,#fff,#fbfdff)!important;
min-height:240px;
}
.reviewer-score-card .card-body{
display:flex;
flex-direction:column;
justify-content:space-between;
}
.form-control,.form-select{
border-radius:18px!important;
border:1px solid var(--ec-border)!important;
padding:14px 18px!important;
background:#fff!important;
}
.form-control:focus,.form-select:focus{
box-shadow:0 0 0 5px rgba(30,94,255,.10)!important;
border-color:var(--ec-primary)!important;
}
.progress{
height:10px!important;
background:#e8eef9!important;
}
.progress-bar{
background:linear-gradient(90deg,#1e5eff,#6b8cff)!important;
}
.btn-success{
background:linear-gradient(135deg,#1456ff,#4e7bff)!important;
border:none!important;
border-radius:16px!important;
padding:12px 22px!important;
}
.btn-outline-primary{
border-radius:16px!important;
}
.badge{
border-radius:999px!important;
}
.review-progress-card{
position:sticky;
top:18px;
backdrop-filter:blur(22px);
}
.review-discussion,
.decision-card,
.deep-reading,
.confidence-panel,
.summary-card,
.evidence-card{
background:linear-gradient(180deg,#fff,#f8fbff)!important;
}
textarea{
min-height:160px;
resize:vertical;
}
.table{
border-collapse:separate;
border-spacing:0 10px;
}
.table tbody tr{
background:#fff;
}
@media(min-width:1400px){
.container,.container-fluid{
max-width:1560px!important;
}
.col-lg-6{
width:50%!important;
}
}
</style>
