/****************************************
****** PANEL DE CONTROL PROFESIONAL *****
****************************************/

/****** General ******/
#edition-main-control-panel {
    display: flex;
    flex-direction: column;
}

#section-control-panel {
    display: flex;
    flex-flow: column nowrap;
}

@media (min-width: 1200px) {
    #section-control-panel {
        display: grid;
        grid-template-rows: 3fr 2fr;
        grid-template-columns: 4fr 5fr;
        grid-template-areas:
                        "interventions-reminders alerts"
                        "interventions-reminders alerts";
        /*grid-template-areas:
                "interventions alerts"
                "reminders alerts";*/
        grid-row-gap: 1em;
        row-gap: 1em;
        /*grid-column-gap: 2em;*/
        /*column-gap: 2em;*/
        min-height: 0;
        min-width: 0;
    }

    /*#section-control-panel > * {
        min-width: 0;
    }*/

    #control-panel-interventions-reminders-display {
            grid-area: interventions-reminders;
            padding-right: 1.5rem;
    }

    #control-panel-interventions-display {
        grid-area: interventions;
    }

    #control-panel-reminders-display {
        grid-area: reminders;
    }

    #control-panel-alerts-display {
        grid-area: alerts;

        border-left: dotted 4px var(--ubk-blue);
        padding-left: 1.5rem;
    }
}

@media (min-width: 1600px) {
    #section-control-panel {
        display: grid;
        grid-template-rows: 3fr 2fr;
        grid-template-columns: 2fr 3fr;
        grid-template-areas:
                "interventions-reminders alerts"
                "interventions-reminders alerts";
        /*grid-template-areas:
                "interventions alerts"
                "reminders alerts";*/
        grid-row-gap: 1em;
        row-gap: 1em;
        /*grid-column-gap: 2em;*/
        /*column-gap: 2em;*/
        min-height: 0;
        min-width: 0;
    }
}

/****** Interventions  && Fixed Reminders ******/

.control-panel-interventions {
    display: grid;
    /*grid-template-columns: .5fr 4fr 12.5fr 2.5fr 2.5fr 2.5fr 2.5fr;*/
    /*grid-template-columns: 4.5fr 12.5fr 2.5fr 2.5fr 2.5fr 2.5fr;*/
    /*grid-template-rows: 1.5em;*/
    grid-auto-rows: minmax(3em, auto);

    grid-column-gap: 1em;
    column-gap: 1em;
    grid-row-gap: 1em;
    row-gap: 1em;

    min-height: 0;
    min-width: 0;
}

.control-panel-interventions.can-cancel {
    /*grid-template-columns: 4.5fr 12.5fr repeat(3, 3em);*/
    grid-template-columns: 4.5fr 12.5fr repeat(3, 2.5fr);
}

.control-panel-interventions.can-not-cancel {
    /*grid-template-columns: 4.5fr 15.5fr repeat(3, 3em);*/
    grid-template-columns: 4.5fr 12.5fr repeat(3, 2.5fr);
}

.control-panel-interventions.registry {
    /*grid-template-columns: 4.5fr 17.5fr 6em;*/
    grid-template-columns: 4.5fr 15fr 5fr;
}

.control-panel-interventions.intervention-popup {
    grid-template-columns: 4.5fr 17.5fr;
}

.control-panel-interventions.table-header {
    grid-template-rows: 1.5em;
}

.control-panel-interventions > * {
    min-width: 0;
}

/*.control-panel-interventions > *.display-contents > * {
    min-width: 0;
}*/

.cp-intervention-label.in-person {
    /*background: var(--palma-green);*/
    border-left: solid 0.75rem var(--palma-green);
    padding-left: 1em;
}

.cp-intervention-label.phone-call {
    /*background: var(--java-blue);*/
    border-left: solid 0.75rem var(--java-blue);
    padding-left: 1em;
}

.cp-intervention-label.not-place {
    /*background: var(--jazzberry-jam);*/
    border-left: solid 0.75rem var(--jazzberry-jam);
    padding-left: 1em;
}

.cp-intervention-label.cancelled {
    border-left: solid 0.75rem var(--red);
    padding-left: 1em;
}

.cp-intervention-label.done {
    border-left: solid 0.75rem var(--green);
    padding-left: 1em;
}

.cp-intervention-label.unregistered {
    border-left: solid 0.75rem var(--java-blue);
    padding-left: 1em;
}

.cp-intervention-label.id {
    margin-left: 1.5em;
}

.control-panel-interventions.fixed-reminder {
    grid-template-columns: 20.5fr repeat(2, 2.5fr);
}

.cp-fixed-reminder-label {
    border-left: solid 0.75rem var(--persian-red);
    padding-left: 1em;
}


/****** Reminders ******/

.control-panel-reminders {
    display: grid;
    /*grid-template-columns: 25fr repeat(2, 3em);*/
    grid-template-columns: 20.5fr repeat(2, 2.5fr);

    /*grid-template-rows: 1.5em;
    grid-auto-rows: minmax(2.5em, auto);*/

    grid-template-rows: 2.5em;
    grid-auto-rows: minmax(3em, auto);

    grid-column-gap: 1em;
    column-gap: 1em;
    grid-row-gap: 1em;
    row-gap: 1em;

    min-height: 0;
    min-width: 0;
}

.control-panel-reminders.today {
    grid-template-rows: 1.5em;
}

.control-panel-reminders > * {
    min-width: 0;
}

.cp-reminder-label.today {
    border-left: solid 0.75rem var(--dark-tangerine);
    padding-left: 1em;
}

.cp-reminder-label.week {
    border-left: solid 0.75rem var(--chocolate);
    padding-left: 1em;
}

.cp-reminder-label.past {
    border-left: solid 0.75rem var(--house-green);
    padding-left: 1em;
}

/****** Alerts ******/

.control-panel-alerts {
    display: grid;
    /*grid-template-columns: .5fr 7.5fr 22fr;*/
    grid-template-columns: 10fr 20fr;
    grid-auto-rows: minmax(2.5em, auto);

    grid-column-gap: 1.5em;
    column-gap: 1.5em;
    grid-row-gap: 1em;
    row-gap: 1em;

    min-height: 0;
    min-width: 0;
}

.control-panel-alerts > * {
    min-width: 0;
}

.cp-alert-label.unread {
    /*background: var(--persian-red);*/
    border-left: solid 0.75rem var(--persian-red);
    padding-left: 1em;
}

.cp-alert-label.close-pending {
    /*background: var(--dark-tangerine);*/
    border-left: solid 0.75rem var(--dark-tangerine);
    padding-left: 1em;
}


/****** Urgent ******/

.control-panel-urgent-tasks {
    display: grid;
    /*grid-template-columns: .5fr 23fr 6.5fr;*/
    grid-template-columns: 23.5fr 6.5fr;
    grid-auto-rows: minmax(2.5em, auto);

    grid-column-gap: 1.5em;
    column-gap: 1.5em;
    grid-row-gap: 1em;
    row-gap: 1em;

    min-height: 0;
    min-width: 0;
}

.control-panel-urgent-tasks > * {
    min-width: 0;
}

.cp-urgent-task-label.intervention {
    /*background: var(--palma-green);*/
    border-left: solid 0.75rem var(--palma-green);
    padding-left: 1em;
}

.cp-urgent-task-label.other-staff-intervention {
    /*background: var(--house-green);*/
    border-left: solid 0.75rem var(--house-green);
    padding-left: 1em;
}

.cp-urgent-task-label.service {
    /*background: var(--dark-tangerine);*/
    border-left: solid 0.75rem var(--dark-tangerine);
    padding-left: 1em;
}

.cp-urgent-task-label.phone-call {
    /*background: var(--java-blue);*/
    border-left: solid 0.75rem var(--java-blue);
    padding-left: 1em;
}

.cp-urgent-task-label.event-scheduling {
    /*background: var(--jazzberry-jam);*/
    border-left: solid 0.75rem var(--jazzberry-jam);
    padding-left: 1em;
}


/****** Others ******/

/** Alerts background blue table **/

.control-panel-alerts-table.half-opacity-blue-table {
    background-color: var(--half-opacity-ubk-blue);
    border: solid 2px var(--ubk-blue);
}

.control-panel-alerts-table.half-opacity-blue-table .not-selented-tab {
    border-bottom: solid 2px var(--ubk-blue);
    background: var(--white);
}

.control-panel-alerts-table.half-opacity-blue-table .not-selented-tab:not(:first-child) {
    border-left: solid 2px var(--ubk-blue);
}

.control-panel-alerts-table.half-opacity-blue-table .selented-tab:not(:first-child) {
    border-left: solid 2px var(--ubk-blue);
}

/** Header counter icon **/

.control-panel-counter.medium-blue-icon {
    min-width: 2rem;
    min-height: 2rem;
    border-radius: 50%;
    background: var(--ubk-blue);
}

.control-panel-counter.large-blue-icon {
    width: 2.5em;
    height: 2.5em;
    border-radius: 50%;
    background: var(--ubk-blue);
}

.control-panel-counter.large-blue-icon .text,
.control-panel-counter.medium-blue-icon .text {
    color: var(--white);
    font-weight: bold;
}

/** Centered icons **/

.control-panel-interventions .icon,
.control-panel-reminders .icon,
.control-panel-alerts-header .icon {
    display: flex;
    align-items: center;
    justify-content: center;
}

.control-panel-interventions .icon img,
.control-panel-reminders .icon img {
    width: 2.5em;
    height: 2.5em;
}

.control-panel-alerts-header .icon img {
    width: 2em;
    height: 2em;
}

.control-panel-interventions .icon img.not-clickable {
    opacity: 0.3;
    pointer-events: none;
}

/** Intervention registry popup **/

.intervention-title-input-container {
    background-color: white;
    z-index: 999;
}

#intervention-popup-main {
    padding-bottom: calc(2.125rem + 0.5rem);
}

.nanda-container {
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    grid-template-areas:
            "selector comentario" /*"fecha comentario"*/
            "selector comentario";
    grid-gap: 1em;
    gap: 1em;
    min-height: 0;
    min-width: 0;
}

.nanda-container > * {
    min-width: 0;
}

.nanda-container-fecha {
    grid-area: fecha;
}

.nanda-container-fecha-content {
    background-color: var(--v-light-gray);
    border-radius: 1em;
}

.nanda-container-selector {
    grid-area: selector;
}

.nanda-container-comentario {
    grid-area: comentario;

    height: 6em;
    border-radius: 0.5em;
}

.fab-add-new-registry-container {
    position: absolute;
    right: calc(50% - 1.5em);
    bottom: calc(-90px + 1.5em);

    z-index: 2;

    display: flex;
    flex-flow: column nowrap;
    align-items: center;
}

.fab-add-new-registry {
    width: 3em;
    height: 3em;

    border-radius: 50%;
    box-shadow: 2px 2px 5px 0 var(--gray);
}

.nanda-container-item-size {flex: 1 100%}

@media screen and (min-width: 900px) {
    .nanda-container-item-size {flex: 0 50%;}
}

/************************************************************
 ***** APP MAIN CONTROL PANEL COMMUNICATIONS HAMBURGUER *****
 ************************************************************/

#control-panel-communications-hamburger {
    position: relative;
 }

#control-panel-communications-hamburger .cpch-icon--small {
    width: 1.5rem;
    height: 1.5rem;
    cursor: pointer;
    border-radius: .3rem;
}

#control-panel-communications-hamburger .cpch-action-btn {
    background: var(--ubk-blue);
    color: white;
    font-size: .9rem;
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    outline: 0;
    padding: .5rem .75rem;
    cursor: pointer;
    border-radius: .3rem;
}

#control-panel-communications-hamburger .cpch-hamburger-extra-options-container {
    position: absolute;
    background: var(--v-light-gray);
    width: max-content;
    top: 0rem;
    left: 3rem;
    border: solid 3px var(--ubk-blue);
    z-index: 99;
}

.cpch-hamburger-extra-options-container .cpch-hps-padding {
    padding: .5rem 3rem .5rem 3rem;
}