﻿/* ======================================================
   DOCUMENTS PAGE
====================================================== */

.evaluation-docs-body {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 150px);
}

.evaluation-docs-tree {
    flex: 1;
    overflow-y: auto;
}

.evaluation-doc-card {
    flex-shrink: 0;
    margin-top: 1rem;
}

.evaluation-doc-icon {
    font-size: 72px;
    margin-bottom: 18px;
}

.evaluation-doc-name {
    font-size: 18px;
    font-weight: 700;
}


/* ======================================================
   EVALUATIONS DASHBOARD
====================================================== */

.evaluations-page {
    font-size: 16px;
}

/* Notification banner */

.evaluations-page .evaluation-notice {
    background: #DAEDFF;
    padding: 12px;
    font-size: 16px;
    font-weight: 600;
    color: #1F1F1F;
    border-radius: 8px;
    margin-bottom: 20px;
}

/* Evaluation cards */

.evaluations-page .evaluation-card {
    border: 1px solid #CECECE;
    border-radius: 8px;
    background: #FFFFFF;
    padding: 16px;
    margin-bottom: 20px;
}

/* Grid layout */

.multi-panel-container {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(420px, 1fr));
    gap: 24px;
}

.multi-panel-container > .panel {
    width: 100%;
}

.proposal-summary-panel {
    width: 100%;
}

.proposal-summary-panel .row {
    margin-left: 0;
    margin-right: 0;
}

.evaluation-rating-page .card-header h6 {
    font-size: 16px !important;
    font-weight: 700 !important;
}

/* =========================================
   EVALUATIONS PAGE - PROPOSAL LABEL FIX
========================================= */

.evaluations-page
.proposal-summary-panel
.form-control.form-control-lg {
    font-size: 16px !important;
}

/* Scrollbars */

.multi-panel-container::-webkit-scrollbar-thumb,
.evaluation-rating-page ::-webkit-scrollbar-thumb {
    background: #6A89A7;
}

/* ================= DOCUMENT DOWNLOAD BUTTON ================= */

.evaluation-doc-card {
    display: flex;
    flex-direction: column;
    align-items: center; /* horizontal center */
    text-align: center;
}

.evaluation-doc-card .acordia-btn-primary {
    width: auto !important; 
    align-self: center; 
    margin-top: 12px;
}

/* ======================================================
   EVALUATION PROGRESS (ACORDIA)
====================================================== */
.evaluations-page .progress-wrapper {
    height: 40px;
    border: 1px solid #CECECE;
    border-radius: 8px;
    overflow: hidden;
    position: relative;
    background: #F5F5F5;
}

.evaluations-page .progress {
    height: 100%;
    margin: 0;
    background: transparent;
}

.evaluations-page .progress-bar {
    height: 100%;
    background-color: #84DE9B;
}

.evaluations-page .progress-text {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    color: #1F1F1F;
}

.evaluations-page .status-field,
.evaluations-page .progress-field {
    height: 40px;
}

.evaluations-page .progress-wrapper {
    transform: translateY(2px);
}

.evaluations-page .status-field .form-select {
    height: 40px;
    line-height: 1.4;
    padding-top: 0;
    padding-bottom: 0;
}

/* ======================================================
   EVALUATION RATING PAGE (Evaluations pt.3)
====================================================== */

.evaluation-rating-page {
    height: 100%;
}

/* Top info bar */

.evaluation-rating-page .top-info-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 10px 16px;
    background-color: #ECECEF;
    color: #1F1F1F;
    font-size: 16px;
    border-bottom: 1px solid #CECECE;
}

/* Panel grid */

.evaluation-rating-page .row {
    height: 100%;
}

/* Cards */

.evaluation-rating-page .card {
    border: 1px solid #CECECE;
    border-radius: 8px;
    box-shadow: none;
}

.evaluation-rating-page .card-header {
    background-color: #384959 !important;
    color: #FFFFFF !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    border-bottom: 1px solid #CECECE !important;
}

.evaluation-rating-page .card-body {
    background-color: #FFFFFF;
}


/* ======================================================
   FORM CONTROLS
====================================================== */

.evaluation-rating-page input,
.evaluation-rating-page textarea,
.evaluation-rating-page select,
.eval-input,
.eval-textarea {
    width: 100%;
    padding: 10px;
    border-radius: 8px;
    border: 1px solid #CECECE;
    font-size: 14px;
}

.eval-textarea,
.evaluation-rating-page textarea {
    resize: vertical;
}

.evaluation-rating-page select,
.eval-input select { /* Or wherever your global selects are defined */
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    /* Add the Bootstrap arrow back as a single background image */
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right 12px center;
    background-size: 16px 12px;
    padding-right: 30px; /* Give the arrow some room */
}

/* ======================================================
   EVALUATION BUTTONS
====================================================== */

.evaluation-buttons {
    display: flex;
    gap: 12px; /* space between buttons */
    align-items: center;
}

.evaluation-buttons .btn {
    width: auto; /* 🚨 removes full width */
    min-width: 120px; /* keeps them consistent */
}

/* =========================================================
   TREE STATUS CIRCLES (FIX MISSING EMPTY STATE)
   ========================================================= */

.tree-status-circle-border {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    border: 2px solid #9aa3ab; /* 🔥 THIS IS WHAT YOU LOST */
    background-color: transparent;
}

.tree-status-circle-filled {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    display: inline-block;
    background-color: #1f7a2e; /* your green */
}