/* GENERAL*/
#main-container {background-color: white;padding: 2rem;position: relative;}
h1 {/* color: #2f3be9; */background-color: #171669;/* font-weight: bold; */color: white;/* display: inline-block; */padding: 10px;font-size: 2rem;z-index: 1;position: relative;}
h1+p {margin: 0 0 2rem;}
form {margin: 0 0 5rem;}
form .mb-3 {margin-bottom: 0 !important;padding: 1.75rem 0;border-bottom: 1px solid #d7dbe0;}
form > .mb-3:first-child { padding-top: 0.25rem; }
form > .mb-3:not(:has(~ .mb-3)) { border-bottom: none; }
img#logo {width: auto;display: block;margin: -2rem 0 1rem 0rem;/* position: absolute; *//* top: 0; *//* left: 0; */}
label {font-weight: bold;display: block;}
#img-personitas {position: absolute; top: 1rem; right: 1rem; height: 200px;}

/* RADIO */
.type-radio .form-check-inline,
.type-checkbox .form-check-inline {position: relative;padding: 0;margin: 0;}
.type-radio .form-check-inline input[type="radio"],
.type-checkbox .form-check-inline input[type="checkbox"] {position: absolute;left: 0.5rem;top: 50%;transform: translate(0%, -50%);opacity: 1;z-index: 1;margin: 0;cursor: pointer;float: unset;}
.type-radio .form-check-inline input[type="radio"]:checked[type=radio]{}
.type-radio input+label,
.type-checkbox input+label {font-weight: normal;padding: 0.5rem 1rem 0.5rem 2rem;display: inline-block;cursor: pointer;border: 1px solid #ddd;border-radius: 0.3rem;vertical-align: middle;margin: 0.25rem 1rem 0.25rem 0;}
.type-radio .form-check-inline input[type="radio"]:checked + label,
.type-checkbox .form-check-inline input[type="checkbox"]:checked + label {background-color: #eff3ff;vertical-align: middle;border-color: #0d6efd;}

/* STARS */
.type-stars .star-rating {direction: rtl;display: inline-flex;}
.type-stars .star-rating input[type="radio"] {width: 2px;opacity: 0;}
.type-stars .star-rating label {font-size: 2rem;color: #ddd;cursor: pointer;line-height: 0.7;}
.type-stars .star-rating label:hover {color: #ccc;}
.type-stars .star-rating input[type="radio"]:checked ~ label {color: #0d6efd;}

/* SORT */
.type-sort .draggable {cursor: default;display: flex;align-items: center;position: relative;}
.type-sort .draggable.ui-sortable-helper {background-color: #f0f0f0;border: 2px dashed #0d6efd;opacity: 0.9;}
.type-sort .draggable.ui-sortable-placeholder {background-color: #e9ecef;border: 2px dashed #0d6efd;height: 40px; /* Asegúrate de que la altura sea consistente con los elementos arrastrables */visibility: visible !important;}
.type-sort .draggable::before {content: attr(data-pos);font-weight: bold;margin-right: 10px;}
.type-sort .drag-handle {position: absolute;right: 20px;width: 20px;height: 20px;background-image: url('bars.svg');background-repeat: no-repeat;background-position: center;background-size: contain;opacity: 0.7;cursor: move;touch-action: none;flex-shrink: 0;}
.type-sort .drag-handle:hover {opacity: 0.5;}

/* SORT - Opción Otros */
.type-sort .otros-item {display: flex;align-items: center;position: relative;}
.type-sort .otros-item .otros-label {cursor: pointer;flex: 0 0 auto;}
.type-sort .otros-item .otros-hint {font-size: 0.8rem;color: #0d6efd;font-style: italic;margin-left: 0.5rem;cursor: pointer;}
.type-sort .otros-item .otros-input {display: none;margin-left: 10px;flex: 1;min-width: 200px;padding: 0.25rem 0.5rem;font-size: 0.875rem;border: 1px solid #ced4da;border-radius: 0.25rem;}
.type-sort .otros-item.ui-sortable-helper .otros-input {display: none !important;}
.type-sort .otros-item:hover {background-color: #f8f9fa;}

/* Ajustes para móvil */
@media screen and (max-width:768px){
    .type-sort .otros-item .otros-input {min-width: 120px;font-size: 0.8rem;}
}

@media screen and (max-width:768px){
    #main-container {width:calc(100% - 30px);padding: 1rem;margin-top: 2rem !important;}
    img#logo {width: 60%;margin: -1rem 0 1rem 0rem;}
    .type-sort .drag-handle {right: 10px;width: 15px;height: 15px;    }
    #img-personitas {height: 110px;top: 0.5rem;right: 0.5rem;}
    h1 {font-size:1.5rem;}
}