﻿@charset "UTF-8";
body {
  /*menu lateral*/
  /*botones*/
  /* ========================================
     FORM LABELS
     ======================================== */
  /* ========================================
     SEARCH & FILTER COMPONENTS
     ======================================== */
  /* ========================================
     ALERT BOXES
     ======================================== */
  /* ========================================
     CARDS & CONTAINERS
     ======================================== */
  /* ========================================
     TABLES
     ======================================== */
  /* ========================================
     BADGES & STATUS INDICATORS
     ======================================== */
  /* ========================================
     ICONS & VISUAL INDICATORS
     ======================================== */
  /* ========================================
     EMPTY STATES
     ======================================== */
  /* ========================================
     LOADING STATES
     ======================================== */
  /* ========================================
     TEXT UTILITIES
     ======================================== */
  /* ========================================
     SPACING UTILITIES
     ======================================== */
  /* ========================================
     INPUT COMPONENTS
     ======================================== */
}
body .sidebar .notify-container {
  position: relative;
  display: inline-block;
}
body .sidebar .notify-container .show-dot {
  position: absolute;
  top: 6px;
  left: 30px;
  width: 10px;
  height: 10px;
  background-color: red;
  border-radius: 50%; /* hace el círculo */
}
body .sidebar .hidde-dot {
  display: none;
}
body .sidebar .nav-group-header {
  color: #666666 !important;
  font-weight: 600;
  display: flex;
  border-bottom: none;
}
body .sidebar .nav-group-header i {
  font-weight: 400;
}
body .sidebar .nav-group-content {
  background-color: white;
  border-left: none;
}
body .sidebar .facts-group .bussnies-objetives .active i {
  color: #3b82f6;
}
body .sidebar .facts-group .individual-objetives .active i {
  color: #10b981;
}
body .sidebar .facts-group .personal-competences .active i {
  color: #8b5cf6;
}
body .sidebar .nav-item {
  background-color: white;
  border-bottom: none;
}
body .sidebar .nav-item .active {
  background-color: white;
  font-weight: 600;
  color: black;
}
body .sidebar .nav-item .active i {
  color: #4096a4;
  font-weight: 400;
}
body .sidebar .nav-item a {
  color: #666666;
  font-weight: 600;
  display: flex;
}
body .sidebar .nav-item a i {
  font-weight: 400;
}
body .sidebar .my-profile {
  cursor: pointer;
  bottom: 0px;
  left: 0px;
}
body .sidebar .log-out {
  cursor: pointer;
  position: absolute;
  bottom: 0px;
  left: 0px;
}
body .page-title h1 {
  font-size: 1.75rem;
  font-weight: bold;
  letter-spacing: normal;
}
body .page-title .rz-text-muted {
  font-size: 0.95rem;
  color: #6b7280;
  margin: 0;
}
body .subheader h2 {
  font-size: 1.25rem;
  font-weight: bold;
  margin: 0;
  margin-bottom: 0px;
  text-align: center;
}
body .primary-btn {
  background-color: #4096a4 !important;
  border: none;
  margin-right: 0.5rem;
}
body .rz-button.rz-primary {
  background-color: #4096a4 !important;
  border: none !important;
  margin-right: 0.5rem !important;
}
body .primary-btn-grey {
  background-color: #666666 !important;
  border: none;
  margin-right: 0.5rem;
}
body .primary-btn-company {
  background-color: #3b82f6 !important;
  border: none;
  color: white !important;
}
body .primary-btn-individual {
  background-color: #10b981 !important;
  color: white !important;
  border: none;
}
body .primary-btn-personal {
  background-color: #8b5cf6 !important;
  color: white !important;
  border: none;
}
body .icon-btn {
  background-color: transparent !important;
  /*color: $sermicro_blue !important;*/
  border: none;
}
body .delete-icon-btn {
  background-color: transparent !important;
  color: red !important;
  border: none;
  box-shadow: none;
}
body .delete-icon-btn:hover {
  box-shadow: none !important;
  transform: scale(1.2);
}
body .content-data {
  display: flex;
  flex-direction: row;
  gap: 0.5rem;
}
body .content-data .row {
  gap: 1rem;
  justify-content: center;
}
body .content-data .row .card-data {
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid groove;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  width: 49%;
  background-color: white;
  border: 1px solid #d3d3d3;
}
body .content-data .row .card-data .number {
  width: 28px;
  height: 28px;
  background-color: #d3d3d3;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: #666666;
  font-size: 0.875rem;
}
body .content-data .row .card-data .active-status {
  background-color: rgba(64, 150, 164, 0.2117647059);
  color: #4096a4;
  padding: 0.2rem 0.6rem;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 500;
}
body .content-data .row .card-data .pend-status {
  background-color: #d3d3d3;
  color: #666666;
  padding: 0.2rem 0.6rem;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 500;
}
body .content-data .row .card-data .complete-status {
  background-color: #dcfce7;
  color: #166534;
  padding: 0.2rem 0.6rem;
  border-radius: 20px;
  font-size: 0.8rem;
  font-weight: 500;
}
body .progress-card .card-data {
  border-radius: 12px;
  padding: 1rem;
  margin-bottom: 1rem;
  border: 1px solid groove;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  width: 100%;
  background-color: white;
  border: 1px solid #d3d3d3;
}
body .company-objetives {
  color: #3b82f6 !important;
}
body .individual-objetive {
  color: #10b981 !important;
}
body .personal-objetive {
  color: #8b5cf6 !important;
}
body .icon-company {
  color: #3b82f6;
  text-align: center;
  padding: 3rem;
}
body .icon-individual {
  color: #10b981;
  text-align: center;
  padding: 3rem;
}
body .icon-personal {
  color: #8b5cf6;
  text-align: center;
  padding: 3rem;
}
body .grid-notification {
  border: none;
}
body .grid-notification table {
  border: none;
}
body .grid-notification table tr {
  border: none;
}
body .grid-notification table tr th,
body .grid-notification table tr td {
  border: none;
  border-inline-end: none !important;
}
body .grid-notification table .pending-notification {
  animation: fadeBg 2s infinite alternate;
}
body .grid-notification table .pending-notification td {
  background-color: transparent !important;
}
@keyframes fadeBg {
  from {
    background-color: rgba(64, 150, 164, 0.3); /* Azul sólido */
  }
  to {
    background-color: rgba(0, 0, 255, 0); /* Transparente */
  }
}
body .metric-icon i {
  font-size: 30px;
  color: #4096a4;
}
body .container-objetives {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
}
body .container-objetives_blue {
  border-left: 3px solid #3b82f6;
}
body .container-objetives_green {
  border-left: 3px solid #10b981;
}
body .container-objetives_purple {
  border-left: 3px solid #8b5cf6;
}
body .section-header {
  font-size: 1.3rem;
  font-weight: bold;
  color: #1f2937;
  margin-bottom: 1.5rem;
}
body .section-subheader {
  font-size: 1.2rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 1rem 0;
}
body .section-title {
  font-size: 1.2rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0;
}
body .form-label {
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
  display: block;
}
body .search-container {
  position: relative;
}
body .search-icon {
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  color: #9ca3af;
}
body .warning-alert {
  margin-top: 0.75rem;
  padding: 0.75rem 1rem;
  background-color: #fff8e1;
  border-radius: 8px;
  border: 1px solid #fde68a;
}
body .info-alert {
  margin-top: 0.75rem;
  padding: 0.75rem 1rem;
  background-color: #cff4fc;
  border-radius: 8px;
  border: 1px solid #9eeaf9;
}
body .error-text {
  color: #ef4444;
  margin-left: 0.5rem;
}
body .white-card {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
}
body .white-card-large-padding {
  background-color: white;
  border-radius: 12px;
  padding: 3rem;
  text-align: center;
  border: 1px solid #e5e7eb;
}
body .overflow-auto {
  overflow-x: auto;
}
body .custom-table {
  width: 100%;
  border-collapse: collapse;
}
body .custom-table thead tr {
  border-bottom: 1px solid #e5e7eb;
}
body .custom-table th {
  text-align: left;
  padding: 1rem 0.75rem;
}
body .custom-table tbody tr {
  border-bottom: 1px solid #f3f4f6;
}
body .custom-table td {
  padding: 1rem 0.75rem;
}
body .table-cell-bold {
  color: #1f2937;
  font-weight: 500;
}
body .table-cell-center {
  text-align: center;
}
body .badge-base, body .badge-inactive, body .badge-active, body .badge-result-green, body .badge-weight-blue, body .badge-year {
  padding: 0.25rem 0.5rem;
  border-radius: 4px;
  font-weight: 500;
}
body .badge-year {
  background-color: #e5e7eb;
  color: #374151;
}
body .badge-weight-blue {
  background-color: #3b82f6;
  color: white;
}
body .badge-result-green {
  background-color: #10b981;
  color: white;
}
body .badge-active {
  background-color: #dcfce7;
  color: #166534;
}
body .badge-inactive {
  background-color: #fee2e2;
  color: #dc2626;
}
body .badge-total-result {
  background-color: #10b981;
  color: white;
  padding: 0.25rem 0.75rem;
  border-radius: 6px;
  font-weight: 600;
}
body .dot-indicator, body .dot-red, body .dot-purple, body .dot-green, body .dot-blue {
  width: 8px;
  height: 8px;
  border-radius: 50%;
}
body .dot-blue {
  background-color: #3b82f6;
}
body .dot-green {
  background-color: #10b981;
}
body .dot-purple {
  background-color: #8b5cf6;
}
body .dot-red {
  background-color: #C44027;
}
body .large-icon {
  font-size: 3rem;
  margin-bottom: 1rem;
}
body .large-icon-grey {
  font-size: 3rem;
  color: #9ca3af;
  margin-bottom: 1rem;
}
body .empty-state {
  text-align: center;
  padding: 3rem;
}
body .empty-state-grey {
  text-align: center;
  padding: 3rem;
  color: #6b7280;
}
body .empty-state-title {
  color: #6b7280;
}
body .loading-container {
  text-align: center;
  padding: 3rem;
}
body .loading-text {
  color: #6b7280;
  margin-top: 1rem;
}
body .text-grey {
  color: #6b7280;
}
body .text-grey-small {
  color: #6b7280;
  font-size: 0.875rem;
}
body .text-bold {
  font-weight: 500;
}
body .text-center {
  text-align: center;
}
body .mb-15 {
  margin-bottom: 1.5rem;
}
body .weight-input-container {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}
body .rz-badge-info {
  background-color: #4096a4 !important;
  padding: 5px 10px;
}
body .create-cycle-dialog .rz-dialog-titlebar .rz-dialog-title {
  font-weight: 700;
}
body .create-cycle-dialog .rz-dialog-content .dialog-container {
  padding: 0px;
}
body .create-cycle-dialog .rz-dialog-content .dialog-container .dialog-card {
  padding: 0px;
}
body .create-cycle-dialog .rz-dialog-content .dialog-container .dialog-card .phases-grid {
  row-gap: 1rem;
}
body .employee-card {
  background-color: white;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
}
body .employee-card__title {
  font-size: 1.3rem;
  font-weight: bold;
  color: #1f2937;
  margin-bottom: 1.5rem;
}
body .employee-card__content {
  display: flex;
  gap: 2rem;
  margin-bottom: 2rem;
}
body .employee-card__avatar {
  width: 80px;
  height: 80px;
  background-color: #e5e7eb;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .employee-card__avatar-icon {
  font-size: 2rem;
  color: #9ca3af;
}
body .employee-card__info {
  /*flex: 1;*/
  flex: 0.7;
}
body .employee-card__info-name {
  font-size: 1.5rem;
  font-weight: bold;
  color: #1f2937;
  margin-bottom: 0.25rem;
}
body .employee-card__info-job {
  color: #6b7280;
  font-size: 1.1rem;
  margin-bottom: 1rem;
}
body .employee-card__info-details {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .employee-card__info-detail {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}
body .employee-card__info-detail-text {
  color: #374151;
}
body .employee-card__info-detail-icon {
  color: #6b7280;
}
body .employee-card__grid {
  flex: 1;
}
body .employee-card__section-title {
  font-size: 1rem;
  font-weight: bold;
  color: #1f2937;
  margin-bottom: 1rem;
}
body .employee-card__section-content {
  font-size: 0.875rem;
  color: #6b7280;
}
body .employee-card__section-content p {
  margin: 0.5rem 0;
}
body .employee-card__section-content p strong {
  font-weight: bold;
}
body .employee-card__evaluations {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
body .employee-card__evaluation {
  background-color: #f3f4f6;
  padding: 0.75rem;
  border-radius: 8px;
}
body .employee-card__evaluation-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
body .employee-card__evaluation-header-title {
  font-weight: 500;
  color: #1f2937;
  width: 30%;
}
body .employee-card__evaluation-header-btns {
  width: 20%;
  text-align: right;
}
body .employee-card__evaluation-header-info {
  display: flex;
  align-items: center;
  width: 40%;
  gap: 0.5rem;
}
body .employee-card__evaluation-header-info-badge {
  font-size: 0.75rem;
  color: #6b7280;
}
body .employee-card__evaluation-header-info-score {
  font-weight: 500;
}
body .employee-card__evaluation-header-info-rating {
  font-size: 0.75rem;
}
body .employee-card__evaluation-header-info-rating--deficient {
  color: #DE021D;
}
body .employee-card__evaluation-header-info-rating--correct {
  color: #FFAA00;
}
body .employee-card__evaluation-header-info-rating--excellent {
  color: #059669;
}
body .employee-card__status {
  margin-top: 2rem;
  padding: 1rem;
  border-radius: 8px;
  border: 1px solid;
}
body .employee-card__status-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  /*margin-bottom: 0.5rem;*/
}
body .employee-card__status-header strong {
  color: inherit;
}
body .employee-card__status-message {
  margin: 0.5rem 0;
  font-size: 0.875rem;
}
body .employee-card__status--draft {
  background-color: #eff6ff;
  border-color: #3b82f6;
  color: #1e40af;
}
body .employee-card__status--sent {
  background-color: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
}
body .employee-card__status--preevaluation {
  background-color: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
}
body .employee-card__status--pending {
  background-color: #fef3c7;
  border-color: #f59e0b;
  color: #92400e;
}
body .employee-card__status--closed {
  background-color: #f0fdf4;
  border-color: #22c55e;
  color: #166534;
}
body .employee-card__actions {
  margin-top: 2rem;
  text-align: right;
}
body .employee-card__actions .primary-btn {
  padding: 0.75rem 2rem;
  font-size: 0.8rem;
}
body .objectives-section {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
  border-left: 4px solid #10b981;
}
body .objectives-section .meta-width {
  width: 30%;
}
body .objectives-section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}
body .objectives-section__title-container {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .objectives-section__icon-wrapper {
  width: 40px;
  height: 40px;
  background-color: #10b981;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .objectives-section__icon {
  color: white;
  font-size: 1.2rem;
}
body .objectives-section__title {
  font-size: 1.3rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0;
}
body .objectives-section__badge {
  margin-left: auto;
}
body .objectives-section__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
body .objectives-section__objective {
  background-color: white;
  border-radius: 8px;
  padding: 1.5rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
body .objectives-section__objective-description {
  font-size: 1.1rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 1rem 0;
}
body .objectives-section__objective-form {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .objectives-section__objective-form--evaluation {
  grid-template-columns: 0.2fr 0.2fr;
}
body .objectives-section__objective-form--closed {
  grid-template-columns: 0.2fr 0.2fr 0.2fr;
}
body .objectives-section__objective-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .objectives-section__objective-field .meta-sapn {
  color: black;
  border: none;
  word-wrap: break-word;
  padding: 0px;
}
body .objectives-section__objective-label {
  color: #6b7280;
  font-size: 0.875rem;
}
body .objectives-section__objective-value {
  background-color: #f3f4f6;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.75rem;
  color: #374151;
  text-align: center;
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .objectives-section__objective .radzen-textbox {
  width: 100%;
}
body .competencies-section {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
  border-left: 4px solid #8b5cf6;
}
body .competencies-section .meta-width {
  width: 30%;
}
body .competencies-section__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}
body .competencies-section__title-container {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .competencies-section__icon-wrapper {
  width: 40px;
  height: 40px;
  background-color: #8b5cf6;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .competencies-section__icon {
  color: white;
  font-size: 1.2rem;
}
body .competencies-section__title {
  font-size: 1.3rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0;
}
body .competencies-section__badge {
  margin-left: auto;
}
body .competencies-section__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
body .competencies-section__competency {
  background-color: white;
  border-radius: 8px;
  padding: 1.5rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
body .competencies-section__competency-description {
  font-size: 1.1rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 1rem 0;
}
body .competencies-section__competency-form {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .competencies-section__competency-form--preevaluation {
  grid-template-columns: 0.2fr;
}
body .competencies-section__competency-form--evaluation {
  grid-template-columns: 0.2fr 0.2fr;
}
body .competencies-section__competency-form--closed {
  grid-template-columns: 0.2fr 0.2fr 0.2fr;
}
body .competencies-section__competency-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .competencies-section__competency-label {
  color: #6b7280;
  font-size: 0.875rem;
}
body .competencies-section__competency-value {
  background-color: #f3f4f6;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.75rem;
  color: #374151;
  text-align: center;
  min-height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .competencies-section__competency .radzen-textbox {
  width: 100%;
}
body .evaluation-page__section-header-title-icon {
  color: white !important;
}
body .evaluation-page__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 2rem;
}
body .evaluation-page__header-title h1 {
  font-size: 2rem;
  font-weight: bold;
  color: #1f2937;
  margin-bottom: 0.5rem;
}
body .evaluation-page__header-title p {
  font-size: 1.1rem;
  color: #6b7280;
}
body .evaluation-page__header-title p strong {
  color: #1f2937;
}
body .evaluation-page__header-mode {
  text-align: right;
}
body .evaluation-page__header-mode-badge {
  background-color: white;
  color: #374151;
  padding: 0.5rem 1rem;
  border-radius: 20px;
  font-size: 0.875rem;
  font-weight: 600;
  border: 1px solid rgba(0, 0, 0, 0.0901960784);
}
body .evaluation-page__loading {
  text-align: center;
  padding: 3rem 0;
}
body .evaluation-page__loading p {
  margin-top: 1rem;
  color: #6b7280;
}
body .evaluation-page__actions {
  display: flex;
  gap: 1rem;
  margin-bottom: 2rem;
}
body .evaluation-page__actions .radzen-button--light {
  border: 1px solid #d1d5db;
  color: #6b7280;
}
body .evaluation-page__actions .radzen-button--primary {
  background-color: #10b981;
  border-color: #10b981;
  color: white;
}
body .evaluation-page__summary-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  margin-bottom: 2rem;
}
body .evaluation-page__summary-cards i {
  color: white;
}
@media (max-width: 768px) {
  body .evaluation-page__summary-cards {
    grid-template-columns: 1fr;
  }
}
body .evaluation-page__summary-card {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  height: 100%;
}
body .evaluation-page__summary-card--company {
  border-left: 4px solid #3b82f6;
}
body .evaluation-page__summary-card--individual {
  border-left: 4px solid #10b981;
}
body .evaluation-page__summary-card--competencies {
  border-left: 4px solid #8b5cf6;
}
body .evaluation-page__summary-card-header {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}
body .evaluation-page__summary-card-header-icon {
  width: 48px;
  height: 48px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .evaluation-page__summary-card-header-icon--blue {
  background-color: #3b82f6;
}
body .evaluation-page__summary-card-header-icon--green {
  background-color: #10b981;
}
body .evaluation-page__summary-card-header-icon--purple {
  background-color: #8b5cf6;
}
body .evaluation-page__summary-card-header-icon svg {
  color: white;
  font-size: 1.5rem;
}
body .evaluation-page__summary-card-header h3 {
  font-size: 1.1rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0;
}
body .evaluation-page__summary-card-header p {
  color: #6b7280;
  font-size: 0.875rem;
  margin: 0;
}
body .evaluation-page__summary-card-content {
  background-color: #f3f4f6;
  color: #374151;
  padding: 0.5rem;
  border-radius: 6px;
  text-align: center;
  border: 1px solid #d1d5db;
}
body .evaluation-page__summary-card-content span {
  font-weight: bold;
}
body .evaluation-page__summary-card-content .weight {
  font-weight: 600;
  margin-right: 0.25rem;
}
body .evaluation-page__summary-card-content .value {
  color: #1f2937;
  font-weight: bold;
}
body .evaluation-page__section {
  background-color: white;
  border-radius: 12px;
  padding: 1.5rem;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.1);
  border: 1px solid #e5e7eb;
  margin-bottom: 2rem;
}
body .evaluation-page__section--objectives {
  border-left: 4px solid #10b981;
}
body .evaluation-page__section--competencies {
  border-left: 4px solid #8b5cf6;
}
body .evaluation-page__section--comments {
  border-left: 4px solid #6b7280;
}
body .evaluation-page__section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1.5rem;
}
body .evaluation-page__section-header-title {
  display: flex;
  align-items: center;
  gap: 1rem;
}
body .evaluation-page__section-header-title-icon {
  width: 40px;
  height: 40px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
body .evaluation-page__section-header-title-icon--green {
  background-color: #10b981;
}
body .evaluation-page__section-header-title-icon--purple {
  background-color: #8b5cf6;
}
body .evaluation-page__section-header-title-icon--gray {
  background-color: #6b7280;
}
body .evaluation-page__section-header-title-icon svg {
  color: white;
  font-size: 1.2rem;
}
body .evaluation-page__section-header-title h3 {
  font-size: 1.3rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0;
}
body .evaluation-page__section-header .radzen-badge {
  margin-left: auto;
}
body .evaluation-page__section-subtitle {
  color: #6b7280;
  font-size: 0.875rem;
  margin: 0;
}
body .evaluation-page__section-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
body .evaluation-page__item {
  background-color: white;
  border-radius: 8px;
  padding: 1.5rem;
  border: 1px solid #e5e7eb;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06);
}
body .evaluation-page__item .meta-width {
  width: 30%;
}
body .evaluation-page__item-description {
  font-size: 1.1rem;
  font-weight: bold;
  color: #1f2937;
  margin: 0 0 1rem 0;
}
body .evaluation-page__item-form {
  display: flex;
  gap: 1rem;
  align-items: flex-start;
}
@media (max-width: 768px) {
  body .evaluation-page__item-form {
    flex-direction: column;
  }
}
body .evaluation-page__item-field {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .evaluation-page__item-field label {
  color: #6b7280;
  font-size: 0.875rem;
}
body .evaluation-page__item-field .meta-sapn {
  color: black;
  border: none;
  word-wrap: break-word;
  padding: 0px;
}
body .evaluation-page__item-field .radzen-numeric,
body .evaluation-page__item-field .radzen-dropdown {
  width: 100%;
}
body .evaluation-page__item-field .radzen-numeric input,
body .evaluation-page__item-field .radzen-dropdown input {
  background-color: #f3f4f6;
}
body .evaluation-page__item-field small {
  color: #9ca3af;
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
body .evaluation-page__comments-section {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}
@media (max-width: 768px) {
  body .evaluation-page__comments-section {
    grid-template-columns: 1fr;
  }
}
body .evaluation-page__comment-box {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
body .evaluation-page__comment-box .radzen-label {
  font-weight: 500;
  color: #374151;
  margin-bottom: 0.5rem;
}
body .evaluation-page__comment-box-display {
  background-color: #f3f4f6;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.75rem;
  min-height: 120px;
  color: #374151;
}
body .evaluation-page__comment-box-display.empty {
  color: #9ca3af;
  font-style: italic;
}
body .evaluation-page__comment-box .radzen-textarea {
  width: 100%;
  border: 1px solid #d1d5db;
  border-radius: 6px;
  padding: 0.75rem;
  min-height: 120px;
  resize: vertical;
}
body .data-width {
  width: 20%;
}
