.requirement-select + .select2-container {
    width: 30% !important; /* O el ancho deseado */
}

h.requirement-container-title {
    font-weight: bold;
}

.requirement-main-container {
    padding: 10px;
    margin: 10px;
    border: 1px solid rgb(220, 220, 220);
    border-radius: 10px;
    max-width: 80%;
}

.requirement-detail-container {
    width: calc(100% - 40px);
    border: 1px solid black;
    padding: 20px;
    border-radius: 10px;
    display: grid;
    overflow: auto;
    column-gap: 10px;
    grid-template-rows: 1fr 1fr auto;
	margin-top: 20px;
}

.field-requirement > label {
    font-weight: bold;
    display: flex;
    justify-content: unset;
    align-items: center;
}

.field-requirement {
    display: grid;
    grid-template-columns: 1fr 4fr auto;
    margin-bottom: 10px;
    padding: 5px;
}

div#btn_record_requirement {
    max-width: 240px;
}

span.select2.select2-container.select2-container--default.select2-container--below.select2-container--focus {
    margin: 0px 0px 20px 0px;
    position: relative;
    top: 0px;
}

.requirement-main-container .campo {
    display: grid;
    grid-template-columns: 1fr 10fr;
    height: 30px;
}

.requirement-select-container {
    height: 85px;
}


.modal-build-address .select2-results {
    position: fixed;
    background: white;
    border: 1px solid rgb(220, 220, 220);
    padding: 5px;
    width: inherit;
	border-radius: 5px;
}

.tpl-planner-byday-main-container {
    padding: 0px 10px;
    height: 100%;
    /* overflow: auto; */
    display: grid;
    grid-template-rows: 42px 108px calc(100% - 42px - 108px - 20px);
}

div#tpl_planner_byday_days_container {
    display: grid;
    grid-template-columns: repeat(11, 1fr);
    gap: 5px;
    background: rgb(230, 230, 230);
    overflow: auto;
	padding: 5px;
}

.tpl-planner-byday-day-container {
    border: 1px solid rgb(180, 180, 180);
    border-radius: 5px;
    padding: 3px;
    text-align: center;
    cursor: pointer;
    font-size: clamp(10px, 1vw, 12px);
	background: white;

    cursor: pointer;
    transition: background 0.3s ease-in-out;
}

.tpl-planner-byday-day-container.selected {
    background-color: green; /* Amarillo claro */
    /*border: 2px solid #fbc02d; /* Borde más oscuro */
    border-radius: 5px;
    padding: 5px;
}

.tpl-planner-byday-day-counter {
    font-size: 0.8em;
    color: rgb(190, 190, 190);
}

div#tpl_planner_byday_assignment_container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    border: 1px solid rgb(180, 180, 180);
    margin-top: 10px;
    border-radius: 5px;
    background: rgb(230, 230, 230);
    height: 100%;
    // position: sticky;
    // top: 215px;
}

.tpl-planner-byday-assignment-detail-container p {
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
}

div#tpl_planner_byday_assignment_detail_container {
    border: 1px solid rgb(180, 180, 180);
    margin: 10px;
    border-radius: 5px;
    background: white;
    height: calc(100% - 15px);
    overflow: auto;
}

input#client_filter {
    margin: 10px;
    border: 1px solid;
    width: 70%;
}

div#all_customers_list {
    border: 1px solid rgb(180, 180, 180);
    height: calc(100% - 115px);
    margin: 10px;
    border-radius: 5px;
    overflow: auto;
}


span#selected-day {
    display: flex;
    justify-content: center;
    font-weight: bold;
}

i.fa.fa-arrow-left.assign-customer, i.fa.fa-arrow-right.unassign-customer {
    border: 1px solid;
    padding: 4px;
    border-radius: 5px;
    margin-right: 5px;
}

p.tpl-planner-byday-main-title {
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: clamp(12px, 1vw, 14px);
    font-weight: bold;
}

div#day_clients {
    border: 1px solid rgb(180, 180, 180);
    margin: 5px;
    border-radius: 5px;
    overflow: auto;
    height: calc(100% - 45px);
}

.requirement-list-header-filter-container, .requirement-list-header-fields-container, .requirement-list-body-fields-container {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr auto;
    grid-column-gap: 20px;
}

.requirement-list-container {
    font-size: clamp(10px, 1vw, 14px);
    display: grid;
    grid-template-rows: 100px calc(100% - 160px);
}

.requirement-list-body-container {
    border: 1px solid rgb(180, 180, 180);
    background: white;
    max-height: 100%;
    overflow: auto;
    padding: 10px;
    border-radius: 10px;
    margin-top: 10px;
    min-height: min-content;
}

.requirement-list-header-container {
    border: 1px solid rgb(180, 180, 180);
    background: white;
    padding: 10px;
    border-radius: 10px;
    max-width: calc(100% - 40px);
}

.requirement-list-header-fields-field {
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
}

.requirement-list-header-filter-container > input {
	border: 1px solid rgb(180, 180, 180);
}

input.requirement-list-header-filter-field::placeholder {
    text-align: center;
}

.requirement-list-body-fields-field {
    padding: 5px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.requirement-list-body-fields-field[dato="referencia"] {
	font-weight: bold;
}

.requirement-list-header-title-move-container {
    display: grid;
    grid-template-columns: 70% 30%;
}

.requirement-list-header-title-container, .font-solution-req {
    font-size: clamp(14px, 1vw, 18px);
    font-weight: bold;
}

.requirement-list-header-move-container {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
}

.requirement-list-header-move-container .desplazamiento {
    display: flex;
    justify-content: center;
    align-items: center;
}

input#current_page {
    max-width: 39%;
    text-align: center;
}

#search_estado + .select2-container {
    height: 10px !important;
}

.customer-contact-data-container {
    border: 1px solid rgb(200, 200, 200);
    border-radius: 5px;
    padding: 5px;
    display: grid;
}

.customer-contact-data-email-container, .customer-contact-data-celular-container, .customer-contact-data-dir-entrega-container,  .customer-contact-data-ciu-entrega-container, .customer-contact-data-depto-entrega-container {
    display: grid;
    grid-template-columns: 40% auto;
    grid-gap: 10px;
}

.customer-contact-data-email-label, .customer-contact-data-celular-label, .customer-contact-data-dir-entrega-label, .customer-contact-data-ciu-entrega-label, .customer-contact-data-depto-entrega-label {
    font-weight: bold;
}

.new_contact_data-container {
    display: flex;
    align-items: center;
}

input#new_contact_data, input#new_dir_entrega {
    width: -webkit-fill-available;
}

.new-contact-customer-data-container {
    width: 60vw;
    max-height: 60vh;
}

p.new-contact-customer-data-title {
    font-size: clamp(14px, 1vw, 20px);
    font-weight: bold;
}

.new_contact_data-container {
    border: 1px solid rgb(200, 200, 200);
    border-radius: 5px;
    padding: 5px;
}

.contact_data_no_change-container {
    display: flex;
    justify-content: start;
    align-items: center;
}

div#new_contact_data {
    width: 100%;
}

button#btn_record_requirement {
    width: fit-content;
}

.customer-red {
    color: red; /* Cambia el color del texto a rojo */
    font-weight: bold; /* Opcional: hace el texto más visible */
}

.tpl-planner-byday-assignment-detail-head {
    display: grid;
    grid-template-columns: 70% 1.5fr 1.5fr 1.5fr 1.5fr 1.5fr 1.5fr;
    align-items: center;
    column-gap: 3px;
}

/* Contenedor principal */
.tpl-planner-byday-customers-container {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	margin: 5px 10px;
	border: 1px solid rgb(180, 180, 180);
	padding: 8px 10px;
	border-radius: 6px;
	background: #fff;
}

/* Línea superior: íconos + label */
.tpl-planner-byday-customers-top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	width: 100%;
}

/* Bloque de íconos */
.tpl-planner-byday-customers-icons {
	display: flex;
	align-items: center;
	gap: 6px;
	flex-shrink: 0;
}

/* Label del cliente */
.tpl-planner-byday-customer-label {
	font-size: 14px;
	font-weight: bold;
	color: #333;
	white-space: normal;
	word-break: break-word;
	flex: 1;
	min-width: 100px;
}

/* Dirección siempre debajo */
.tpl-planner-byday-customer-address {
	font-size: 12px;
	color: #555;
	margin-top: 4px; /* Espacio entre label y dirección */
	word-break: break-word;
	width: 100%;
}

/* Chips visuales */
.tpl-planner-byday-customers-span {
	background: #ff5722;
	color: white;
	font-size: 11px;
	font-weight: bold;
	padding: 2px 6px;
	border-radius: 5px;
}

.tpl-planner-byday-customers-talla {
	background: #2196F3;
	color: white;
	font-size: 11px;
	font-weight: bold;
	padding: 2px 6px;
	border-radius: 5px;
}

.tpl-planner-byday-customers-suggested-span {
	background: #4CAF50;
	color: white;
	font-size: 11px;
	font-weight: bold;
	padding: 2px 6px;
	border-radius: 5px;
}

/* Íconos visuales */
.tpl-planner-byday-customers-building,
.tpl-planner-byday-customers-hand-holding {
	font-size: 16px;
	font-weight: bold;
	padding: 2px 6px;
	border-radius: 5px;
}

.tpl-planner-container-by-day-maps {
    width: 1300px;
    height: 700px;
}
