:root {

	--red-1: #fe7077;
	--red-3: #ce3242;
	
	--not-blk: #313131;
	
	--orange-900: #BDD781;	
	--orange-700: #BDD781;
	--orange-500: #BDD781;
	--orange-300: #D3E4AB;
	--orange-100: #EEF5E1;
		
	--pink-900:	#99D5EC;
	--pink-500:	#99D5EC;
	--pink-300:	#E6F5FB;
	--pink-100:   #F2FAFD;   /* poll subtle */
	
	--teal-100:   #E6F5F2;   /* habit subtle */
	
	--yellow-900: #FFB899;
	--yellow-500: #FFB899;
	--yellow-300: #FFDCCC;
	--yellow-100: #FFF1E8;
	
	--purple-900: #EBADE0;
	--purple-500: #EBADE0;
	--purple-300: #F5D6F0;
	

	--blue-900: #5B82FF;
	--blue-500: #BECDFF;
	--blue-300: #DEE6FF;
	
	--spaceblue-900: #19a5b8;
	--spaceblue-500: #A3DBE3;
	--spaceblue-300: #D1EDF1;
	
	--green-900: #A7C957;
	--green-500: #A7C957;
	--green-300: #A7C957;
	
	--error-900: #E05265;
	--error-500: #FA9494;
	
	--success-900: #A7C957;
	
    --grey-300: #E8E8EA;
    /*--grey-500: #D2D1D4; */
	--black-700: #34303E;
	
	--prt-sldr:#BDD781;
	--carb-sldr:#FFB899;
	--fat-sldr:#EBADE0;
	--cal-sldr:#99D5EC;
	
	--prt-crcl:#BDD781;
	--carb-crcl:#FFB899;
	--fat-crcl:#EBADE0;
	--cal-crcl:#99D5EC;
	--fbr-crcl: #92551C;
	--sgr-crcl: #F1C49A;
	
	--glt-popup: #BDD781;
	--vnt-popup: #EBADE0;
	--lst-popup: #FFB899;
	--slt-popup: #99D5EC;
	
	--btn-glt:#BDD781;
	--btn-glthover:#D3E4AB;
	
	--btn-lst:#FFB899;
	--btn-lsthover:#FFDCCC;
	
	--btn-vnt:#EBADE0;
	--btn-vnthover:#F5D6F0;
	
	--btn-slt:#99D5EC;
	--btn-slthover:#E6F5FB;
	
	--glt-picpopup: #BDD781;
	--vnt-picpopup: #EBADE0;
	--lst-picpopup: #FFB899;
	--slt-picpopup: #99D5EC;
	
	--yulis-notes-clr: #FFFFEB;
	
	--yuli-homehdr-new: #ffffff;
	--yuli-homehdr-brdr-new: #ffffff;
	--yuli-homehdr-clr-new: #34303E;	
	
	--yuli-poll: #FA9494;
	--yuli-poll-done: #A7C957;
	
	--infoz-: teal;
	--see-da-note: teal;
	
	--nulevi: teal;
	
	--fc-text-dark: #0F172A;   /* slate-900 */
}
/*Юли - НАЧАЛО*/
#WOD-VIEW .mdc-typography--body1 {
    font-size: 1.25rem;
    font-weight: 500;
    margin-top: 0 !important;
}

#DLG_ADMINBLOCKEXVIEW .dialog-title,
#DLG_WODVIEW .dialog-title,
#DLG_WODNOTES .dialog-title {
    background-color: var(--yellow-900) !important;
}

#DLG_ADMINBLOCKEXVIEW_CLOSE,
#DLG_WODNOTES_CLOSE,
#DLG_WODVIEW_CLOSE{
    color: var(--not-blk) !important;
    margin: 0 !important;
}

#EXERCISE_YOUTUBE_ICON,
#WOD-VIEW .mdc-typography.mdc-a.mdc-sys,
#DLG_ADMINBLOCKEXVIEW_CNT a {
    /*color: var(--nulevi) !important;*/
    font-size: 1rem;
    /*font-style: italic;*/
    font-weight: 500;
}

#EXERCISE_TITLE  {
    font-size: 1rem;
    font-style: bold;
    font-weight: 600;
} 

.wod-class.mdc-data-table__cell {
    padding-top: .5rem !important;
}


.wod-class .mdc-button__label,
#USER_TPS .mdc-button__label {
    color: var(--nulevi);
    font-size: 1rem;
    font-style: bold;
    font-weight: 600;
    text-shadow: 0 0 2px #FFFFFF; /* Много лек бял контур */

}

#USER_TPS .mdc-typography.mdc-a {
    color: var(--see-da-note) !important;
}

#USER_TPS {
    min-height: calc(100vh - 60px);
}

.wod-class .mdc-a__icon {
    color: transparent;
    font-size: 1rem;
    font-style: bold;
    font-weight: 600;
}

.mdc-layout-grid__cell--span-9,
.mdc-layout-grid__cell--span-9-desktop {
   box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
   border-radius: 16px;
   margin-bottom: 32px;
}

#DATA_ADMIN_EXERCISE_DETAIL_DATA_ADMIN_EXERCIS_FULL .mdc-layout-grid__cell--span-9, 
#DIET-MARCOS-TAB .mdc-layout-grid__cell--span-9{
    /* Вашите CSS правила */
    box-shadow: none;
    border-radius: 0;
    margin-bottom: 10px;
}

body.device-desktop .cofession-date-wrapper {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px;
  padding:1rem 0;
}

body.device-desktop .total-for-day {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px;
  margin-top: 16px;
  padding-left: 16px;
}

body.device-desktop .total-for-day-target {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px;
  padding: 16px 0;
  margin-top: 16px;
}

/*Да има още малко място под въглехидратите при слайдерите - НАЧАЛО*/
body.device-desktop .total-for-day-target:last-child {
    padding-bottom: 4px;
}
/*Да има още малко място под въглехидратите при слайдерите - КРАЙ*/


/*За мобилно са следващите редове: */
body.device-mobile .cofession-date-wrapper {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px !important;
  padding:1rem 0 !important;
  margin: .5rem;
  /*За да подреди на един ред инфото и календара*/
    display: inline-flex;
    width: calc(100% - 1rem);
    justify-content: space-between;
}


/*От Чатко за подредба на календара, инфото и името на дните - НАЧАЛО*/
body.device-mobile .cofession-date-wrapper {
    display: flex;
    flex-direction: column;
}

body.device-mobile .cofession-date-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

body.device-mobile .date-navigation {
    display: flex;
    justify-content: space-between;
    width: auto;
    gap: 10px; /* Разстояние между датите */
}

body.device-mobile .diet-day-name {
    margin-top: 10px;
    text-align: center;
}
/*От Чатко за подредба на календара, инфото и името на дните - КРАЙ*/





#CONFESSDAYMOBILETOP {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px !important;
  padding:1rem 0 !important;
  margin: .5rem;
  height: 130px !important;
  /*font-size: 0.875rem !important;*/
}

@media (max-width: 479px) {
    
    
    #CONFESSDAYMOBILETOP1 .total-for-day {
    position: unset!important;
    }
    
    #CONFESSDAYMOBILETOP1  #mobileSliders {
        display: flex !important;
    }
    
#CONFESSDAYMOBILETOP1 {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.pie-canvas-cnt {
    order: 1;
}

.pie-canvas-legend {
    order: 2;
}

#mobileSliders {
    order: 3;
}
}

@media (max-width: 479px) {
/*body.confession-page.device-mobile.mdc-layout-grid__cell.mdc-data-table__table, .mdc-layout-grid__cell--span-12.mdc-data-table__table {*/
#event-table.mdc-layout-grid__cell.mdc-layout-grid__cell--span-12.mdc__media-enhanced {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 1rem !important;
    margin: .5rem !important;
        }
}

#FRM_LOGIN_CONTENT .mdc-layout-grid__cell.mdc-layout-grid__cell--span-12.mdc__media-enhanced 
{
    /* маха картата от полетата за прякор и парола */
    box-shadow: none !important;
    border-radius: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    /*margin-bottom: 10px;*/
}

#LOGINIMGT {
    padding: 10px;
}


@media (min-width: 480px) and (max-width: 839px) {
#event-table.mdc-layout-grid__cell.mdc-layout-grid__cell--span-12.mdc__media-enhanced {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 1rem !important;
    margin: .5rem !important;
        }
}

@media (min-width: 840px) and (max-width: 1279px) {
#event-table.mdc-layout-grid__cell.mdc-layout-grid__cell--span-12.mdc__media-enhanced {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 1rem !important;
    margin: .5rem !important;
        }
}


@media (min-width: 480px) and (max-width: 1279px) {
    
    
    #CONFESSDAYMOBILETOP1 .total-for-day {
    position: unset!important;
    display: flex !important;
    }
    
    #CONFESSDAYMOBILETOP1  #mobileSliders {
        display: flex !important;
        width: calc(65vw - 110px) !important;
    }
    
    #CONFESSDAYMOBILETOP1 {
        display: flex;
        justify-content: space-between;
        align-items: center;
    }
    
    .total-for-day {
        order: 1;
    }
    
    #mobileSliders {
        order: 2;
    }
    
    #pie-wrapper-DAYMACROSSHOW {
        position: relative !important;
    }
    
        #CONFESSDAYMOBILETOP1 .total-for-day .pie-canvas .pie-canvas-legend {
            display: inline-block !important;
            position: absolute;
            padding-left: 120px !important;
            margin-top: 0 !important;
            width: 165px;
        }
    
    #pie-wrapper-DAYMACROSSHOW {
        display: flex;
        justify-content: space-between;
        align-items: center;
        position: relative !important;
    }
    
    .pie-canvas-cnt {
        order: 1;
    }
    
    #CONFESSDAYMOBILETOP1 .total-for-day .pie-canvas .pie-canvas-legend {
        order: 2;
    }

    #DAYMACROSSHOW-legend {
        font-size: 14px;
    }
}


/*Да излизат попъпите на греховете малко под 100% на мобилното (да има отляво и отдясно по малко място) - НАЧАЛО*/
body.device-mobile #DLG_CONFESSINGVANITY .mdc-dialog__surface, body.device-mobile #DLG_CONFESSINGTRAINING .mdc-dialog__surface, body.device-mobile #DLG_CONFESSINGGREED .mdc-dialog__surface, body.device-mobile #DLG_CONFESSINGFOODN .mdc-dialog__surface, body.device-mobile #DLG_FOODNEW .mdc-dialog__surface {
    width: 95vw !important;
    max-width: 95vw !important;
}
/*Да излизат попъпите на греховете малко под 100% на мобилното (да има отляво и отдясно по малко място) - КРАЙ*/


/*Да са раздалечени редовете на анкетите и да станат като бутони - НАЧАЛО*/

tr.poll:not(.poll-done) span {
    padding: 6px;
    margin-top: 10px;
    color: #fff !important;
    background-color: var(--not-blk) !important;
    border: 1px solid var(--not-blk);
    border-radius: 25px;
}

tr#dietday.poll-done span { 
    padding: 6px;
    margin-top: 10px;
    border: 1px solid var(--not-blk);
    border-radius: 15px;
    color: var(--not-blk) !important;
}

tr#dietday.poll-done th, tr#dietday.poll-done td {
    border-top: 10px solid #fff;
    border-left: 0;
    border-right: 0;
    font-size: 1rem; /* Увеличаване на размера на шрифта */
    font-weight: bold; /* Удебеляване на текста */
    /* cursor: pointer; Показване на ръка като курсор */
    position: relative; /* За да може да се позиционира икона спрямо текста */
}

tr#dietday.poll-done span:hover {
    padding: 6px;
    margin-top: 10px;
    border: 1px solid #858585;
    border-radius: 25px;
    color: #fff !important;
    background-color: #858585 !important;
}

tr.poll span:hover {
    padding: 6px;
    margin-top: 10px;
    border: 1px solid #858585;
    border-radius: 25px;
    color: #fff !important;
    background-color: #858585 !important;
    border-radius: 25px;
}

tr.main-tr.poll th, tr.main-tr.poll td {
    /*border-top: 10px solid #fff;*/
    border-left: 0;
    border-right: 0;
    font-size: 1rem; /* Увеличаване на размера на шрифта */
    font-weight: bold; /* Удебеляване на текста */
    /* cursor: pointer; Показване на ръка като курсор */
    position: relative; /* За да може да се позиционира икона спрямо текста */
}


tr.main-tr.poll.poll-done th, tr.main-tr.poll.poll-done td {
    /*border-top: 10px solid #fff;*/
    border-left: 0;
    border-right: 0;
    font-size: 1rem;
    color: var(--not-blk);
    background-color: #fff;
    font-weight: bold; /* Удебеляване на текста */
    /* cursor: pointer; Показване на ръка като курсор */
    position: relative; /* За да може да се позиционира икона спрямо текста */
}

tr.main-tr.poll.poll-done th:hover, tr.main-tr.poll.poll-done td:hover {
    /*border-top: 10px solid #fff;*/
    border-left: 0;
    border-right: 0;
    font-size: 1rem;
    font-weight: bold; /* Удебеляване на текста */
    /*cursor: pointer;  Показване на ръка като курсор */
    position: relative; /* За да може да се позиционира икона спрямо текста */
}

/*Да са раздалечени редовете на анкетите и да станат като бутони - КРАЙ*/

/*Бутоните на анкетите за мобилно да им се намали текстът малко - НАЧАЛО*/

@media (max-width: 1279px) {
    tr#dietday.poll-done th, tr#dietday.poll-done td {
        font-size: .875rem !important;
    }
    
    tr.main-tr.poll th, tr.main-tr.poll td {
        font-size: .875rem !important;
    }
    
    
    tr.main-tr.poll.poll-done th, tr.main-tr.poll.poll-done td {
        font-size: .875rem !important;
    }
    
    tr.main-tr.poll.poll-done th:hover, tr.main-tr.poll.poll-done td:hover {
        font-size: .875rem !important;
    }
}
/*Бутоните на анкетите за мобилно да им се намали текстът малко - КРАЙ*/

/*Още малко по анкетите - предаването им - НАЧАЛО*/
#DLG_POLLSHOWUSER_CLOSE, button.dialog-close {
    background-color: transparent !important;
}

.submit-the-poll {
    text-transform: math-auto !important;
    color: #fff !important;
    background-color: var(--not-blk) !important;
    border: 1px solid var(--not-blk) !important;
    border-radius: 25px !important;
}

.mdc-button.has-ripple.mdc-sys.submit-the-poll.mdc-ripple-upgraded {
    float: right;
    margin-top: 10px;
}

.submit-the-poll:hover {
    /*cursor: pointer;*/
    color: #fff !important;
    background-color: #858585 !important;
    border: 1px solid #858585 !important;
    border-radius: 25px !important;
}


#DLG_POLLUSER_CLOSE {
    color: var(--not-blk) !important;
    margin-right: 5px;
}

#DLG_POLLSHOWUSER_TTL, #DLG_POLLUSER_TTL {
    color: rgba(0, 0, 0, 0.6);
}

/*Още малко по анкетите - предаването им - КРАЙ*/

/*Лакомия - избиране на храни малко да го пооправя - НАЧАЛО!*/
#DLG_CONFESSINGFOODN_CNT #CFR .gridFood {
    border-bottom: 1px solid var(--orange-300) !important;
}
/*Лакомия - избиране на храни малко да го пооправя - КРАЙ!*/



/*Да се отместят още малко по-надолу бутоните с греховете и да са по-широки - НАЧАЛО*/
.confession-page.confession.device-desktop #CONFESSDAY-LEFT .header-main .event-options {
    padding-top: 20px !important;
}

#CONFESSDAY-LEFT .event-options button {
    width: 25%;
}
/*Да се отместят още малко по-надолу бутоните с греховете и да са по-широки - КРАЙ*/

/*Да направим х-са на анкетите им черен вместо бял - НАЧАЛО*/
#DLG_POLLSHOWUSER_CLOSE i {
    color: rgba(0, 0, 0, 0.87) !important;
}
/*Да направим х-са на анкетите им черен вместо бял - КРАЙ*/


/*Да направим задачите (анкетите, избор на храноден и избор на тренировка (като стане)) като бутони - НАЧАЛО*/
/**/

/*Да направим задачите (анкетите, избор на храноден и избор на тренировка (като стане)) като бутони - КРАЙ*/


/*Да няма черта отгоре на първия ред (грях, колко, какво,...) - НАЧАЛО*/
.mdc-data-table__row:first-child {
    border-top: 0 !important;
}
/*Да няма черта отгоре на първия ред (грях, колко, какво,...) - КРАЙ*/


/*Надписи горе вляво на картите за календар, отчетени и разчетени стойности - НАЧАЛО*/
.icon-calendar-empty {
    display: flex;
    padding-left: 16px;
    padding-bottom: 8px;
}

.ime-na-kalendara {
    color: var(--black-700) !important;
    font-size: inherit;
}

.icon-sliders {
    display: flex;
    color: var(--black-700) !important;
    padding-top: 16px;
}

.ime-total-for-day {
    color: var(--black-700) !important;
    font-size: inherit;
}

.icon-tasks {
    display: flex;
    color: var(--black-700) !important;
    padding-left: 16px;
    padding-bottom: 16px;
}

.ime-na-day-target {
    color: var(--black-700) !important;
    font-size: inherit;
}

/*Надписи горе вляво на картите за календар, отчетени и разчетени стойности - КРАЙ*/


/*Подчертавка на табовете на диети и тренировки - НАЧАЛО*/

/*#EATING-TABSS .mdc-tab-indicator .mdc-tab-indicator__content--underline, */
#USER_DIETS_CNT .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--orange-900) !important;
}

#WOD-VIEW .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--yellow-900) !important;
}

#WOD-VIEW .mdc-tab--active .mdc-tab__text-label {
    color: var(--black-700) !important;
}

/*#WOD-VIEW .paneldiv .accordion { {*/
/*    color: var(--yellow-900) !important;*/
/*}*/

#WOD-VIEW .paneldiv .panel.active {
border-bottom: 1px solid var(--yellow-900) !important;
}

#WOD-VIEW .paneldiv .accordion {
border-bottom: 1px solid var(--yellow-900) !important;
}

#WOD-VIEW .accorddblock .accordion.accorddblockc {
    background-color: var(--yellow-500) !important;
    margin-bottom: 10px;
    /*border-color: 1px solid var(--yellow-900) !important;*/
}

#WOD-VIEW .panel.active .accordion {
    background-color: var(--yellow-300) !important;
    border-left: 1px var(--yellow-900) !important;
    border-right: 1px var(--yellow-900) !important;
    border-top: 1px var(--yellow-900) !important;
    border-bottom: 1px var(--yellow-900) !important;
}


/*Pop-up-и на тренировките (блокове, акордеони и т.н.) - НАЧАЛО*/

/*Прави х-са горе вдясно черен, че беше син*/
#DLG_ADMINBLOCKVIEW_CLOSE.mdc-button:not(:disabled) {
  color: var(--not-blk);
}




/*Pop-up-и на тренировките (блокове, акордеони и т.н.) - КРАЙ*/

/*Часовете от до на греховете да ги приближи - НАЧАЛО*/
.ETFIELDS .etfieldsc .etfieldsctl {
    width: 30px !important;
}

@media (max-width: 479px) {
.ETFIELDS .etfieldsc .etfieldsctl {
    width: 20px !important;
    }
}
/*Часовете от до на греховете да ги приближи - КРАЙ*/



/*Бутоните Прибави, Провери и Премахни да ги намаля и направя в новия стил за 2-ри и 3-ти клас бутони - НАЧАЛО*/
body.device-desktop #search_food_found_selected {
    height: 165px !important;
}

/*#confessnfbtn-sn*/
/*#confessor-new-fse Провери*/
/*#confessor-new-frm Премахни*/

#confessnfbtn-sn, #confessor-new-fse, #confessor-new-frm {
    width: 51% !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    font-weight: 400 !important;
}

#CFRFC #confessnfbtn-sn, 
#CFRFC #confessor-new-fse, 
#CFRFC #confessor-new-frm {
    width: 100% !important;
}

#confessor-new-fse {
    border: 1px solid var(--not-blk) !important;
    background-color: #fff !important;
    color: var(--not-blk) !important;
    border-radius: 25px;
}

#confessor-new-fse :hover {
    cursor: pointer !important;
    /*border: 1px solid #858585 !important;*/
    /*background-color: #858585 !important;*/
    /*color: #fff !important;*/
    border-radius: 25px !important;
}

#confessnfbtn-sn, #confessor-new-frm {
    margin-top: 10px!important;
    color: #fff !important;
    background-color: var(--not-blk) !important;
    border: 1px solid var(--not-blk) !important;
    border-radius: 25px !important;
}

#confessnfbtn-sn :hover, #confessor-new-frm :hover {
    cursor: pointer !important;
    color: #fff !important;
    /*background-color: #858585 !important;*/
    /*border: 1px solid #858585 !important;*/
    border-radius: 25px !important;
}

#confessor-new-frm {
    margin-top: 10px!important;
    color: #fff !important;
    background-color: var(--not-blk) !important;
    border: 1px solid var(--not-blk) !important;
    border-radius: 25px !important;
}

#confessor-new-frm :hover {
    width: 250% !important;
    cursor: pointer !important;
    color: #fff !important;
    /*background-color: #858585 !important;*/
    /*border: 1px solid #858585 !important;*/
    border-radius: 25px !important;
}

/*Бутоните Прибави, Провери и Премахни да ги намаля и направя в новия стил за 2-ри и 3-ти клас бутони - КРАЙ*/

/*Бутон Изтрий за снимките да го направя като 3-ти клас бутон - НАЧАЛО*/

#DLG_BMIMG_CNT img {
    margin-bottom: 10px;
}


#DLG_BMIMG_CNT .mdc-sys {
    padding: 10px !important;
    font-weight: 400 !important;
    border: 1px solid var(--not-blk) !important;
    background-color: #fff !important;
    color: var(--not-blk) !important;
    border-radius: 25px;
}

#DLG_BMIMG_CNT .mdc-sys:hover {
    padding: 10px !important;
    font-weight: 400 !important;
    cursor: pointer !important;
    border: 1px solid #858585 !important;
    background-color: #858585 !important;
    color: #fff !important;
    border-radius: 25px !important;
}

/*Бутон Изтрий за снимките да го направя като 3-ти клас бутон - КРАЙ*/


/*Добавено до тук и сумарните да са в болд - НАЧАЛО*/

#CFRTOPGRIDVALS .txt-right {
    font-weight: bold;
}

#CFRTOPGRIDTXT {
    font-weight: bold !important;
}

#CFR .mdc-typography--body1 {
    font-weight: bold !important;
}
/*Добавено до тук и сумарните да са в болд - КРАЙ*/

/*Избери на Лакомия да се отмести наляво, че са много близо двата скрола - НАЧАЛО*/

.yuli-inside-scroll-glt {
    padding-right: 0.5rem;
}

#CNF-SEARCH-FOOD-SRB {
    padding-right: 0.5rem;
}
/*Избери на Лакомия да се отмести наляво, че са много близо двата скрола - КРАЙ*/


/*Акордеоните на Лакомия и табовете над тях да са в оранжево - НАЧАЛО*/
.paneldiv {
    margin-right: 20px;
}

#DLG_CONFESSINGFOODN_CNT .accordion {
    /*background-color: var(--orange-300) !important;*/
    background-color: #fff !important;
    border: 1.5px solid;
    border-color: var(--orange-900);
    margin-bottom:10px;
}

#DLG_CONFESSINGFOODN_CNT .paneldiv .panel.active {
    border-bottom: var(--orange-900) 1px solid;
    padding-bottom: 10px;
}   
 
#DLG_CONFESSINGFOODN_CNT .accordion.active{
    background-color: var(--orange-300) !important;
    border-bottom: 0;
    margin-bottom: 0 !important;
    padding-bottom: 10px;
}

#DLG_CONFESSINGFOODN_CNT .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--orange-900) !important;
}

/*Да оставим малко място от елементите до скрола вдясно*/
#DLG_CONFESSINGFOODN_CNT .mdc-field--fake-full-width:not(.newRecipeName):not(.newRecipePortions):not(.newRecipeGrams):not(.newRecipeTakenFrom):not(.newRecipePrepare):not(.newRecipeLink) {
    width: 98% !important;
    /*height: calc(30vh);*/

}

.newRecipeNeccesary, 
.newRecipeOptional {
    font-size: .875rem!important;
    font-style: italic !important;
    margin-top: 10px !important;
}

.newRecipeOptional {
    line-height: 0 !important;
}

/*Акордеоните на Лакомия и табовете над тях да са в оранжево - КРАЙ*/

/*Бутон Изповядай в Лакомия да е в оранжево - НАЧАЛО*/

#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f {
    background-color: var(--btn-glt) !important;
    border: 1px solid var(--btn-glt) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f i, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f i {
    text-transform: none !important;
    color: #000 !important;
    font-size: 1.25rem !important;
    height: 36px !important;
    line-height: 36px !important;
}

#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f:hover, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f:hover {
    background-color: var(--btn-glthover) !important;
    border: 1px solid var(--btn-glt) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGFOODN_CNT button.btn-new-type.btn-black-f:hover i, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGFOODN_CNT a.btn-new-type.btn-black-f:hover i {
    color: #000 !important;
    background-color: var(--btn-glthover) !important; 
    border-color: var(--btn-glt) solid !important; 
}

/*Бутон Изповядай в Лакомия да е в оранжево - КРАЙ*/



/*Акордеоните на Леност и табовете над тях да са в жълто - НАЧАЛО*/

.paneldiv {
    margin-right: 20px;
}

#DLG_CONFESSINGTRAINING_CNT .accordion {
    /*background-color: var(--yellow-300) !important;*/
    background-color: #fff !important;
    border: 1.5px solid;
    border-color: var(--yellow-900);
    margin-bottom:10px;
}

#DLG_CONFESSINGTRAINING_CNT .paneldiv .panel.active {
    border-bottom: var(--yellow-900) 1px solid;
    padding-bottom: 10px;
}   
 
#DLG_CONFESSINGTRAINING_CNT .accordion.active{
    background-color: var(--yellow-300) !important;
    border-bottom: 0;
    margin-bottom: 0 !important;
    padding-bottom: 10px;
}

#DLG_CONFESSINGTRAINING_CNT .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--yellow-900) !important;
}

/*Акордеоните на Леност и табовете над тях да са в жълто - КРАЙ*/

/*Бутон Изповядай в Леност да е в жълто - НАЧАЛО*/

#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f {
    background-color: var(--btn-lst) !important;
    border: 1px solid var(--btn-lst) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f i, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f i {
    text-transform: none !important;
    color: #000 !important;
    font-size: 1.25rem !important;
    height: 36px !important;
    line-height: 36px !important;
}

#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f:hover, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f:hover {
    background-color: var(--btn-lsthover) !important;
    border: 1px solid var(--btn-lst) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGTRAINING_CNT button.btn-new-type.btn-black-f:hover i, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGTRAINING_CNT a.btn-new-type.btn-black-f:hover i {
    color: #000 !important;
    background-color: var(--btn-lsthover) !important; 
    border-color: var(--btn-lst) solid !important; 
}

/*Бутон Изповядай в Леност да е в жълто - КРАЙ*/

/*Да оставим малко място от елементите до скрола вдясно*/
#DLG_CONFESSINGTRAINING_CNT #TOTALNMCNTR,
#DLG_CONFESSINGTRAINING_CNT .borderBmPurple,
#DLG_CONFESSINGTRAINING_CNT .mdc-field--fake-full-width{
    width: 98% !important;
    /*height: calc(100% - 100px);*/

}

/*Акордеоните на Суета и табовете над тях да са в лилаво - НАЧАЛО*/

.paneldiv {
    margin-right: 20px;
}

#DLG_CONFESSINGVANITY_CNT .accordion {
    /*background-color: var(--purple-300) !important;*/
    background-color: #fff !important;
    border: 1.5px solid;
    border-color: var(--purple-900);
    margin-bottom:10px;
}

#DLG_CONFESSINGVANITY_CNT .paneldiv .panel.active {
    border-bottom: var(--purple-900) 1px solid;
    padding-bottom: 10px;
}   
 
#DLG_CONFESSINGVANITY_CNT .accordion.active{
    background-color: var(--purple-300) !important;
    border-bottom: 0;
    margin-bottom: 0 !important;
    padding-bottom: 10px;
}

#DLG_CONFESSINGVANITY_CNT .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--purple-900) !important;
}

/*Да оставим малко място от елементите до скрола вдясно*/
#DLG_CONFESSINGVANITY_CNT .mdc-field--fake-full-width {
    width: 98% !important;
    /*height: calc(100% - 100px);*/

}

@media (max-width: 439px) {
    [id^="bm-list-txt-"] {
        font-size: .75rem !important;
    }
}

/*Акордеоните на Суета и табовете над тях да са в лилаво - КРАЙ*/

/*Бутон Изповядай в Суета да е в лилаво - НАЧАЛО*/

#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f {
    background-color: var(--btn-vnt) !important;
    border: 1px solid var(--btn-vnt) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f i, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f span, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f i {
    text-transform: none !important;
    color: #000 !important;
    font-size: 1.25rem !important;
    height: 36px !important;
    line-height: 36px !important;
}

#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f:hover, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f:hover {
    background-color: var(--btn-vnthover) !important;
    border: 1px solid var(--btn-vnt) !important;
    border-radius: 25px;
}

#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGVANITY_CNT button.btn-new-type.btn-black-f:hover i, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f:hover span, 
#DLG_CONFESSINGVANITY_CNT a.btn-new-type.btn-black-f:hover i {
    color: #000 !important;
    background-color: var(--btn-vnthover) !important; 
    border-color: var(--btn-vnt) solid !important; 
}

/*Бутон Изповядай в Суета да е в лилаво - КРАЙ*/

/*Да уголемя тескта на селекторите за средно и т.н. в Суета - НАЧАЛО*/
.select-change {
    font-size: 1rem;
    color: rgba(0, 0, 0, 0.6);
}
/*Да уголемя тескта на селекторите за средно и т.н. в Суета - КРАЙ*/

/*Нова храна, нова рецепта и създизповядай - НАЧАЛО*/

#CONFSSINGNEWFOODADDQUANTITY {
    font-size: 1rem;
}
/*Нова храна, нова рецепта и създизповядай - КРАЙ*/

/*Маха чертата над бутона Изповядай при греховете - НАЧАЛО*/
.dlgcnt .dlgfooter {
    border-top: none !important;
}
/*Маха чертата над бутона Изповядай при греховете - КРАЙ*/


/*Маха сивото оцветяване през ред на изповяданите храни*/
body.confession-page #event-table tr.even-tr th, body.confession-page #event-table tr.even-tr td, #ADMINPREVIEW #event-table tr.even-tr th, #ADMINPREVIEW #event-table tr.even-tr td {
    background-color: transparent !important;
}


/*Маха сивото оцветяване при кламерчето за качване на снимки*/
.mdc-text-field:not(.mdc-text-field--disabled) {
    background-color: transparent !important;
}

/*Таблицата в Изповедалня да я направя с по-големи Час, Грях и т.н. и други "довършителни" неща - НАЧАЛО!*/

/*body.confession-page #event-table thead tr:first-of-type td, #ADMINPREVIEW #event-table thead tr:first-of-type td {*/
/*        font-size: 21px;*/
/*}*/

.main-tr-eating, .time, .outer-calories, .outer-protein, .outer-fat, .outer-carbohydrates, .outer-suger, .outer-fiber, .main-tr-biometrics, .main-tr-training {
    font-weight: bold !important;
}

/*Заглавният ред най-отгоре да се отлиава повече*/
.h-ctrls, .h-time, .h-sin, .h-how, .h-what, .h-mcr {
    font-size: 1rem !important;
}

/*Това маха болда от оценките*/
.eating-rowinfo-wrap .eating-rowinfo-wrapl {
    font-weight: normal !important;
}

/*Таблицата в Изповедалня да я направя с по-големи Час, Грях и т.н. и други "довършителни" неща - КРАЙ!*/



/*На входа диалоговият прозорец да не е в бяло и синьо, а като останалите - НАЧАЛО*/

#DLG_ERR_CNT {
  background-color: #fff;
  color: var(--not-blk);
  padding: 0.5rem 0.5rem !important;
}


#DLG_ERR .dialog-title {
  background-color: var(--error-900);
  color: #fff;
  padding-left: 0.2rem !important;
}

#DLG_ERR .mdc-dialog__title {
  background-color: var(--error-900);
  color: #fff;
  padding: 0 0.3rem;
}

#DLG_ERR .mdc-button {
    color: #fff;
    background-color: var(--not-blk) !important;
    border: 1px solid var(--not-blk) !important;
    border-radius: 25px;
}

#DLG_ERR .mdc-button:hover {
    background-color: #858585 !important;
    border: 1px solid #858585 !important;
    border-radius: 25px;
}


#DLG_ERR footer.mdc-dialog__actions {
  border-top: 0px !important;
  margin-top: 0;
  padding: 0 0.5rem !important;
}

/*На входа диалоговият прозорец да не е в бяло и синьо, а като останалите - НАЧАЛО*/

/*Икони за помощ отварящи диалогов прозорец за повече инфо - КРАЙ*/
  .mdc-list-item[data-info]:hover::after {
    content: attr(data-info);
    position: absolute;
    background-color: black;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    top: -35px; /* Може да се регулира в зависимост от позицията */
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
    z-index: 1001;
    font-size: 12px;
    opacity: 0.9;
  }
/*Икони за помощ отварящи диалогов прозорец за повече инфо - КРАЙ*/

/*Маха оранжевата черта при въвеждане на храна на мобилно - НАЧАЛО!*/
#search_food_found_selected {
     border-bottom: 0 !important; 
     margin: 0!important; 
     padding: 0!important; 
}
/*Маха оранжевата черта при въвеждане на храна на мобилно - КРАЙ!*/



/*Кошницата - НАЧАЛО*/
/*@media (max-width: 839px) {*/
/*body.food-list.device-mobile #FOODLISTCAL .direction-row .food-list-cal-wrp i {*/
/*    font-size: 0.875rem !important;*/
/*    }*/
/*}*/

body.food-list.device-mobile #FOODLISTCAL .direction-row .food-list-cal-wrp {
  width: 160px !important;
  /*box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;*/
  /*border-radius: 16px !important;*/
  padding:1rem 0 !important;
  margin: .5rem;
}

#FOODLISTPERSONAL  {
  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
  border-radius: 16px !important;
  padding: 1rem 0 !important;
  margin: .5rem;
}

@media (max-width: 839px) {
    #FOODLISTCNT, #WEAKLYLIST .mdc-data-table__cell {
        font-size: 0.875rem !important;
        word-wrap: break-word !important;
        white-space: normal !important;
    }
}


@media (max-width: 839px) {
#WEAKLYLIST .wfl-total td:first-child,
#WEAKLYLIST .wfl-total th:first-child,
#WEAKLYLIST .wfl-food td:first-child,
#WEAKLYLIST .wfl-food tr:first-child,
#WEAKLYLIST .fl-header td:first-child,
#WEAKLYLIST .fl-header th:first-child,
/*body.food-list.device-desktop #WEAKLYLIST .wfl-food tr:first-child,*/
/*body.food-list.device-desktop #WEAKLYLIST .wfl-food td:first-child */
    {
        display: none;
        width: 0 !important;
    }
}


@media (max-width: 839px) {
.wfl-food td:first-child,
.wfl-food th:first-child, 
.wfl-total td:first-child,
.wfl-total tr:first-child,
.fl-header td:first-child,
.fl-header tr:first-child
    {
        display: none;
        width: 0 !important;
    }
}

@media (max-width: 839px) {
#WEAKLYLIST .wfl-total td:nth-child(2) {
        font-size: 0.875rem !important;
        word-wrap: break-word !important;
        white-space: normal !important;
        width: 3rem;
        padding-right:0.5rem;
}
}

@media (max-width: 839px) {
#WEAKLYLIST .wfl-total td:nth-child(3) {
        font-size: 0.875rem !important;
        word-break: break-all !important;
        white-space: normal !important;
        width: 4rem;
}
}

@media (max-width: 1279px) {
    #FOODLISTCNT {
        padding: 0 20px !important;
    }
}


#FOODLISTCAL .direction-row:nth-child(n+2) {
    display: none;
}

#FOODLISTCAL .food-list-cal-wrp:nth-child(n+3) {
    display: none;
}

@media (min-width: 840px){
    body.md5.device-desktop.foodlist {
  margin: 0;
  padding: 0;
  display: flex;
  justify-content: center;
 }
} 
 
@media (min-width: 1280px){
    body.md5.device-desktop.foodlist #HOME_HEADER_NEW, 
    body.md5.device-desktop.foodlist #FOODLISTCAL,
    #USER_TPS, #USER_DIETS, #FOODUSERPAGEN, #USER_EXERCISES, #USER_WODBLOCKS, #USER_MEASUREMENTS, #USER_CONSUMPTIONS {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto !important;
    padding: 0 20px !important;
}

    body.md5.device-desktop.foodlist #FOODLISTCNT {
        max-width: 1240px;
        padding: 0 20px !important;
    }
    
}
@media (min-width: 1280px){
    .program-dialog, [id^="programInfoDialog_"] {
        max-width: 1240px !important;
    }
}

@media (min-width: 1280px){
    #FOODLISTPERSONAL {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto !important;
    padding: 0 0px !important;
}

    body.md5.device-desktop.foodlist #FOODLISTCNT {
        max-width: 1240px;
        padding: 0 20px !important;
    }
    
}

@media (min-width: 1280px){
    body.md5.device-desktop.foodlist  {
    max-width: 1280px;
    width: 100%;
    margin: 0 auto;
    /*padding: 20px;*/
    
}
}

@media (min-width: 1280px){
body.md5.device-desktop.foodlist .mdc-list--bar-responsive {
    justify-content: space-between !important;
}
}

@media (min-width: 1280px){
body.md5.device-desktop.foodlist #ADD__ID {
    display: none;
}
}


@media (min-width: 1280px){
    #FOODLISTCNT, #WEAKLYLIST .mdc-data-table__cell {
        font-size: 0.875rem !important;
        word-wrap: break-word !important;
        white-space: normal !important;
    }
}

#WEAKLYLIST tr {
    border-bottom: none !important;
}

    #FOODLISTPERSONAL .yuli-infoz {
        padding: 0 20px !important;
    }
    
    
@media (max-width: 849px) {
   [id^="yuli_infoDialog_"],
   [id^="programInfoDialog_"] {
        width: 90%; /* 90% от ширината на екрана */
        height: 80%; /* 80% от височината на екрана */
        overflow-y: auto; /* Добавете вертикална скрол лента за дълго съдържание */
        padding: 10px; /* Добавете малко padding */
        top: 10%; /* Центрирайте вертикално, като зададете отстояние от горната част */
        left: 5%; /* Центрирайте хоризонтално, като зададете отстояние от лявата част */
        transform: none; /* Премахнете трансформацията, ако е необходимо */
    }
}

#yuli_infoDialog_vanity,
#yuli_infoDialog_gluttony,
#yuli_infoDialog_lust,
#yuli_infoDialog_vanitinfo {
        width: 90%; /* 90% от ширината на екрана */
        height: 80%; /* 80% от височината на екрана */
        overflow-y: auto; /* Добавете вертикална скрол лента за дълго съдържание */
        padding: 10px; /* Добавете малко padding */
        top: 10%; /* Центрирайте вертикално, като зададете отстояние от горната част */
        left: 5%; /* Центрирайте хоризонтално, като зададете отстояние от лявата част */
        transform: none; /* Премахнете трансформацията, ако е необходимо */
    }

/*Кошницата - КРАЙ*/


/*ЮЛИ - имена на картите, инфо иконка и диалоговите прозорци с обяснение - НАЧАЛО*/
/*.yuli-infoz {*/
/*    color: #313131ab !important;*/
/*}*/

#yuli_infoIcon_calendar a,
#yuli_infoIcon_calendar a:focus,
#yuli_infoIcon_calendar a:hover,
#yuli_infoIcon_calendar a:active,
#yuli_infoIcon_calendar.mdc-list-item::before,
#yuli_infoIcon_calendar.mdc-list-item::after {
    background-color: transparent !important;
    box-shadow: none !important; /* Премахва потенциален shadow ефект */
    border: none !important; /* Премахва потенциална border */
}

#yuli_infoIcon_calendar i {
    background-color: transparent !important;
    /*padding: 0 !important;*/
    /*height: 20px !important;*/
}

#yuli_infoIcon_calendar {
    background-color: transparent !important;
    padding: 0 !important;
    height: 30px !important;
}


.yuli_info_icons {
    padding-right: 0 !important;
    margin-right: 0 !important;
    height: 30px !important;
    width: 30px !important;
}

.infos-list {
    list-style-type: none; /* Remove default bullet points */
    padding-left: 0; /* Remove default padding */
}

.infos-list li::before {
    content: "👉"; /* Use a hand symbol (you can replace with any other symbol) */
    margin-right: 8px; /* Add some space between the symbol and the text */
    font-size: 16px; /* Adjust size of the symbol if necessary */
}



.btn-navbar-spaceblue.hdnotes {
    display: none;
}
/*ЮЛИ - имена на картите, инфо иконка и диалоговите прозорци с обяснение - КРАЙ*/

@media (min-width: 1280px) {
    body.md5.diets {
        max-width: 1280px;
        width: 100%;
        margin: 0 auto;
        /* padding: 20px; */
    }
    
    body.md5.work {
        max-width: 1280px;
        width: 100%;
        margin: 0 auto;
        /* padding: 20px; */
    }
}

#USER_DIETS, #USER_TPS, #USER_EXERCISES, #USER_WODBLOCKS, #USER_MEASUREMENTS_CNT, #USER_CONSUMPTIONS {
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 0 !important;
    margin: .5rem;
}

#USER_TPS .mdc-layout-grid__cell--span-3,
#USER_TPS .mdc-layout-grid__cell--span-4,
#USER_EXERCISES .mdc-layout-grid__cell--span-3,
#USER_EXERCISES .mdc-layout-grid__cell--span-4,
#USER_WODBLOCKS .mdc-layout-grid__cell--span-3,
#USER_WODBLOCKS .mdc-layout-grid__cell--span-4,
#USER_MEASUREMENTS .mdc-layout-grid__cell--span-3,
#USER_MEASUREMENTS .mdc-layout-grid__cell--span-4,
#USER_CONSUMPTIONS .mdc-layout-grid__cell--span-3,
#USER_CONSUMPTIONS .mdc-layout-grid__cell--span-4 {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 0 !important;
}

/*@media (max-width: 479px) {*/
/*    #USER_TPS .mdc-layout-grid__cell--span-3,*/
/*    #USER_TPS .mdc-layout-grid__cell--span-4,*/
/*    #USER_EXERCISES .mdc-layout-grid__cell--span-3,*/
/*    #USER_EXERCISES .mdc-layout-grid__cell--span-4,*/
/*    #USER_WODBLOCKS .mdc-layout-grid__cell--span-3,*/
/*    #USER_WODBLOCKS .mdc-layout-grid__cell--span-4{*/
/*        margin: 0 1rem;*/
/*    }*/
/*}*/


#USER_DIETS_CNT .mdc-card {
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    /*padding: 1rem 0 !important;*/
    /*margin: .5rem;*/
}

#USER_DIETS_CNT {
    margin-top: 0 !important;
}

#USER_DIETS_CNT .mdc-tab-bar__navigation,
#USER_TPS .mdc-tab-bar__navigation {
    padding-left: 24px;
    padding-right: 24px;
}

.confession-page.confession.device-desktop #CONFESSDAY-LEFT .header-main {
  height: 100px !important;
}

#USER_TPS .mdc-card,
#USER_EXERCISES .mdc-card,
#USER_WODBLOCKS .mdc-card,
#USER_MEASUREMENTS .mdc-card,
#USER_CONSUMPTIONS .mdc-card {
    box-shadow: none !important;
    -webkit-box-shadow: none !important; 
}


/*.yuli_diet_name {*/
/*    font-weight: 600;*/
/*    font-style: italic;*/
/*    text-decoration: none; color: var(--infoz-) !important;*/
/*    padding-left: 24px;*/
/*}*/


@media (max-width: 849px) {
    #yuli_infoDialog_tantalus, #yuli_infoDialog_diet {
        width: 90%; /* Увеличава ширината на диалога до 90% от ширината на екрана */
        max-height: 80vh; /* Ограничаваме височината до 80% от височината на екрана */
        overflow-y: auto; /* Добавя вертикален скрол, ако съдържанието е по-дълго от контейнера */
        padding: 20px; /* Добавя отстъп за съдържанието вътре */
    }
}

/*Оправя цвета на хедъра и х-са на диалоговия прозорец "Виж повече за..." за ден от диета - НАЧАЛО*/
#DLG_DIETNOTES .dialog-title {
    background-color: var(--orange-900) !important;
}

#DLG_DIETNOTES div.dialog-title button {
    background-color: var(--orange-900) !important;
}

#DLG_DIETNOTES_CLOSE {
    color: var(--not-blk) !important;
    margin: 0 0 !important;
}
/*Оправя цвета на хедъра и х-са на диалоговия прозорец "Виж повече за..." за ден от диета - КРАЙ*/


/*Оправя самия надпис "Виж повече за..." за ден от диета - НАЧАЛО*/
#DIET-VIEW.mdc-card__head.mdc-card__head-subtitle {
    color: var(--not-blk) !important;
    font-size: 1rem !important;
    line-height: 1rem !important;
    font-style: italic;
    line-height: 2.5rem !important;
}


/*Оправя самия надпис "Виж повече за..." за ден от диета - КРАЙ*/

#USER_DIETS_CNT .mdc-card__head .mdc-card__head-subtitle,
#USER_PROGRAMS_CNT .mdc-card__head .mdc-card__head-subtitle{
    color: var(--not-blk) !important;
    font-size: .875rem !important;
    line-height: 1.5rem !important;
    font-style: italic;
    height: 140px !important;
    /*line-height: 2.5rem !important;*/
}

#USER_DIETS_CNT .mdc-typography.mdc-a {
    color: var(--see-da-note) !important;
}

.tantalus_three_tabs {
    padding: 0 24px;
    width: calc(100% - 48px) !important;
}


.sisyphus_three_tabs {
    padding: 0 24px;
    width: calc(100% - 48px) !important;
}

#USER_TPS .mdc-tab-indicator .mdc-tab-indicator__content--underline {
    border-color: var(--yellow-900) !important;
}

#USER_DIETS_CNT .mdc-tab__text-label,
#USER_TPS .mdc-tab__text-label{
    color: var(--not-blk) !important;
}
/*Всичко това ще е за Рога - най-тегавото, което остана :) - НАЧАЛО*/

/*body.food-page #FOODUSERPAGEN .mdc-card__text {*/
   /* height: 60px !important;  Прави място отдолу за сърцето и окото, за да не се застъпват със стойностите */
/*}*/


#RECIPEMAIN .P-recipe_page_number button {
    border: none !important; /* Премахва границата */
}

#RECIPEMAIN .select-change {
    font-size: medium;
}

#RECIPEMAIN .button.btn-new-type span, button.btn-new-type i, a.btn-new-type span, a.btn-new-type i {
    font-size: 1rem !important;
}

#FOODNEWCNT .mdc-layout-grid__cell--span-3 {
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 0 !important;
    /*margin: .5rem;*/
}

#FOODNEWCNT .mdc-card__head {
    height: 2.4rem !important;
}

#FOODNEWCNT .mdc-card__head-title  {
    font-size: 1rem;
    line-height: 1.2rem; /* Това е височината на един ред */
    /* max-height: 2.4rem;  2 реда по 1.2rem */
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2; /* Ограничаване до 2 реда */
    white-space: normal;
    text-overflow: ellipsis;
}



@media (min-width: 850px) {
#FOODNEWCNT div[id^="FOOD-CELL-"] .mdc-card {
    box-shadow: none !important;
    -webkit-box-shadow: none !important; 
}
}

@media (max-width: 849px) {
#FOODNEWCNT .mdc-card.mdc-card {
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    width: 100% !important;
    margin: 24px 0 !important;
    }
}

/*@media (min-width: 850px) {*/
    #FOODUSERPAGEN {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 24px !important;
    margin: .5rem;
    }
/*}*/


@media (min-width: 1280px) {
    body.md5.device.food-page.foods.device-desktop {
        max-width: 1280px;
        width: 100%;
        margin: 0 auto;
        /* padding: 20px; */
    }
}

#FOODNEWCNT .mdc-layout-grid__inner {
    grid-gap: 24px !important;
    padding-top: 14px;
}

/*@media (min-width: 1280px) {*/
/*    #RECIPEMAIN .mdc-layout-grid__cell--span-10 {*/
/*    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;*/
/*    border-radius: 16px !important;*/
/*    padding: 1rem 1rem !important;*/
/*    margin: .5rem;*/
/*}*/

/*@media (min-width: 1280px) {*/
/*    #RECIPEMAIN {*/
/*    display: inline-grid !important;*/
/*    }*/
/*}*/

/*@media (min-width: 1280px) {*/
/*    #roga_grid1, #roga_grid2, #roga_grid3 {*/
/*    display: inline-block !important;*/
/*    }*/
/*}*/

/*@media (min-width: 1280px) {*/
/*        .mdc-layout-grid__inner {*/
/*        grid-template-columns: none!;*/
/*}*/
/*}*/


/*ЮЛИ - акордеоните за филтри на Рога - НАЧАЛО*/


.roga_accordion-section {
    border: 1px solid #ccc;
    border-radius: 4px;
    margin-bottom: 10px;
}

.roga_accordion-checkbox {
    display: none;
}

.roga_accordion-title {
    background-color: #f7f7f7;
    cursor: pointer;
    padding: 10px;
    font-weight: bold;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-radius: 4px;
    margin: 0;
}

.roga_accordion-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s ease-out;
    padding: 0;
    border-top: 1px solid #ccc;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    position: relative;
}

.roga_accordion-checkbox:checked ~ .roga_accordion-content {
    max-height: 500px; /* Adjust according to the content */
    padding: 10px;
    transition: max-height 0.3s ease-in;
    overflow-y: auto; /* Add scroll if content exceeds max-height */
}

@media (max-width: 439) {
    .roga_accordion-checkbox:checked ~ .roga_accordion-content {
        max-height: 400px; /* Adjust according to the content */
    }
}


.roga_accordion-checkbox:checked ~ .roga_accordion-title .toggle-icon {
    transform: rotate(45deg); /* Change "+" to "-" */
}

.toggle-icon {
    font-size: 18px;
    transition: transform 0.3s ease;
}

.close-filters-button {
    background-color: #f7f7f7;
    border: none;
    padding: 10px;
    cursor: pointer;
    text-align: center;
    margin-top: 10px;
    font-weight: bold;
    border-top: 1px solid #ccc;
    width: 100%;
    border-radius: 0 0 4px 4px;
}

.close-filters-button:hover {
    background-color: #e0e0e0;
}



/*ЮЛИ - акордеоните за филтри на Рога - КРАЙ*/

/*ЮЛИ - 6-те контейнера в Рога - НАЧАЛО*/




@media (min-width: 1280px) {
    .top-search-roga {
      width: 570px;
    }
}

@media (min-width: 850px) and (max-width: 1279px) {
    .top-search-roga {
      width: 360px;
    }
}

@media (min-width: 440px) and (max-width: 849px) {
    .top-search-roga {
      width: 400px;
    }
}

@media (max-width: 439px) {
    .top-search-roga {
      width: 330px;
    }
}

@media (min-width: 850px) {
    #roga_6containers {
        display: grid;
        grid-template-columns: repeat(6, 1fr); /* 6 колони грид */
        gap: 10px; /* Промеждутък между контейнерите, по желание */
    }
}

@media (max-width: 849px) {
    #roga_6containers {
        display: grid;
        grid-template-columns: repeat(3, 1fr); /* 4 колони грид */
        gap: 10px; /* Промеждутък между контейнерите, по желание */
        width: 100%;
        /*margin-left: 2vw;*/
    }
}

@media (min-width: 850px) {
    #roga_container3 {
        grid-column: span 3; /* Филтри */
        grid-row: 1;
    }
}

@media (max-width: 849px) {
    #roga_container3 {
        grid-column: span 4; /* Филтри */
        grid-row: 2;
    }
}

@media (min-width: 850px) {
    #roga_container2 {
        grid-column: span 1; /* Изчисти филтрите */
        grid-row: 1;
    }
}

@media (max-width: 849px) {
    #roga_container2 {
        grid-column: span 1; /* Изчисти филтрите */
        grid-row: 3;
        justify-self: left;
    }
}

@media (min-width: 850px) {
    #roga_container1 {
        grid-column: span 2; /* Търси */
        grid-row: 2;
    }
}

@media (max-width: 849px) {
    #roga_container1 {
        grid-column: span 4; /* Търси */
        grid-row: 4;
    }
}

@media (min-width: 850px) {
    #roga_container_buttons {
        grid-column: span 3; /* Акордеон за Нова храна и нова рецепта */
        grid-row: 1;
    }
}

@media (max-width: 849px) {
    #roga_container_buttons {
        grid-column: span 4; /* Акордеон за Нова храна и нова рецепта */
        grid-row: 1;
    }
}


@media (min-width: 850px) {
    #roga_container6 {
        grid-column: span 2; /* Сорт */
        grid-row: 2;
        justify-self: center;
    }
}

@media (max-width: 849px) {
    #roga_container6 {
        grid-column: span 2; /* Сорт */
        grid-row: 5;
    }
}

@media (min-width: 1280px) {
    #roga_container7 {
        grid-column: span 2; /* Намерени */
        grid-row: 2;
        justify-self: center;
    }
}

@media (min-width: 850px) and (max-width: 1279px) {
    #roga_container7 {
        grid-column: span 1; /* Намерени */
        grid-row: 2;
    }
}  

@media (max-width: 849px) {
    #roga_container7 {
        grid-column: span 2; /* Намерени */
        grid-row: 5;
    }
}
    

@media (min-width: 1280px) {
    #roga_container8 {
        grid-column: span 2; /* Страниране */
        grid-row: 3;
    }
}

@media (min-width: 850px) and (max-width: 1279px) {
    #roga_container8 {
        grid-column: span 3; /* Страниране */
        grid-row: 3;
    }
}

@media (max-width: 849px) {
    #roga_container8 {
        grid-column: span 4; /* Страниране */
        grid-row: 6;
    }
}
   
@media (max-width: 439px) {
    #roga_container_buttons .options-buttons {
        display: flex;
        flex-direction: column; /* Подрежда бутоните вертикално */
        gap: 10px; /* Добавя разстояние между бутоните */
        padding: 10px;
    }
    
    .new-food-button, .new-recipe-button {
        width: 100%; /* Задава бутоните да заемат цялата ширина на контейнера */
        text-align: center;
        margin-top: 5px;
    }
}

@media (min-width: 440px)  {
    #roga_container_buttons .options-buttons {
        display: flex;
        flex-direction: row; /* Подрежда бутоните вертикално */
        gap: 10px; /* Добавя разстояние между бутоните */
        padding: 10px;
    }
    
    .new-food-button, .new-recipe-button {
        width: 50%; /* Задава бутоните да заемат цялата ширина на контейнера */
        text-align: center;
        /*margin-top: 5px;*/
    }
}
   
   
@media (max-width: 439px) {
   #RECIPEMAIN .CLEARFILTER {
    width: calc(100% - 20px) !important;
    margin-bottom: 1rem;
    margin-left: 10px;
    }
}  

@media (min-width: 440px) and (max-width: 849px) {
   #RECIPEMAIN .CLEARFILTER {
    width: calc(50% - 15px) !important;
    margin-bottom: 1rem;
    margin-left: 10px;
    }
}  

@media (min-width: 850px) {
   #RECIPEMAIN .CLEARFILTER {
    width: calc(50% - 20px) !important;
    margin-bottom: 1rem;
    }
}  

#roga_container_buttons .roga_accordion-content {
    padding: 0;
}

#roga_container8 {
    float: right;
}


#FOODNEWCNT .mdc-card {
    padding: 16px;
}

#FOODNEWCNT .mdc-card__media.mdc-card__media--16-9 {
    width: 100%;    
    border-radius: 8px;
}

/*ЮЛИ - 6-те контейнера в Рога - КРАЙ*/


/*@media (min-width: 850px) {*/
/*            #FOODNEWCNT {*/
/*                display: grid !important;*/
/*                grid-template-columns: repeat(3, 2fr); !important;*/
/*            }*/
/*}*/

/*Всичко това ще е за Рога - най-тегавото, което остана :) - КРАЙ*/


/*На голям екран какво и от-до да са на един ред - НАЧАЛО*/

@media (min-width: 849px) {
	#TOTALNMCNTR {
		display: flex !important;
	}


	.ETFIELDS .etfieldsc .etfieldsctl {
		width: 82px !important;
	}

    .etfieldsctl {
		padding-left: 1rem !important;
	}
}
/*На голям екран какво и от-до да са на един ред - КРАЙ*/


/*Крия бутона за Леност на мобилно - НАЧАЛО*/
.hdnotes {
    display: none;
}
/*Крия бутона за Леност на мобилно - КРАЙ*/

#DLG_FOODNEW_TTL, #DLG_CONFESSINGFOODN {
    display:flex;
}

/*.add-new-food-html-icon,*/
/*.create-and-confess-new-food-html-icon {*/
#DLG_CONFESSINGTRAINING_TTL,
#DLG_CONFESSINGVANITY_TTL {
    display: flex;
}


#DLG_FOODNEW_TTL .infoz-iconz,
#DLG_CONFESSINGTRAINING_TTL .infoz-iconz,
#DLG_CONFESSINGVANITY_TTL .infoz-iconz,
#DLG_CONFESSINGFOODN .infoz-iconz {
    font-size: 24px;
    display: flex;
    justify-content: space-around;
    align-items: self-end;
    padding-left: .5rem;
    padding-top: .25rem;
    height: auto;
    vertical-align: middle;
}

div[id^="programDialog_"] .infoz-icon {
    font-size: 24px;
    justify-content: space-around;
    align-items: self-end;
    padding-left: .5rem;
    height: auto;
    vertical-align: middle;
}



#DLG_CONFESSINGFOODN h2 {
    display: flex;
    /*justify-content: space-around;*/
    /*align-items: self-end;*/
    /*padding-right: .5rem;*/
    /*padding-top: .25rem;*/
    /*height: auto;*/
    /*vertical-align: middle;*/
}

#FOODNEWADD-FRMSV_CONTENT .mdc-layout-grid__cell--span-12.mdc__media-enhanced {
    padding-top: 1rem;
}

.infoz-iconz {
    color: rgba(0, 0, 0, 0.87);
}


#search_food_found_list .pError {
    color: rgba(0, 0, 0, 0.87) !important;
}

#search_food_found_list .btn-new-type {
    margin-top: 2rem !important;
}

@media only screen {
    .target-wrapper {
        padding-bottom: 0 !important;
    }
    
    .target-diff span {
        font-size: 14px !important;
    }
}




.glutinfo-tabs,
.cloneinfo-tabs,
.createinfo-tabs {
    display: flex;
    justify-content: space-between;
    /*background-color: #f1f1f1;*/
    /*padding: 10px 0;*/
}

.glutinfo-tab-button,
.cloneinfo-tab-button,
.createinfo-tab-button  {
    border: none;
    padding: 10px;
    font-family: Inter, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 0.75rem;
    line-height: 2.25rem;
    font-weight: 500;
    letter-spacing: 0.0892857143em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    flex: 1;
    margin: 0 !important;
}

.glutinfo-tab-button.active,
.cloneinfo-tab-button.active,
.createinfo-tab-button.active {
    background-color: white !important;
    border-bottom: 2px solid var(--orange-900) !important; /* Индикаторът е долна рамка */
}

.glutinfo-tab-button.active::after,
.cloneinfo-tab-button.active::after,
.createinfo-tab-button.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
}


.glutinfo-tab-content,
.cloneinfo-tab-content,
.createinfo-tab-content {
    display: none;
    padding: 20px;
    background-color: white !important;
    /*border-top: 1px solid #ddd;*/
}

.glutinfo-tab-content.active,
.cloneinfo-tab-content.active,
.createinfo-tab-content.active  {
    display: block;
}

[id^="glutinfo-tab"],
[id^="lustinfo-tab"],
[id^="vanitinfo-tab"],
[id^="cloneinfo-tab"],
[id^="createinfo-tab"] {
    font-size: 14px !important;
}

.lustinfo-tabs {
    display: flex;
    justify-content: space-between;
    /*background-color: #f1f1f1;*/
    /*padding: 10px 0;*/
}

.lustinfo-tab-button {
    border: none;
    padding: 10px;
    font-family: Inter, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 0.75rem;
    line-height: 2.25rem;
    font-weight: 500;
    letter-spacing: 0.0892857143em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    flex: 1;
    margin: 0 !important;
}

.lustinfo-tab-button.active {
    background-color: white !important;
    border-bottom: 2px solid var(--yellow-900) !important; /* Индикаторът е долна рамка */
}

.lustinfo-tab-button.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
}


.lustinfo-tab-content {
    display: none;
    padding: 20px;
    background-color: white !important;
    /*border-top: 1px solid #ddd;*/
}

.lustinfo-tab-content.active {
    display: block;
}

.vanitinfo-tabs {
    display: flex;
    justify-content: space-between;
    /*background-color: #f1f1f1;*/
    /*padding: 10px 0;*/
}

.vanitinfo-tab-button {
    border: none;
    padding: 10px;
    font-family: Inter, sans-serif;
    -webkit-font-smoothing: antialiased;
    font-size: 0.75rem;
    line-height: 2.25rem;
    font-weight: 500;
    letter-spacing: 0.0892857143em;
    text-transform: uppercase;
    text-align: center;
    white-space: nowrap;
    cursor: pointer;
    flex: 1;
    margin: 0 !important;
}

.vanitinfo-tab-button.active {
    background-color: white !important;
    border-bottom: 2px solid var(--purple-900) !important; /* Индикаторът е долна рамка */
}

.vanitinfo-tab-button.active::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 4px;
}


.vanitinfo-tab-content {
    display: none;
    padding: 20px;
    background-color: white !important;
    /*border-top: 1px solid #ddd;*/
}

.vanitinfo-tab-content.active {
    display: block;
}


/* Контейнер за картите с grid */
.training-cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 3 колони, всяка с 1 част от ширината */
    gap: 1rem; /* Разстояние между картите */
}

/* Всяка карта има фиксирана ширина в grid */
.training-card {
    box-sizing: border-box;
    margin-bottom: 1rem;
    cursor: default; /* Премахваме курсора за действие */
}

/* Material Design стил за картите */
#WOD-VIEW  .mdc-card {
    border: 1px solid #ccc;
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem;
    height: fit-content;; /* Това ще позволи на височината да се адаптира според съдържанието */
}

/* Съдържанието на картите вече няма да е кликабъл */
#WOD-VIEW .card-content {
    cursor: default; /* Деактивираме действието върху картата */
}

/* Линковете вътре в картата ще останат активни */
#WOD-VIEW .mdc-card a {
    color: #000;
    text-decoration: underline;
}

#WOD-VIEW .mdc-typography--headline6 {
    margin-top: 0;
}

/* Когато екранът е по-малък от 1024px, намаляваме до 2 колони */
@media (max-width: 1024px) {
    .training-cards-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* На малки екрани ще показваме по една карта на ред */
@media (max-width: 768px) {
    .training-cards-grid {
        grid-template-columns: 1fr;
    }
}

.dpdcb .mdc-button.mdc-ripple-upgraded {
    float: right; /* Подравнява бутона вдясно */
    margin: 1.5rem 0; /* Разстояние над бутона */
}

#WOD-VIEW .mdc-tab-bar__content {
    /*width: 60%;*/
    /*padding: 1rem;*/
}

/*@media (max-width: 479px) {*/
/*#WOD-VIEW .mdc-tab-bar__content {*/
/*    width: calc(100% - 1rem);*/
/*    padding-top: 1rem;*/
/*    padding-left: 1rem;*/
/*    }*/
/*}*/

/*@media (min-width: 480px) and (max-width: 839px) {*/
/*#WOD-VIEW .mdc-tab-bar__content {*/
/*    width: calc(100% - 2rem);*/
/*    padding-top: 2rem;*/
/*    padding-left: 2rem;*/
/*    }*/
/*}*/



.denopis-card {
    box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px;
    padding: 16px; /* Добавяме вътрешен отстояние, за да не е текстът плътно до ръбовете */
    margin-top: 16px;
}

.notes-section textarea {
    width: calc(100% - 1rem); /* Полето за бележки ще заема цялата ширина на контейнера */
    height: 100px; 
    min-height: 50px; /* Минимална височина на текстовото поле */
    resize: vertical; /* Позволяваме промяна само по височина */
    border-radius: 8px;
    border: 1px solid rgba(27, 31, 35, 0.15); /* Сив бордюр */
    padding: 8px; /* Добавяме вътрешен отстояние в текстовото поле */
    background-color: #fafafa; /* Леко сив фон на текстовото поле */
    font-size: 14px; /* Размер на шрифта */
    color: #333; /* Цвят на текста */
    transition: border 0.3s ease; /* Плавна промяна при фокусиране */
}

.notes-section textarea:focus {
    border: 1px solid #ccc; /* Цвят при фокусиране */
    outline: none; /* Премахване на синята линия по подразбиране */
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.02); /* Добавяне на сянка при фокус */
}

@media (max-width: 768px) {
    .notes-section {
        background-color: #ffffff; /* Бял фон като при другите карти */
        border-radius: 16px; /* Закръглени ъгли, за да съответстват на картите */
        box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(27, 31, 35, 0.1) 0px 0px 0px 1px; /* Подобен box-shadow за картите */
        padding: 16px; /* Вътрешни отстояния */
        margin-bottom: 32px; /* Разстояние отдолу */
        width: calc(100% - 1rem); /* Да заема цялата ширина на контейнера */
        margin-left: .5rem;
        box-sizing: border-box; /* За да не се нарушава ширината от padding */
    }
    
    .notes-section textarea {
        /*width: calc(100% - 2rem); */
        height: 100px; 
        min-height: 50px; /* Минимална височина на текстовото поле */
        resize: vertical; /* Позволяваме промяна само по височина */
        border-radius: 8px;
        border: 1px solid rgba(27, 31, 35, 0.15); /* Сив бордюр */
        padding: 8px; /* Добавяме вътрешен отстояние в текстовото поле */
        background-color: #fafafa; /* Леко сив фон на текстовото поле */
        font-size: 14px; /* Размер на шрифта */
        color: #333; /* Цвят на текста */
        /* box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);  /* Вътрешна сянка за ефект на вглъбяване */
        transition: border 0.3s ease; /* Плавна промяна при фокусиране */
    }
    
    .notes-section textarea:focus {
        border: 1px solid #ccc; /* Цвят при фокусиране */
        outline: none; /* Премахване на синята линия по подразбиране */
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.02); /* Добавяне на сянка при фокус */
}
}



    [id^="DAYMACROSSHOW-"].pie-canvas-legend {
        margin-top:20px !important;
    }
    
    [id^="pie-wrapper-DAYMACROSSHOW-"].pie-canvas {
        width: 300px !important;
    }


.device-mobile #DLG_FOODSINGLE .mdc-dialog__surface {
    width: 95vw !important;
    max-width: 95vw !important;
}


#DLG_FFINF .mdc-text-field .mdc-line-ripple {
    background-color: rgba(0, 0, 0, 0.87);
}

.change_portion_div.mdc-line-ripple--active {
    color: rgba(0, 0, 0, 0.87) !important;
}

@media (min-width: 1280px) {
    #DLG_RECIPEVIEW .dialog-width-90 {
        max-width: 1200px !important;
    }
}


#DLG_FFINF .dialog-title {
    display: flex;
    align-items: center; /* Подравняване на елементите по вертикала */
    justify-content: space-between; /* Разстояние между заглавието и иконата */
}

#DLG_FFINF .dialog-title h2 {
    margin: 0; /* Премахнете допълнителни разстояния около заглавието */
    padding-left: 24px;
    flex-grow: 1; /* Заглавието ще заема цялата налична ширина */
}



/* Стилове за диалоговия прозорец на настолни устройства */
.tst-wod-dialog {
    /*z-index: 100;*/
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: white;
    border: 1px solid #fff;
    width: 400px;
    height: 400px;
    overflow-y: auto;
    box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 
                0px 24px 38px 3px rgba(0, 0, 0, 0.14), 
                0px 9px 46px 8px rgba(0, 0, 0, 0.12);
    border-radius: 4px;
}

/* Стилове за мобилни устройства */
@media only screen and (max-width: 600px) {
    .tst-wod-dialog {
        width: 90%; /* Прозорецът ще заема 90% от ширината на екрана */
        height: 60%; /* Прозорецът ще заема 60% от височината на екрана */
        top: 10%; /* Прозорецът ще бъде разположен малко по-надолу */
        left: 5%; /* Оставяме място от двете страни на прозореца */
        transform: none; /* Премахваме центрирането чрез translate */
    }
}


.tst-wod-details {
box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    border-radius: 16px !important;
    padding: 1rem 1rem !important;
    margin: .5rem;
}

.tst-wod-dialog ul,
.exc-wod-dialog ul {
    padding-inline-start: 1rem !important;
}

.wods-class-name,
.exercise-title-class{
    text-decoration: none;
}

#USER_TPS .mdc-layout-grid__inner {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

#USER_EXERCISES .mdc-layout-grid__inner {
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}

#USER_WODBLOCKS .mdc-layout-grid__inner {
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}

#USER_MEASUREMENTS .mdc-layout-grid__inner {
    grid-template-columns: repeat(12, minmax(0, 1fr)) !important;
}

#USER_CONSUMPTIONS .mdc-layout-grid__inner {
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
}

/*.mdc-layout-grid__cell.mdc-layout-grid__cell--span-3.mdc__media-enhanced > .exercise_card {*/
/*    max-height: 100%;*/
/*    overflow: hidden;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: space-between;*/
/*    padding: 1rem;*/
/*}*/

/*.mdc-layout-grid__cell.mdc-layout-grid__cell--span-3.mdc__media-enhanced > .exercise_card .mdc-card__text {*/
/*    flex-grow: 1;*/
/*    overflow: hidden;*/
/*    text-overflow: ellipsis;*/
/*    white-space: nowrap;*/
/*}*/



#wods .mdc-card__head{
    height: 120px;
    padding-top: 0 !important;
}

.exercise-card .mdc-card__head-subtitle,
.exercise_card .mdc-card__head-subtitle,
#wods .mdc-card__head-subtitle {
    margin-bottom: 0; /* Премахване на празнина отдолу */
    padding-bottom: 0; /* Премахване на padding, ако има */
    margin-top: auto; /* Позиционираме субтитрите в долната част на картата */
}

.exercise-title-class,
.mdc-typography--headline6.mdc-card__head-title {
    margin-top: 0;
    padding-top: 0;
    display: -webkit-box;
    -webkit-line-clamp: 2; /* Ограничаваме заглавието до 2 реда */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: normal; /* Позволяваме пренасяне на нов ред */
    height: 3.2rem; /* Фиксираме височината на заглавието за 2 реда */
    line-height: 1.6rem; /* Височината на всеки ред */
    color: var(--nulevi);
}

.mdc-card__media img {
    width: 100%; /* Снимката да заема цялата ширина */
    height: auto; /* Височината да се адаптира автоматично */
    object-fit: cover;
    border-radius: 16px;
}

body.wodblocks-page,
body.exercises-page, 
body.consumptions-page {
    min-height: 0 !important;    
}

#exercises, #USER_EXERCISES, #USER_WODBLOCKS, #USER_MEASUREMENTS {
    
    li {
        list-style-type: none;
        margin-bottom: 1.5rem;  /* Двойно разстояние между елементите */
    }
    
    details summary {
        font-size: 1rem;  /* Увеличаване на шрифта на summary */
    }
    
    details {
        margin-top: 1rem;  /* Разстояние между вътрешните детайли */
    }
    
    details div, details p {
        margin-top: 1rem;  /* Разстояние под WOD-а и бележките */
        font-size: 1rem;  /* Увеличаване на шрифта */
    }
    
    .mdc-card__head,
    .mdc-typography--subtitle2.mdc-card__head-subtitle,
    .mdc-typography--headline6.mdc-card__head-title {
    height: 100% !important; /* Позволява на картата да се разширява спрямо съдържанието */
    }
    
    .mdc-card__media img {
        width: 100%; /* Задава ширината на изображението да запълни картата */
        height: auto; /* Автоматично определя височината спрямо съотношението на изображението */
        object-fit: cover; /* Осигурява добро визуално съотношение на изображението в картата */
        border-radius: 16px; /* Може да добавите заобляне на краищата, ако е нужно */
    }
    
    .mdc-button__label {
        margin-top: 0;
        padding-top: 0;
        display: -webkit-box;
        -webkit-line-clamp: 2; /* Ограничаваме заглавието до 2 реда */
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal; /* Позволяваме пренасяне на нов ред */
        height: 3.2rem; /* Фиксираме височината на заглавието за 2 реда */
        line-height: 1.6rem; /* Височината на всеки ред */
        color: var(--nulevi);
    }

    .mdc-typography--subtitle2.mdc-card__head-subtitle {
        /*font-style: italic !important;*/
        font-size: 1rem !important;
        -webkit-font-smoothing: antialiased;
        line-height: .5rem !important;
        font-weight: 400;
        letter-spacing: 0.03125em;
        text-decoration: inherit;
        text-transform: inherit;
    }

}

#USER_CONSUMPTIONS {
    
    .favorite-icon {
        cursor: pointer;
        color: gray; /* Сиво за неактивни */
    }
    .favorite-icon.favorite {
        color: red; /* Червено за активни */
    }
    .mdc-card__actions .mdc-card__action-icons {
        justify-content: flex-end;
        margin-top: auto;
    }
    
    details summary {
        font-size: 1rem;  /* Увеличаване на шрифта на summary */
    }
    
    details {
        margin-top: 1rem;  /* Разстояние между вътрешните детайли */
    }
    
    details div, details p {
        margin-top: 1rem;  /* Разстояние под WOD-а и бележките */
        font-size: 1rem;  /* Увеличаване на шрифта */
    }
    
    .mdc-card__head,
    .mdc-typography--subtitle2.mdc-card__head-subtitle,
    .mdc-typography--headline6.mdc-card__head-title {
    height: 100% !important; /* Позволява на картата да се разширява спрямо съдържанието */
    }
    
    .mdc-card__media img {
        width: 100%; /* Задава ширината на изображението да запълни картата */
        height: auto; /* Автоматично определя височината спрямо съотношението на изображението */
        object-fit: cover; /* Осигурява добро визуално съотношение на изображението в картата */
        border-radius: 16px; /* Може да добавите заобляне на краищата, ако е нужно */
    }
    
    .mdc-button__label {
        margin-top: 0;
        padding-top: 0;
        display: -webkit-box;
        -webkit-line-clamp: 2; /* Ограничаваме заглавието до 2 реда */
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal; /* Позволяваме пренасяне на нов ред */
        height: 3.2rem; /* Фиксираме височината на заглавието за 2 реда */
        line-height: 1.6rem; /* Височината на всеки ред */
        color: var(--nulevi);
    }

    .mdc-typography--subtitle2.mdc-card__head-subtitle {
        /*font-style: italic !important;*/
        font-size: 1rem !important;
        -webkit-font-smoothing: antialiased;
        line-height: .5rem !important;
        font-weight: 400;
        letter-spacing: 0.03125em;
        text-decoration: inherit;
        text-transform: inherit;
    }

}

#wodList, #wodNotesList {
        
    li {
        list-style-type: none;
        margin-bottom: 1.5rem;  /* Двойно разстояние между елементите */
    }
    
    details summary {
        font-size: 1rem;  /* Увеличаване на шрифта на summary */
    }
    
    details {
        margin-top: 1rem;  /* Разстояние между вътрешните детайли */
    }
    
    details div, details p {
        margin-top: 1rem;  /* Разстояние под WOD-а и бележките */
        font-size: 1rem;  /* Увеличаване на шрифта */
    }
}

.tst-wod-details a.mdc-sys {
    color: var(-not-blk) !important;
}

/*@media (max-width: 479px) {*/
/*    .mdc-layout-grid {*/
/*        padding: 16px 0 !important;*/
/*    }*/
/*}*/

/* Основен контейнер за диалога в #wod */
#wods .mdc-dialog__container {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    z-index: 1050;
    pointer-events: none;
}

/* Стил за самата диалогова повърхност (центриран прозорец) */
#wods .mdc-dialog__surface {
    background-color: #fff;
    box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    max-width: 600px;
    max-height: 80vh; /* Диалоговата височина е ограничена до 80% от екрана */
    overflow-y: auto; /* Добавяме скрол, ако съдържанието надвишава височината */
    pointer-events: all;
    padding: 16px;
    display: flex;
    flex-direction: column;
}

/* Стил за фон зад диалога */
#wods .mdc-dialog__scrim {
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.32);
    z-index: 1040;
    pointer-events: auto;
}

/* Стил за заглавие на диалога */
#wods .mdc-dialog__title {
    font-size: 1.25rem;
    font-weight: bold;
    margin: 0;
    color: #333;
    padding-bottom: 16px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
}

/* Стил за съдържанието на диалога */
#wods .mdc-dialog__content {
    flex: 1;
    overflow-y: auto;
    padding: 16px;
    color: #34303E;
    font-size: 14px;
}

/* Стил за затварящия бутон в диалога */
#wods .mdc-dialog__actions {
    display: flex;
    justify-content: flex-end;
    padding-top: 16px;
    border-top: 1px solid rgba(0, 0, 0, 0.12);
}

#wods .mdc-dialog__button {
    background-color: #FFB899; /* Примерен фон за бутона */
    border: none;
    padding: 8px 16px;
    font-size: 14px;
    cursor: pointer;
    color: #fff;
    border-radius: 4px;
}

/* Опционално: Може да добавите анимации за плавно отваряне и затваряне */
#wods .mdc-dialog__container {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
}

#wods.mdc-dialog--open .mdc-dialog__container {
    opacity: 1;
}

/* Центриране на съдържанието */
#wods .mdc-dialog__container .mdc-dialog__surface {
    margin: 0 auto;
    transform: translate(0, 0);
}

/* Скролирането на съдържанието да бъде плавно */
#wods .mdc-dialog__content {
    max-height: 70vh;
    overflow-y: auto;
    scroll-behavior: smooth;
}

/* Допълнителен стил за responsive дизайна */
@media (max-width: 768px) {
    #wods .mdc-dialog__surface {
        max-width: 90vw;
        max-height: 90vh;
    }
}


/* Обща настройка за всички WOD диалози */
[id^="yuli_infoDialog_wod_"] {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 5;  /* Беше 1100, сменям заради затварянето */
    background-color: white;
    padding: 0;
    border: 1px solid #fff;
    box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
    border-radius: 4px;
    max-width: 90%;
    max-height: 90%;
    overflow-y: auto;
}

/* Заглавна част на диалога */
[id^="yuli_infoDialog_wod_"] .mdc-dialog__title {
    font-weight: bold;
    background-color: var(--yellow-900);
    padding: 10px;
    border-bottom: solid 1px rgba(0, 0, 0, 0.12);
    color: #fff;
}

/* Съдържание на диалога */
[id^="yuli_infoDialog_wod_"] .mdc-dialog__content {
    padding: 20px;
    font-size: 14px;
    color: #34303E;
    max-height: calc(100% - 60px);
    overflow-y: auto;
}

/* Скрийн (overlay) */
[id^="yuli_infoDialog_wod_"] .mdc-dialog__scrim {
    background-color: rgba(0, 0, 0, 0.32);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.prgms-pagination-container,
.wods-pagination-container {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    padding: 10px;
    margin-bottom: 20px;
}

.prgms-pagination-button,
.wods-pagination-button{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 30px;
    height: 30px;
    background-color: #f0f0f0;
    border-radius: 50%;
    margin: 0 5px;
    text-decoration: none;
    color: #333;
    font-size: 18px;
    transition: background-color 0.3s;
}

.prgms-pagination-button:hover,
.wods-pagination-button:hover{
    background-color: #d3d3d3;
}

.prgms-pagination-info,
.wods-pagination-info {
    font-size: 16px;
    margin: 0 10px;
}

.prgms-pagination-button i,
.wods-pagination-button i {
    font-size: 20px;
    vertical-align: middle;
}

.prgms-header-container {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 20px;
    margin-top: 2rem; /* Добавяме отстояние отгоре за повече пространство от табовете */
    padding: 10px 0; /* Увеличаваме височината чрез padding */
}

.prgms-header-container form {
    margin: 0;
}

.results-per-page-container {
    display: flex;
    align-items: center;
    font-size: 16px;
}

.prgms-search-container {
    display: inline-block;
    margin-right: 20px;
}

.prgms-sort-container {
    display: inline-block;
    margin-left: auto;
    margin-right: 20px;
}

.results-per-page-container {
    display: inline-block;
    margin-left: 20px;
}

.device-mobile .results-per-page-container {
    margin-left: 0px;
    margin-top: 1rem;
}

.device-mobile .prgms-sort-container {
    margin-top: 1rem;
}

.prgms-search-container {
    position: relative;
    display: inline-block;
}

#program_search,
#wod_search {
    padding-right: 30px; /* Оставяме място за лупата вдясно */
    width: 240px; /* Увеличаваме ширината, за да хваща целия текст на плейсхолдера */
    height: 24px; /* Увеличаваме височината на полето за търсене */
    /*font-size: 16px;*/
}

.search-icon {
    position: absolute;
    right: 5px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    font-size: 22px;
    color: #333;
    font-weight: bold;
}

.prgms-header-container select,
.prgms-header-container input {
    font-size: 16px;
    height: 40px; /* Уеднаквяване на височината на всички елементи */
    padding: 0 10px; /* Добавяне на padding за по-добър изглед */
}

.no-results-msg {
    text-align: center;
    font-size: 18px;
    color: #ff0000; /* Червен цвят за видимост */
    padding: 20px;
    background-color: #f8f8f8;
    border: 1px solid #ddd;
    border-radius: 8px;
}

.ss-container {
    margin-top: 24px;
    margin-left: 24px;
}


#DLG_ADMINBLOCKEXVIEW_TTL .material-icons {
    line-height: 2rem !important;
}


@media (min-width: 1280px) {
      #FOODNEWCNT   .mdc-layout-grid__inner {
    grid-template-columns: repeat(9, minmax(0, 1fr)) !important;
    }
}

@media (min-width: 840px) and (max-width: 1279px) {
      #FOODNEWCNT   .mdc-layout-grid__inner {
    grid-template-columns: repeat(8, minmax(0, 1fr)) !important;
    }
}

#FOODNEWCNT {
	.mdc-card__head,
    .mdc-typography--subtitle2.mdc-card__head-subtitle,
    .mdc-typography--headline6.mdc-card__head-title {
    height: 100% !important; /* Позволява на картата да се разширява спрямо съдържанието */
    }
    
    .mdc-card__head {
    margin-bottom: 8px; /* Разстояние между заглавието и изображението */

}
    
    .mdc-card__media img {
        width: 100%; /* Задава ширината на изображението да запълни картата */
        height: 180px; /* Автоматично определя височината спрямо съотношението на изображението */
        object-fit: cover; /* Осигурява добро визуално съотношение на изображението в картата */
        border-radius: 16px; /* Може да добавите заобляне на краищата, ако е нужно */
    }
    
    .mdc-button__label {
        margin-top: 0;
        padding-top: 0;
    display: block;
    height: auto; /* Премахнете фиксираната височина, ако това реже текста */
    line-height: 1.4rem; /* Можете да коригирате височината на редовете */
    max-height: 3.2rem; /* Ако искате, добавете максимална височина */
        -webkit-line-clamp: 2; /* Ограничаваме заглавието до 2 реда */
        -webkit-box-orient: vertical;
        /*overflow: hidden;*/
        text-overflow: ellipsis;
        white-space: normal; /* Позволяваме пренасяне на нов ред */
        height: 3.2rem; /* Фиксираме височината на заглавието за 2 реда */
        line-height: 1.6rem; /* Височината на всеки ред */
        color: var(--nulevi);
    }

    .mdc-typography--subtitle2.mdc-card__head-subtitle {
        font-style: italic !important;
        font-size: 1rem !important;
        -webkit-font-smoothing: antialiased;
        line-height: .5rem !important;
        font-weight: 400;
        letter-spacing: 0.03125em;
        text-decoration: inherit;
        text-transform: inherit;
    }

    .mdc-typography--headline6 {
        font-family: Inter, sans-serif;
        -moz-osx-font-smoothing: grayscale;
        -webkit-font-smoothing: antialiased;
        font-size: 1.25rem !important;
        line-height: 2rem !important;
        font-weight: 500;
        letter-spacing: 0.0125em;
        text-decoration: inherit;
        text-transform: inherit;
    }

}

body.food-page #FOODUSERPAGE .mdc-card__text, body.food-page #FOODUSERPAGEN .mdc-card__text {
    font-size: 1rem !important;
    line-height: 1.5rem !important;
}

body.measurements-page {
    min-height: 0 !important;    
}

    .mdc-card__head {
    /* margin-bottom: 2rem; Разстояние между заглавието и изображението */
}

#USER_MEASUREMENTS .mdc-card__head .mdc-card__head-subtitle {
    margin-top: 2rem !important;
 }
    
    
#USER_MEASUREMENTS {    
    
    .measurement-date {
        color: var(--nulevi);
        font-size: 1rem;
        font-style: bold;
        font-weight: 600;
        text-shadow: 0 0 2px #FFFFFF;
        text-decoration: none;
    }
    
    .measurement-dialog {
        display: none;
        position: fixed;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 90vw;
        max-width: 600px;
        max-height: 90vh;
        z-index: 5;
        background: #fff;
        overflow-y: auto;
        box-shadow: 0px 11px 15px -7px rgba(0, 0, 0, 0.2), 0px 24px 38px 3px rgba(0, 0, 0, 0.14), 0px 9px 46px 8px rgba(0, 0, 0, 0.12);
        border-radius: 8px;
        /*font-family: Arial, sans-serif;*/
    }
    
    .dialog-header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        background-color: #EBADE0;
        padding: 10px;
        border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    }
    
    .dialog-header span {
        font-weight: bold;
    }
    
    .close-icon {
        font-size: 24px;
        cursor: pointer;
    }
    
    .dialog-content {
        padding: 20px;
    }
    
    .measurement-table {
        width: 100%;
        /*border-collapse: collapse;*/
    }
    
    .measurement-table th, .measurement-table td {
        padding: 8px 12px;
        text-align: left;
    }
    
    .measurement-table th {
        background-color: #f0f0f0;
        font-weight: bold;
    }
    
    .measurement-table tr:nth-child(even) {
        background-color: #f9f9f9;
    }
    
    .measurement-table tr:nth-child(odd) {
        background-color: #ffffff;
    }
    
    .measurement-table tr td:first-child {
        font-weight: bold;
    }
}

@media only screen and (max-width: 768px) {
    .measurement-dialog {
        width: 95vw;  /* 95% от ширината на екрана за мобилни */
        height: auto; /* автоматично изчисляване на височината */
        max-height: 80vh; /* максимум 80% от височината на екрана */
        overflow-y: auto; /* добавя скрол, ако съдържанието излиза извън рамките */
    }

    /* Стилове за вътрешното съдържание на диалога */
    .measurement-dialog .dialog-header {
        padding: 10px;
        font-size: 1.1em;
    }

    .measurement-dialog .dialog-content {
        padding: 10px;
    }
}

#somatographDialog {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 90vw; /* 90% от ширината на прозореца */
    height: auto;
    max-width: 90vh; /* Задаваме максимална ширина, базирана на височината */
    max-height: 90vh; /* 90% от височината на прозореца */
    background-color: white;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    border-radius: 8px;
    overflow: hidden;
    z-index: 10;
    display: none; /* Скриваме по подразбиране, ще го показваме чрез JavaScript */
}

.somatogram-image {
    width: 100%;
    height: auto;
}

/* Оцветяване на редовете на таблицата с параметри */
.param-table tbody tr:nth-child(odd),
.value-table tbody tr:nth-child(odd) {
    background-color: #f5f5f5; /* Цвят за нечетни редове */
}

.param-table tbody tr:nth-child(even),
.value-table tbody tr:nth-child(even) {
    background-color: #fff; /* Цвят за четни редове */
}

/* Оцветяване на колоните със стойностите в таблицата със стойности */
.value-table thead th,
.value-table tbody td {
    padding: 8px;
}

/* Оцветяване на първата колона в по-тъмен цвят */
.param-table tbody tr td {
    font-weight: bold;
}

/* Най-горният ред на таблиците */
.param-table thead tr,
.value-table thead tr {
    background-color: #f0f0f0;; /* По-тъмен сив цвят */
    font-weight: bold;
}

/* Определяне на контейнера като flex за подравняване на двете таблици */
.all-measurements-dialog {
    display: flex;
    align-items: stretch; /* Прави двете таблици с еднаква височина на редовете */
}

/* Принуждава клетките на лявата и дясната таблица да се подравняват по височина */
.param-table tbody tr,
.value-table tbody tr {
    height: 30px; /* Може да се регулира според нуждите */
}

/*.param-table,*/
/*.value-table {*/
    /* border-collapse: separate; Запазва таблиците с разделени клетки */
/*}*/

.param-table td,
.param-table th,
.value-table td,
.value-table th {
    padding: 8px;
    vertical-align: middle;
    text-align: center;
}


#allMeasurementsDialog {
    .tooltip {
        position: relative;
        display: inline-block;
        cursor: pointer;
    }
    
    .tooltip .tooltiptext {
        visibility: hidden;
        width: 200px;
        background-color: #555;
        color: #fff;
        text-align: center;
        border-radius: 5px;
        padding: 10px;
        position: absolute;
        z-index: 1;
        bottom: 100%; /* Покажи над текста */
        left: 50%;
        margin-left: -100px;
        opacity: 0;
        transition: opacity 0.3s;
    }
    
    .tooltip:hover .tooltiptext {
        visibility: visible;
        opacity: 1;
    }
}


.param-table a,
.measurement-table a,
.see-somatogram {
    color: var(--infoz-);
    text-decoration: none;
    font-weight: 600;
}

#allMeasurementsDialog {
    width: auto !important;
    max-width: 90vw !important;
}

.btn-heart {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 24px; /* размер на иконата */
    color: #E91E63; /* цвят на сърцето */
    padding: 0;
    margin-left: 10px; /* разстояние до бутона Изповядай */
    display: inline-flex;
    align-items: center;
}

.btn-heart:hover {
    color: #D81B60; /* по-тъмен цвят при задържане */
}

.favorite-icon.liked {
    color: var(--orange-900) !important;
}

.favorites-toggle-container {
    margin-left: 24px;
    margin-top: 16px;
    display: inline-block;
}

#USER_CONSUMPTIONS_CNT .mdc-layout-grid {
        padding-top:1rem;
}

#USER_CONSUMPTIONS_CNT .prgms-search-container,
#USER_CONSUMPTIONS_CNT  .results-per-page-container,
#USER_CONSUMPTIONS_CNT  .prgms-sort-container,
#USER_CONSUMPTIONS_CNT .favorites-toggle-container{
    margin-left: 24px;
    margin-right: 0;
    margin-top: 12px;
}

#USER_CONSUMPTIONS .yuli-infoz {
        margin-bottom:1rem;
}


.create-tab-form,
.select-consumption-day {
   box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
   border-radius: 16px;
    margin-left: 16px; /* Центриране на картата */
    padding: 16px;
    max-width: 260px; /* Ограничаване на ширината на картата */
}

#choose-consumptions-container {
   box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
   border-radius: 16px;
    margin-left: 16px; /* Центриране на картата */
    padding: 16px;
    max-width: 300px; /* Ограничаване на ширината на картата */
}


#copy-days-tab-all-containers {
   box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
   border-radius: 16px;
    margin-left: 16px; /* Центриране на картата */
    padding: 16px;
    max-width: 320px; /* Ограничаване на ширината на картата */
}



.consumption-list  input[type="checkbox"]:checked {
    accent-color: var(--orange-500); /* Променя цвета на чекбокса */
}

ul.consumption-list {
    list-style: none; /* Премахва точките */
    padding: 0; /* Изчиства отстъпа */
    margin: 0; /* Изчиства маржовете */
}

ul.consumption-list li {
    margin-bottom: 10px; /* Добави отстъп между елементите, ако е нужно */
}

/*#USER_DIETS_CNT .yuli-infoz {*/
/*        margin-bottom: 1rem;*/
/*}*/


.mob-wrapper{
	background-color:#fff !important;
	border-top: 1px solid #e5e5e5 !important;
}
.mob-button{
	background-color:#fff !important;
}
.mob-icon{
	color:#0f0f0f !important;
	font-size:22px;
}
.mob-txt{
	color:#0f0f0f !important;
	font-size:14px;
}

/* Да оправи цвета на молива и размерите при промяната на име на консумация от потребителя - НАЧАЛО */
.cons-title-edit,
.cons-title-edit i {
    color: inherit;
    text-decoration: none;
}

.cons-title-edit:hover i {
    opacity: 0.75;
}
/* Inline rename input for consumption title */
.cons-title-row {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cons-title-input {
    font: inherit;
    font-size: inherit;
    line-height: inherit;
    padding: 2px 4px;
    width: 100%;
    min-width: 180px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
.cons-title-input {
    border-color: transparent;
    background: #f9f9f9;
}

.cons-title-input:focus {
    border-color: #bdd781;
    background: #fff;
    outline: none;
}
/* Да оправи цвета на молива и размерите при промяната на име на консумация от потребителя - КРАЙ */

/*Юли - КРАЙ*/

/* =========================
   CONSUMPTIONS – Card System v2
   ========================= */

/* 2) Title ред: текст + молив + rename input да са стабилни */
#USER_CONSUMPTIONS_CNT .cons-title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-height: 32px;
}

#USER_CONSUMPTIONS_CNT .cons-title-text {
  flex: 1;
  min-width: 0; /* важно за правилно “рязане” при дълги имена */
}

/* Моливът да не е син и да е в твоя акцент */
#USER_CONSUMPTIONS_CNT .cons-title-edit,
#USER_CONSUMPTIONS_CNT .cons-title-edit i {
  text-decoration: none !important;
}

#USER_CONSUMPTIONS_CNT .cons-title-edit:hover i {
  opacity: 0.75;
}

/* Input за rename да не става по-малък от текста */
#USER_CONSUMPTIONS_CNT .cons-title-input {
  flex: 1;
  min-width: 0;
  width: 100%;
  box-sizing: border-box;

  font: inherit;
  font-size: inherit;
  line-height: 1.2;

  padding: 6px 8px;
  border-radius: 10px;
  border: 1px solid transparent;
  background: rgba(0,0,0,0.04);
}

#USER_CONSUMPTIONS_CNT .cons-title-input:focus {
  background: #fff;
  border-color: rgba(189, 215, 129, 0.9); /* твоето зелено */
  outline: none;
}

/* 3) Контролите горе (search/sort/results/favorites) да изглеждат “в една система” */
#USER_CONSUMPTIONS_CNT .prgms-search-container input[type="text"],
#USER_CONSUMPTIONS_CNT .prgms-sort-container select,
#USER_CONSUMPTIONS_CNT .results-per-page-container select {
  height: 34px;
  border-radius: 10px;
  border: 1px solid rgba(27, 31, 35, 0.18);
  background: #fff;
  padding: 0 10px;
  box-sizing: border-box;
}

#USER_CONSUMPTIONS_CNT .prgms-sort-container label,
#USER_CONSUMPTIONS_CNT .results-per-page-container label {
  margin-right: 8px;
}

#USER_CONSUMPTIONS_CNT .favorites-toggle-container input[type="checkbox"] {
  transform: translateY(1px);
}

/* =========================
   Universal Cards – v2 (activate by adding .cards-v2 on a container)
   ========================= */

/* Cell-ът не носи card стил */
.cards-v2 .mdc-layout-grid__cell--span-3,
.cards-v2 .mdc-layout-grid__cell--span-4,
.cards-v2 .mdc-layout-grid__cell--span-12 {
  box-shadow: none !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* Самата карта */
.cards-v2 .mdc-card {
  background: #fff;
  border: 1px solid rgba(27, 31, 35, 0.12);
  border-radius: 16px !important;

  box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px,
              rgba(27, 31, 35, 0.10) 0px 0px 0px 1px;

  padding: 16px !important;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease, background 120ms ease;
}

.cards-v2 .mdc-card:hover {
  transform: translateY(-1px);
  box-shadow: rgba(0, 0, 0, 0.06) 0px 6px 18px 0px,
              rgba(27, 31, 35, 0.12) 0px 0px 0px 1px;
  border-color: rgba(27, 31, 35, 0.16);
  background: #fafafa;
}

/* Типография (обща) */
.cards-v2 .mdc-card p {
  margin: 10px 0 10px;
  color: rgba(0,0,0,0.72);
  font-size: 13.5px;
  line-height: 1.35;
  font-variant-numeric: tabular-nums;
}

.cards-v2 .mdc-card small {
  color: rgba(0,0,0,0.55);
  font-size: 12.5px;
}

/* Mobile tuning */
@media (max-width: 768px) {
  .cards-v2 .mdc-card {
    padding: 14px !important;
  }

  .cards-v2 .mdc-card p {
    font-size: 13px;
    word-break: break-word;
  }
}



/* ===== Toolbar v2 – CLEAN (cards-v2-toolbar) ===== */

.cards-v2 .cards-v2-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start;
  gap:16px;
}

/* toolbar blocks */
.cards-v2 .cards-v2-toolbar .prgms-search-container,
.cards-v2 .cards-v2-toolbar .prgms-sort-container,
.cards-v2 .cards-v2-toolbar .results-per-page-container,
.cards-v2 .cards-v2-toolbar .favorites-toggle-container{
  display:inline-flex;
  align-items:center;
  gap:10px;
  /*margin:0 !important;*/
  float:none !important;
  position:static !important;
  left:auto !important;
  right:auto !important;
}

/* labels */
.cards-v2 .cards-v2-toolbar label{
  font-size:13px;
  line-height:34px;
  color:rgba(0,0,0,0.70);
  margin:0;
}

/* inputs/selects (force rounded like consumptions) */
.cards-v2 .cards-v2-toolbar input,
.cards-v2 .cards-v2-toolbar select{
  height:34px;
  border-radius:10px !important;
  border:1px solid rgba(27,31,35,0.18);
  background:#fff;
  padding:0 10px;
  box-sizing:border-box;
}

/* search with icon */
.cards-v2 .cards-v2-toolbar .prgms-search-container{ position:relative; }
.cards-v2 .cards-v2-toolbar .prgms-search-container input{
  width:260px;
  padding-right:34px;
}
.cards-v2 .cards-v2-toolbar .search-icon{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  font-size:20px;
  cursor:pointer;
  opacity:0.6;
  user-select:none;
}
.cards-v2 .cards-v2-toolbar .search-icon:hover{ opacity:1; }

/* focus */
.cards-v2 .cards-v2-toolbar input:focus,
.cards-v2 .cards-v2-toolbar select:focus{
  border-color:rgba(189,215,129,0.9);
  outline:none;
}

/* mobile */
@media (max-width:768px){
  .cards-v2 .cards-v2-toolbar{
    gap:10px;
  }
  .cards-v2 .cards-v2-toolbar .prgms-search-container,
  .cards-v2 .cards-v2-toolbar .prgms-sort-container,
  .cards-v2 .cards-v2-toolbar .results-per-page-container,
  .cards-v2 .cards-v2-toolbar .favorites-toggle-container{
    width:100%;
  }
  .cards-v2 .cards-v2-toolbar input,
  .cards-v2 .cards-v2-toolbar select{
    width:100%;
  }
}
/* ===== Exercises toolbar ===== */

.cards-v2 .cards-v2-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:16px;
}

/* blocks */
.cards-v2 .exr-search-container,
.cards-v2 .exr-sort-container,
.cards-v2 .exr-rpp-container{
  display:inline-flex;
  align-items:center;
  gap:8px;
  margin:0;
}

/* inputs */
.cards-v2 .exr-search-container input,
.cards-v2 .exr-sort-container select,
.cards-v2 .exr-rpp-container select{
  height:34px;
  border-radius:10px;
  border:1px solid rgba(0,0,0,.2);
  padding:0 10px;
}

/* search icon */
.cards-v2 .exr-search-container{ position:relative; }
.cards-v2 .exr-search-container .search-icon{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  cursor:pointer;
}

/* mobile */
@media (max-width:768px){
  .cards-v2 .exr-search-container,
  .cards-v2 .exr-sort-container,
  .cards-v2 .exr-rpp-container{
    width:100%;
  }
}
/* ===== Universal toolbar for cards-v2 ===== */
.cards-v2 .cards-v2-toolbar{
  display:flex !important;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-start !important;
  gap:16px;
  /*margin: 1rem 0 1rem 1rem;  както ти стои при консумации */
}

/* Blocks */
.cards-v2 .prgms-search-container,
.cards-v2 .prgms-sort-container,
.cards-v2 .results-per-page-container,
.cards-v2 .favorites-toggle-container{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin:0;
  float:none !important;
  position:static !important;
}

.cards-v2 .prgms-search-container,
.cards-v2 .prgms-sort-container,
.cards-v2 .results-per-page-container {
  margin-right: 24px; /* dа станат като другите */
}

.cards-v2 .prgms-search-container,
.cards-v2-toolbar .prgms-sort-container {
  margin-right: 24px; /* dа станат като другите */
}

/* Labels */
.cards-v2 .prgms-sort-container label,
.cards-v2 .results-per-page-container label,
.cards-v2 .favorites-toggle-container label{
  font-size:13px;
  line-height:34px;
  color:rgba(0,0,0,0.70);
  margin:0;
}

/* Inputs/selects (force rounded like consumptions) */
.cards-v2 .prgms-search-container input,
.cards-v2 .prgms-sort-container select,
.cards-v2 .results-per-page-container select{
  height:34px;
  border-radius:10px !important;
  border:1px solid rgba(27,31,35,0.18) !important;
  background:#fff !important;
  padding:0 10px;
  box-sizing:border-box;
  outline: none;
  box-shadow: none;
}

/* Search icon inside input */
.cards-v2 .prgms-search-container{ position:relative; }
.cards-v2 .prgms-search-container input{
  width:260px;
  padding-right:34px;
}
.cards-v2 .prgms-search-container .search-icon{
  position:absolute;
  right:10px;
  top:50%;
  transform:translateY(-50%);
  font-size:20px;
  cursor:pointer;
  opacity:0.6;
  user-select:none;
}
.cards-v2 .prgms-search-container .search-icon:hover{ opacity:1; }

/* Mobile stacking */
@media (max-width:768px){
  .cards-v2 .cards-v2-toolbar{
    margin-left: 0;
    padding: 0 1rem;
  }
  .cards-v2 .prgms-search-container,
  .cards-v2 .prgms-sort-container,
  .cards-v2 .results-per-page-container,
  .cards-v2 .favorites-toggle-container{
    width:100%;
  }
  .cards-v2 .prgms-search-container input,
  .cards-v2 .prgms-sort-container select,
  .cards-v2 .results-per-page-container select{
    width:100%;
  }
}
/* ===== Cards v2 – FIX legacy sizing + align toolbar with grid ===== */

/* 1) Legacy override: exercises / wods / programs search inputs become v2 */
.cards-v2 #exercise_search,
.cards-v2 #wod_search,
.cards-v2 #program_search{
  width: 260px !important;
  height: 34px !important;
  padding-right: 34px !important;
  border-radius: 10px !important;
  box-sizing: border-box;
}

/* 2) Align toolbar with the same left/right gutter as the cards grid */
.cards-v2 .cards-v2-toolbar{
  padding-left: 24px;
  padding-right: 24px;
  margin-top: 12px;
}

/* 3) If any section still uses .ss-container inside cards-v2, remove its legacy offset */
.cards-v2 .ss-container,
.cards-v2 .ssp-container{
  margin-left: 0 !important;
  margin-top: 0 !important;
}

/* Mobile gutter */
@media (max-width: 768px){
  .cards-v2 .cards-v2-toolbar{
    padding-left: 16px;
    padding-right: 16px;
    margin-top: 16px;
  }

  .cards-v2 #exercise_search,
  .cards-v2 #wod_search,
  .cards-v2 #program_search{
    width: 100% !important;
  }
}
/* Completely remove search icon everywhere */
.cards-v2 .prgms-search-container .search-icon {
  display: none !important;
}
/* Pagination – FIX click/overlay */
.cards-v2 .prgms-pagination-container{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding: 12px 16px 20px; /* да се подравни с toolbar/grid */
}

.cards-v2 .prgms-pagination-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  border-radius:999px;
  position:relative;
  z-index:2;             /* над текста */
}

.cards-v2 .prgms-pagination-info{
  position:relative;
  z-index:1;
  margin:0 6px;
  pointer-events:none;   /* да НЕ блокира кликовете по бутоните */
}
/* Program cards title – allow 2 lines instead of cutting */
.cards-v2 .mdc-card__head-title,
.cards-v2 .mdc-card__head-title a{
  white-space: normal !important;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;      /* показва до 2 реда */
  line-height: 1.25;
}
/* Toolbar alignment to match cards/grid */
.cards-v2 .ss-container,
.cards-v2 .ssp-container{
  padding: 0 24px;   /* същата логика като при pagination */
  box-sizing: border-box;
      margin-left: 24px;
}
/* ===== Pagination v2 – modern pills ===== */

.cards-v2 .prgms-pagination-container{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  padding: 12px 16px 24px;
  box-sizing:border-box;
}

/* buttons */
.cards-v2 .prgms-pagination-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:999px;
  background:#fff;
  border:1px solid rgba(27,31,35,0.18);
  box-shadow: 0 1px 0 rgba(0,0,0,0.02);
  text-decoration:none;
  position:relative;
  z-index:2;
  transition: transform .08s ease, box-shadow .12s ease, border-color .12s ease;
}

.cards-v2 .prgms-pagination-button i.material-icons{
  font-size:22px;
  line-height:1;
  color: rgba(0,0,0,0.70);
}

.cards-v2 .prgms-pagination-button:hover{
  transform: translateY(-1px);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
  border-color: rgba(189,215,129,0.9);
}

.cards-v2 .prgms-pagination-button:active{
  transform: translateY(0);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}

/* page info pill */
.cards-v2 .prgms-pagination-info{
  display:inline-flex;
  align-items:center;
  height:40px;
  padding:0 14px;
  border-radius:999px;
  background: rgba(0,0,0,0.03);
  border:1px solid rgba(27,31,35,0.12);
  color: rgba(0,0,0,0.72);
  font-size:13px;
  pointer-events:none;
  user-select:none;
}

/* Mobile: center it */
@media (max-width:768px){
  .cards-v2 .prgms-pagination-container{
    justify-content:center;
  }
}
.cards-v2 .prgms-pagination-button.is-disabled{
  opacity:.35;
  pointer-events:none;
  box-shadow:none;
  transform:none;
}
/* ===== Cards theme variables ===== */

.cards-v2.theme-food{
  --accent: #bdd781;   /* хранения */
}

.cards-v2.theme-workout{
  --accent: #ffb899;   /* тренировки */
}

.cards-v2.theme-vanity{
  --accent: #EBADE0;   /* суета / измервания / сън */
}
/* ===== Pagination v2 – themed ===== */

.cards-v2 .prgms-pagination-button{
  border: 1px solid rgba(27,31,35,0.18);
  background:#fff;
}

.cards-v2 .prgms-pagination-button:hover{
  border-color: var(--accent);
  box-shadow: 0 6px 16px rgba(0,0,0,0.08);
}

.cards-v2 .prgms-pagination-button:hover i{
  color: var(--accent);
}

.cards-v2 .prgms-pagination-info{
  border:1px solid rgba(27,31,35,0.12);
}

/* active / emphasis */
.cards-v2 .prgms-pagination-button.is-active,
.cards-v2 .prgms-pagination-button:focus-visible{
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);
}
/* ===== Toolbar focus / active – themed ===== */

.cards-v2 .prgms-search-container input:focus,
.cards-v2 .prgms-sort-container select:focus,
.cards-v2 .results-per-page-container select:focus{
  border-color: var(--accent);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent);
}

/* hover */
.cards-v2 .prgms-sort-container select:hover,
.cards-v2 .results-per-page-container select:hover{
  border-color: var(--accent);
}
/* ===== Theme accents (global) ===== */
.cards-v2.theme-food     { --accent: #BDD781; } /* Хранене */
.cards-v2.theme-workout  { --accent: #FFB899; } /* Тренировки */
.cards-v2.theme-vanity   { --accent: #EBADE0; } /* Суета */
.cards-v2 { --accent: #FFB899; } /* fallback */

/* ===== Pagination v2 ===== */
.cards-v2 .prgms-pagination-container{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin:16px 0 6px;
}

.cards-v2 .prgms-pagination-button,
.cards-v2 .prgms-pagination-info,
.cards-v2 .prgms-pagination-page{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:34px;
  min-width:34px;
  padding:0 12px;
  border-radius:999px;
  border:1px solid rgba(27,31,35,0.16);
  background:#fff;
  color:rgba(0,0,0,0.78);
  text-decoration:none;
  box-sizing:border-box;
}

.cards-v2 .prgms-pagination-button:hover,
.cards-v2 .prgms-pagination-page:hover{
  border-color: color-mix(in srgb, var(--accent) 55%, rgba(27,31,35,0.16));
}

.cards-v2 .prgms-pagination-page.is-active{
  background: color-mix(in srgb, var(--accent) 18%, #fff);
  border-color: var(--accent);
  color: rgba(0,0,0,0.85);
  font-weight:600;
}
/* ===== Card v2 subtle tinted hover ===== */
.cards-v2 .mdc-card{
  transition: box-shadow .18s ease, transform .18s ease, background-color .18s ease, border-color .18s ease;
  border:1px solid rgba(27,31,35,0.14);
  background:#fff;
}

.cards-v2 .mdc-card:hover{
  background: color-mix(in srgb, var(--accent) 6%, #fff); /* много subtle */
  border-color: color-mix(in srgb, var(--accent) 28%, rgba(27,31,35,0.14));
  transform: translateY(-1px);
}


/* =========================
   Cards v2 – Theme engine (by class)
   Use on wrapper: .theme-food / .theme-workout / .theme-vanity
   ========================= */

/* default (ако забравиш тема някъде) */
.cards-v2{
  --accent: #ffb899;
  --accent-soft: rgba(255,184,153,.16);
  --accent-border: rgba(255,184,153,.55);
  --title: #7a3f1e;
}

/* FOOD */
.cards-v2.theme-food{
  --accent: #bdd781;
  --accent-soft: rgba(189,215,129,.16);
  --accent-border: rgba(189,215,129,.55);
  --title: #4f6f21;
}

/* TRAINING */
.cards-v2.theme-workout{
  --accent: #ffb899;
  --accent-soft: rgba(255,184,153,.16);
  --accent-border: rgba(255,184,153,.55);
  --title: #3f3f3f; /* charcoal */
}

/* VANITY */
.cards-v2.theme-vanity{
  --accent: #EBADE0;
  --accent-soft: rgba(235,173,224,.16);
  --accent-border: rgba(235,173,224,.55);
  --title: #7a2f72;
}

/* Title color */
.cards-v2 .mdc-card__head-title,
.cards-v2 .mdc-card__head-title a,
.cards-v2 .mdc-card__head a{
  color: var(--title) !important;
}

/* Card hover tint (subtle) */
.cards-v2 .mdc-card:hover{
  background: var(--accent-soft) !important;
  border-color: var(--accent-border) !important;
}

/* Toolbar focus accent */
.cards-v2 .prgms-search-container input:focus,
.cards-v2 .prgms-sort-container select:focus,
.cards-v2 .results-per-page-container select:focus{
  border-color: var(--accent) !important;
}

/* Pagination – active chip */
.cards-v2 .prgms-pagination-button.is-active{
  border-color: var(--accent) !important;
  box-shadow: 0 0 0 3px rgba(0,0,0,0); /* safe reset */
}

/* Programs: override legacy #USER_TPS .mdc-button__label only inside cards-v2 titles */
#USER_TPS #USER_PROGRAMS_CNT.cards-v2 .mdc-card__head-title,
#USER_TPS #USER_PROGRAMS_CNT.cards-v2 .mdc-card__head-title a,
#USER_TPS #USER_PROGRAMS_CNT.cards-v2 .mdc-card__head-title .mdc-button__label{
  color: var(--title) !important;
}

/* ensure children don't re-override */
#USER_TPS #USER_PROGRAMS_CNT.cards-v2 .mdc-card__head-title *{
  color: inherit !important;
}

/* Programs – search input focus cleanup */
#USER_PROGRAMS_CNT .prgms-search-container input[type="text"]{
  outline: none;
  box-shadow: none;
  border: 1px solid #ddd;
}

/* Focus state – use theme accent instead of black */
#USER_PROGRAMS_CNT.theme-workout .prgms-search-container input[type="text"]:focus{
  border-color: #ffb899;
  box-shadow: 0 0 0 2px rgba(255, 184, 153, 0.25);
}
/* Бележки над programDialog_* */
#DLG_WODNOTES{
  z-index: 2200 !important;
}
/* Programs toolbar: align with cards grid (same gutter as cards) */
#USER_PROGRAMS_CNT .ssp-container,
#USER_PROGRAMS_CNT .ss-container{
  margin-left: 0 !important;      /* махаме стария offset */
  padding-left: 24px;             /* правим го като grid-а */
  padding-right: 24px;
  margin-top: 12px !important;
  box-sizing: border-box;
}

/* Mobile */
@media (max-width: 768px){
  #USER_PROGRAMS_CNT .ssp-container,
  #USER_PROGRAMS_CNT .ss-container{
    padding-left: 16px;
    padding-right: 16px;
  }
}
/* ===== Fix layout for tabs inside #WOD-VIEW ===== */

/* 1) scroll-content да заеме цялата ширина */
#WOD-VIEW .mdc-tab-scroller__scroll-content{
  width: 100% !important;
  display: flex !important;
  justify-content: space-between;
}

/* 2) всеки tab да е равен дял */
#WOD-VIEW .mdc-tab{
  flex: 1 1 0 !important;
  min-width: 0 !important;
}

/* 3) центриране на label-а */
#WOD-VIEW .mdc-tab__content{
  justify-content: center;
}
.page-info-inline {
    font-size: 20px;
    line-height: 1;
    vertical-align: middle;
    margin-left: 6px;
    position: relative;
    cursor: pointer;
    opacity: 0.7;
}

.page-info-inline:hover {
    opacity: 1;
}

/*За хедърите да се клика за инфо - начало*/
.page-title-click { cursor: pointer; }
.page-title-click:hover { text-decoration: none; }
.page-title-info-click {display: inline-block;}
/*За хедърите да се клика за инфо - край*/

/* 1) базов акордеон стил */
.y-acc {
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
  margin: 10px 0;
  overflow: hidden;
}

/* 2) summary като “header” */
.y-acc > summary {
  list-style: none;            /* Firefox marker */
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 14px;
  font-weight: 600;            /* “болднато” заглавие */
}

/* 3) махаме триъгълника навсякъде */
.y-acc > summary::marker { display: none; }
.y-acc > summary::-webkit-details-marker { display: none; }

/* 4) chevron с Material Icons */
.y-acc > summary::after {
  content: "expand_more";
  font-family: "Material Icons";
  font-weight: normal;
  font-size: 22px;
  opacity: .7;
  margin-left: 12px;
}

.y-acc[open] > summary::after {
  content: "expand_less";
}

/* 5) съдържание */
.y-acc__body {
  padding: 12px 14px 14px;
  border-top: 1px solid rgba(0,0,0,.08);
  font-weight: 400;
}
/* Унифициран accordion стил за история (блокове + упражнения) */
#wodNotesList details > summary,
#wodList details > summary {
  list-style: none;                 /* Firefox */
  cursor: pointer;
}

/* махаме триъгълника (Chrome/Safari/Edge) */
#wodNotesList details > summary::-webkit-details-marker,
#wodList details > summary::-webkit-details-marker {
  display: none;
}

/* махаме триъгълника (стандарта) */
#wodNotesList details > summary::marker,
#wodList details > summary::marker {
  content: "";
}

/* chevron icon вместо триъгълник */
#wodNotesList details > summary::before,
#wodList details > summary::before {
  content: "chevron_right";
  font-family: "Material Icons";
  font-size: 20px;
  opacity: .7;
  display: inline-block;
  vertical-align: middle;
  margin-right: 8px;
}

#wodNotesList details[open] > summary::before,
#wodList details[open] > summary::before {
  content: "expand_more";
}

/* ако искаш “новия” вид (карта) */
#wodNotesList details,
#wodList details {
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
  margin: 10px 0;
  padding: 0;
}

#wodNotesList details > summary,
#wodList details > summary {
  padding: 12px 14px;
  font-weight: 600;
}
/* 1) Подравняване и отстояния на съдържанието под summary */
#wodNotesList details > *:not(summary),
#wodList details > *:not(summary) {
  padding: 10px 14px 12px 14px;
}

/* 2) Ако вътре първият е <p>, махаме default margin-и, че правят “криво” */
#wodNotesList details > p,
#wodList details > p {
  margin: 0;
  opacity: .75;            /* по-неутрално за “няма бележки” */
}

/* 3) Ако имаш вложени <details> (пример: "Виж/скрий блока"), да не се залепват */
#wodNotesList details details,
#wodList details details {
  margin-top: 10px;
}

/* 4) Малко по-добра визуална йерархия при отворено */
#wodNotesList details[open],
#wodList details[open] {
  box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
/* 1) махаме левия indent на списъка */
#wodNotesList,
#wodDatesList {
  padding-left: 0;
  margin-left: 0;
}

/* 2) сваляме padding-а на summary (това ти дава най-много “място”) */
#wodNotesList details > summary,
#wodDatesList details > summary {
  padding: 12px 10px !important; /* беше 12px 14px */
}

/* 3) текстът вътре (Няма записани...) да не е залепен вляво */
#wodNotesList details > p,
#wodDatesList details > p,
#wodNotesList details > .y-acc__body,
#wodDatesList details > .y-acc__body {
  margin: 8px 0 0 0;
  padding: 0 10px 10px 10px;  /* да следва summary */
}

/* 4) nested акордеони да имат минимален indent (иначе става тесно) */
#wodNotesList details details,
#wodDatesList details details {
  margin-left: 8px;
}
#wodNotesList > details:last-of-type {
  margin-bottom: 16px;
}
/* махаме “картата” само за вътрешното: Виж/скрий блока */
#wodList details.wod-block-toggle,
#wodNotesList details.wod-block-toggle {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  margin: 8px 0 0 0 !important;
  padding: 0 !important;
  border-radius: 0 !important;
}

/* summary-то да е по-компактно и да не “краде” място */
#wodList details.wod-block-toggle > summary,
#wodNotesList details.wod-block-toggle > summary {
  padding: 8px 10px !important;
  font-weight: 600 !important;
}

/* тялото (съдържанието на блока) да тръгва отляво и да има въздух */
#wodList details.wod-block-toggle > .tst-wod-details,
#wodNotesList details.wod-block-toggle > .tst-wod-details {
  padding: 0 10px 10px 10px !important;
}
/* махаме левия indent и при wodList */
#wodList {
  padding-left: 0 !important;
  margin-left: 0 !important;
}
#wodList ul {
  padding-left: 0 !important;
  margin-left: 0 !important;
}

/* още малко “свиване” на summary за повече място */
#wodList details > summary {
  padding: 12px 10px !important;
}
/* винаги оставя въздух под последния елемент в списъка */
#wodList {
  padding-bottom: 18px;
}
#wodNotesList {
  padding-bottom: 18px;
}
#wodList > details:last-of-type,
#wodNotesList > details:last-of-type {
  margin-bottom: 16px;
}
/* "Покажи още ..." – без картата/рамката */
#wodNotesList details.wod-more-toggle {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}

/* оставяме summary-то да изглежда като ред/бутон, но без външна кутия */
#wodNotesList details.wod-more-toggle > summary {
  padding: 10px 12px !important;
  margin: 6px 0 12px 0 !important; /* малко въздух отдолу */
  font-weight: 600 !important;
}

/* ако ul вътре наследява странни отстъпи */
#wodNotesList details.wod-more-toggle > ul {
  margin: 0 !important;
  padding-left: 0 !important;
}
/* Махаме "картата" само на: Покажи и останалите X ... */
#wodList > details {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 10px 0 14px 0 !important;
}

/* Ако синее при open, това го чисти */
#wodList > details[open] {
  background: transparent !important;
}

/* По-приятен summary ред за "Покажи..." */
#wodList > details > summary {
  padding: 10px 12px !important;
  border-radius: 10px !important;
  border: 1px solid rgba(0,0,0,.12) !important; /* ако искаш да има само лек контур */
  background: #fff !important;
  font-weight: 600;
}
/* ===== Diet cards: align with cards-v2 / consumption look ===== */
#USER_DIETS_CNT.cards-v2 .mdc-card {
  border-radius: 12px !important;
}

#USER_DIETS_CNT.cards-v2 .mdc-card__primary-action {
  border-radius: 12px !important;
}

#USER_DIETS_CNT.cards-v2 .diet-meta{
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding-top: 6px;
}

#USER_DIETS_CNT.cards-v2 .diet-meta__label{
  color: rgba(52, 48, 62, 0.72);
  margin-right: 6px;
  font-size: 0.95rem;
}

#USER_DIETS_CNT.cards-v2 .diet-meta__value{
  font-weight: 600;
}

/* keep the grid airy like consumptions */
#USER_DIETS_CNT.cards-v2 .mdc-layout-grid{
  /*padding-top: 0.5rem;*/
    padding-top: 24px;
}
/* ============ PROGRAMS meta: make it identical to DIETS meta ============ */
#USER_PROGRAMS_CNT .card-meta {
  margin-top: 12px;
}

#USER_PROGRAMS_CNT .card-meta-row{
  display: flex;
  align-items: baseline;
  line-height: 1.35rem;
}

#USER_PROGRAMS_CNT .card-meta-label{
  font-style: italic;
  font-weight: 400;              /* като diet-meta_label */
  color: rgba(52, 48, 62, 0.72);
  margin-right: 6px;
}

#USER_PROGRAMS_CNT .card-meta-value{
  font-weight: 600;              /* като diet-meta_value */
  color: var(--not-blk);
}
/* hover/active ефект за блоковете в диалога (дневника) */
#DLG_WODVIEW_CNT .mdc-card.training-card:hover,
#DLG_WODVIEW_CNT .mdc-card.training-card:focus-within{
  background: rgba(255,184,153,.16);
  border-color: rgba(255,184,153,.55);
}
/* Exercise accordion (How-to + Tips) */
.ex-acc{
  border: 1px solid rgba(0,0,0,.12);
  border-radius: 12px;
  background: #fff;
  margin: 10px 0;
  overflow: hidden;
}

.ex-acc > summary{
  list-style: none;
  cursor: pointer;
  padding: 12px 14px;
  font-weight: 600;
  display: flex;
  align-items: center;
  gap: 8px;
  user-select: none;
}

.ex-acc > summary::-webkit-details-marker{ display:none; }

/* Material Icons chevron */
.ex-acc > summary:before{
  content: "chevron_right";
  font-family: "Material Icons";
  font-weight: normal;
  font-style: normal;
  font-size: 22px;
  line-height: 1;
  width: 22px;
  height: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: transform .15s ease;
  opacity: .7;
}

.ex-acc[open] > summary:before{
  transform: rotate(90deg);
}

.ex-acc-body{
  padding: 0 14px 14px 44px; /* space for icon */
  color: rgba(0,0,0,.72);
  font-size: .95rem;
  line-height: 1.45rem;
}

/* да не "залепва" за края на диалога */
#DLG_ADMINBLOCKEXERVIEW_CNT .ex-acc:last-child{
  margin-bottom: 16px;
}
/* Action pills row (video / history / etc.) */
.ex-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin: 10px 0 14px;
}

.ex-action{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 12px;
  border-radius:999px;
  border:1px solid rgba(0,0,0,.12);
  background:#fff;
  color: rgba(0,0,0,.78);
  text-decoration:none;
  cursor:pointer;
  font-weight:600;
  line-height:1;
}

.ex-action .material-icons{
  font-size:20px;
  opacity:.85;
}

.ex-action--video{
  border-color: rgba(0, 150, 136, .35);
}

.ex-action-text{
  font-size:.95rem;
}
.ex-action.is-active {
  background: rgba(0,0,0,0.06);
  border-color: rgba(0,0,0,0.18);
}

.ex-action.is-active .material-icons,
.ex-action.is-active .ex-action-text {
  opacity: 1;
}
.ex-action--video {
  border-color: rgba(255, 0, 0, 0.35);
  color: #CC0000;              /* текстът */
}

.ex-action--video .material-icons {
  color: #CC0000;              /* иконата */
}

.ex-action--video:hover {
  background: rgba(255, 0, 0, 0.06);
}
/* повече въздух между таба и toolbar-а */
#USER_DIETS_CNT .diet-tabs_regimes {
  padding-top: 18px;
}
#USER_DIETS_CNT .diet-back-row {
  display: flex;
  justify-content: flex-start;
  padding: 12px 0 6px 0;
}

#USER_DIETS_CNT .diet-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 10px;
  text-decoration: none;
  font-weight: 600;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.8);
}

#USER_DIETS_CNT .diet-back-btn i.material-icons {
  font-size: 18px;
}
#USER_DIETS_CNT .diet-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border-radius: 10px;
  font-weight: 600;
  border: 1px solid rgba(0,0,0,0.12);
  background: rgba(255,255,255,0.9);
  cursor: pointer;
}

#USER_DIETS_CNT .diet-back-btn:hover {
  background: rgba(255,255,255,1);
}

#USER_DIETS_CNT .diet-back-btn i.material-icons {
  font-size: 18px;
}
#USER_DIETS_CNT .diet-back-row {
  display: flex;
  justify-content: flex-start;
  padding: 12px 0 8px 16px; /* ← това е важното */
}
#USER_DIETS_CNT .diet-back-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;

  padding: 6px 14px;
  border-radius: 999px;              /* pill */
  
  font-size: 14px;
  font-weight: 600;

  background-color: #fff;
  border: 1px solid rgba(0,0,0,0.15);

  color: inherit;
  cursor: pointer;

  transition:
    background-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.05s ease;
}
#USER_DIETS_CNT .diet-back-btn:hover {
  background-color: rgba(0,0,0,0.04);
  box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}
#USER_DIETS_CNT .diet-back-btn:active {
  transform: translateY(1px);
}
#USER_DIETS_CNT .diet-back-btn i.material-icons {
  font-size: 18px;
  line-height: 1;
}
#USER_DIETS_CNT .diet-tabs_regimes .ss-container {
  margin-top: 18px;
}
#USER_DIETS_CNT input[type="text"] {
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

#USER_DIETS_CNT, #USER_CONSUMPTIONS_CNT input[type="text"]:focus {
  outline: none !important;
  border-color: #9BC53D; /* твоята зелена тема */
  /*box-shadow: 0 0 0 1px rgba(155, 197, 61, 0.35);*/
}
/* ===== FOOD PAGE: toolbar layout (desktop) ===== */
#RECIPEMAIN #roga_6containers {
  display: grid;
  grid-template-columns: 1fr auto auto;
  grid-template-areas:
    "filters filters filters"
    "add add add"
    "search sort found";
  gap: 12px;
}

/* контейнерите ти */
#RECIPEMAIN #roga_container3 { grid-area: filters; }
#RECIPEMAIN #roga_container_buttons { grid-area: add; }
#RECIPEMAIN #roga_container1 { grid-area: search; }
#RECIPEMAIN #roga_container6 { grid-area: sort; }
#RECIPEMAIN #roga_container7 { grid-area: found; }

/* responsive: на по-тесни екрани пада на колони */
@media (max-width: 900px) {
  #RECIPEMAIN #roga_6containers {
    grid-template-columns: 1fr;
    grid-template-areas:
      "filters"
      "add"
      "search"
      "sort"
      "found";
  }
}
/* ===== input styling ===== */
#RECIPEMAIN #RECIPESEARCHD {
  height: 34px !important;
  border-radius: 10px !important;
  padding: 0 12px !important;
  border: 1px solid rgba(27, 31, 35, 0.18) !important;
  background: #fff !important;
  box-sizing: border-box;
  outline: none !important;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

/* махаме дебелия черен focus и даваме “зелено” като theme-food */
#RECIPEMAIN #RECIPESEARCHD:focus,
#RECIPEMAIN #RECIPESEARCHD:focus-visible {
  outline: none !important;
  border-color: rgba(155, 197, 61, 0.9) !important;
  box-shadow: 0 0 0 1px rgba(155, 197, 61, 0.35) !important;
}
/* ===== sort select styling ===== */
#RECIPEMAIN #p-found-order {
  line-height: 34px !important;
  white-space: nowrap;
}

#RECIPEMAIN #p-found-order select.select-change {
  height: 34px !important;
  border-radius: 10px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(27, 31, 35, 0.18) !important;
  background: #fff !important;
  box-sizing: border-box;
}
/* ===== pagination container spacing ===== */
#RECIPEMAIN #roga_container8 {
  padding-top: 8px;
}

/* ако customPagination ползва <a> линкове, това ще ги докара като “prgms” */
#RECIPEMAIN #roga_container8 a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 32px;
  height: 32px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid rgba(27, 31, 35, 0.18);
  text-decoration: none;
  margin: 0 4px;
  transition: background-color 0.15s ease, box-shadow 0.15s ease;
}

#RECIPEMAIN #roga_container8 a:hover {
  background-color: rgba(0, 0, 0, 0.04);
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}
#RECIPEMAIN #roga_container8 {
  margin: 18px 0 10px;
}

#RECIPEMAIN #roga_container8 .mdc-layout-grid__inner {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  gap: 8px !important;
}
#RECIPEMAIN #roga_container8 button.mdc-button {
  min-width: 34px;
  height: 34px;

  padding: 0 12px;
  border-radius: 999px;

  border: 1px solid rgba(27, 31, 35, 0.18);
  background: #fff;

  box-shadow: none;
  transition: background-color .15s ease, box-shadow .15s ease, transform .05s ease;
}

/* махаме вътрешните MDC padding-и, които могат да развалят центрирането */
#RECIPEMAIN #roga_container8 button.mdc-button .mdc-button__label {
  font-size: 13px;
  line-height: 1;
}

#RECIPEMAIN #roga_container8 button.mdc-button:hover {
  background-color: rgba(0, 0, 0, 0.04);
  box-shadow: 0 1px 3px rgba(0,0,0,0.12);
}

#RECIPEMAIN #roga_container8 button.mdc-button:active {
  transform: translateY(1px);
}
#RECIPEMAIN #roga_container8 .p-recipe_page_number_inner {
  padding: 0 10px !important;
}

#RECIPEMAIN #roga_container8 .p-recipe_page_number_inner * {
  vertical-align: middle;
}

/* ако “1/562” е в label/span вътре, това го хваща */
#RECIPEMAIN #roga_container8 .p-recipe_page_number_inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;

  height: 34px;
  padding: 0 12px;

  border-radius: 999px;
  border: 1px solid rgba(155, 197, 61, 0.9);
  box-shadow: 0 0 0 1px rgba(155, 197, 61, 0.35);
  background: rgba(155, 197, 61, 0.06);
  font-weight: 600;
}
#RECIPEMAIN #roga_container8 .mdc-button__icon {
  margin: 0 !important;
  font-size: 18px !important;
  line-height: 1 !important;
}
#RECIPEMAIN #roga_container8 button.mdc-button:focus,
#RECIPEMAIN #roga_container8 button.mdc-button:focus-visible {
  outline: none !important;
  box-shadow: 0 0 0 1px rgba(155, 197, 61, 0.35) !important;
  border-color: rgba(155, 197, 61, 0.9) !important;
}
/* Контейнерът с Търсене + Сортиране + Показвай по + Любими */
@media (max-width: 600px) {
  #USER_CONSUMPTIONS .prgms-sort-container {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    gap: 10px;
    width: calc(100% - 48px) !important;
    max-width: calc(100% - 48px) !important;
  }
}
tr.poll:hover,
tr.poll-done:hover {
  background-color: transparent !important;
}
/* ===== Modern dialog baseline ===== */
/* Само заобляне на Material диалози */
.mdc-dialog .mdc-dialog__surface{
  border-radius: 18px !important;
  overflow: hidden; /* по желание - за да следва радиуса съдържанието */
}
/* MDC scrim/backdrop */
.mdc-dialog__scrim{
  background: rgba(0,0,0,.55) !important;
  backdrop-filter: blur(6px);
}
.mdc-dialog .mdc-dialog__surface{
  box-shadow: 0 20px 60px rgba(0,0,0,.18) !important;
}
.mdc-dialog .mdc-dialog__surface{
  border: 0 !important;          /* махаме реалния бордер */
  position: relative;            /* нужно за ::after */
  overflow: hidden;              /* ако вече го имаш – остави */
}

.mdc-dialog .mdc-dialog__surface::after{
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  border: 1px solid rgba(0,0,0,.08);
  border-top-color: transparent; /* няма линия над цветната лента */
  pointer-events: none;
}

.mdc-dialog .mdc-dialog__surface{
  transform: translateY(8px) scale(.985);
  opacity: 0;
  transition: transform .18s ease-out, opacity .18s ease-out;
}

.mdc-dialog.mdc-dialog--open .mdc-dialog__surface{
  transform: translateY(0) scale(1);
  opacity: 1;
}
.mdc-dialog .mdc-dialog__content{
  -webkit-overflow-scrolling: touch;
  scrollbar-gutter: stable; /* ако браузърът поддържа */
}
.accordion .panel{
  scroll-margin-top: 12px; /* по-приятно при jump-to */
}
.mdc-dialog button:focus-visible,
.mdc-dialog [tabindex]:focus-visible{
  outline: 2px solid rgba(0,0,0,.35);
  outline-offset: 2px;
  border-radius: 10px;
}
/* Контейнерът на акордеона да изглежда като card */
.accordion{
  border: 1px solid rgba(0,0,0,.08) !important;
  border-radius: 14px !important;
  overflow: hidden; /* да следва радиуса */
  background: #fff; /* ако вече си на бяло - няма видима промяна */
}

/* Заглавната част (клик зоната) – по-чисто, без тежки линии */
.accordion .paneldiv{
  border-bottom: 1px solid rgba(0,0,0,.06);
}

/* Последният да няма долна линия */
.accordion .paneldiv:last-child{
  border-bottom: 0;
}
.accordion:hover{
  border-color: rgba(0,0,0,.12) !important;
}

.accordion.active{
  border-color: rgba(0,0,0,.16) !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.10);
}
/* Замени селектора с твоя за иконата */
.accordion .accordion-icon,
.accordion .plusIcon,
.accordion .mdc-icon-button{
  transition: transform .18s ease, opacity .18s ease;
  opacity: .75;
}

/* При отворен акордеон */
.accordion.active .accordion-icon,
.accordion.active .plusIcon{
  transform: rotate(180deg);
  opacity: 1;
}
/* Пример: входни полета вътре в акордеоните – по-лека рамка */
.accordion input,
.accordion select,
.accordion textarea{
  border-color: rgba(0,0,0,.18);
}

.accordion input:focus,
.accordion select:focus,
.accordion textarea:focus{
  outline: none;
  border-color: rgba(0,0,0,.35);
}
/* Ако header-ът е отделен – сложи селектора на header-а */
.accordion .paneldiv{
  position: sticky;
  top: 0;
  z-index: 2;
  background: #fff;
}
/* Трансформираме само иконата вътре */
.mdc-dialog__close svg,
.mdc-dialog__close i,
.yuli-dialog-close svg,
.yuli-dialog-close i,
.dialog-close svg,
.dialog-close i {
  transition: transform .18s ease;
  transform-origin: 50% 50%;
}

.mdc-dialog__close:hover svg,
.mdc-dialog__close:hover i,
.yuli-dialog-close:hover svg,
.yuli-dialog-close:hover i,
.dialog-close:hover svg,
.dialog-close:hover i {
  transform: rotate(90deg);
}

/* ===== Modern pill for "Суета" inside event-options ===== */
#CONFESSDAY-LEFT .event-options{
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 12px !important;
  align-items: center !important;

  /* важно: да има място под бутоните */
  margin-bottom: 14px !important;
}
#CONFESSDAY-LEFT table.mdc-data-table__table{
  margin-top: 10px !important;
}
#CONFESSDAY-LEFT .event-options,
#CONFESSDAY-LEFT .event-options *{
  box-sizing: border-box;
}

#CONFESSDAY-LEFT .event-options{
  position: relative !important;
  z-index: 2 !important; /* да е над таблицата ако има overlap */
}
#CONFESSDAY-LEFT .event-options{
  width: 100% !important;
  justify-content: flex-start !important;
}
#CONFESSDAY-LEFT .event-options button.mdc-button{
  height: 36px !important;
  min-height: 36px !important;

  padding: 0 16px !important;
  border-radius: 999px !important;

  font-size: 14px !important;
  font-weight: 500 !important;
  letter-spacing: .2px;

  box-shadow: 0 2px 6px rgba(0,0,0,.08);
  transition: 
    background-color .2s ease,
    box-shadow .2s ease,
    transform .15s ease,
    opacity .2s ease;
}
#CONFESSDAY-LEFT .btn-navbar-purple:hover:not(:disabled) {
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(233,166,218,.45);
  /*background: linear-gradient(*/
  /*  135deg,*/
  /*  #f7cdef,*/
  /*  #ecb3df*/
  /*) !important;*/
}
#CONFESSDAY-LEFT .btn-navbar-purple.active,
#CONFESSDAY-LEFT .btn-navbar-purple[data-active="1"]{
  outline: 2px solid #d77ac6;
  outline-offset: 2px;
}
#CONFESSDAY-LEFT .event-options button:disabled{
  opacity: .45 !important;
  box-shadow: none !important;
  transform: none !important;
  cursor: default !important;
}
#CONFESSDAY-LEFT .event-options .mdc-button__icon{
  font-size: 16px;
  margin-right: 6px;
  opacity: .85;
}
/* Bigger + more “CTA-like” chips only for top event-options */
#CONFESSDAY-LEFT .event-options button.btn-navbar{
  min-height: 42px !important;
  height: 42px !important;

  padding: 0 20px !important;
  border-radius: 999px !important;

  font-size: 15px !important;
  font-weight: 600 !important;

  /* makes them “stand out” from the white card */
  box-shadow: 0 8px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.35) !important;
  border: 1px solid rgba(0,0,0,.06) !important;
}
#CONFESSDAY-LEFT .event-options button.btn-navbar:hover:not(:disabled){
  transform: translateY(-1px) !important;
  box-shadow: 0 12px 26px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.45) !important;
}
#CONFESSDAY-LEFT .event-options button.btn-navbar i,
#CONFESSDAY-LEFT .event-options button.btn-navbar .mdc-button__icon{
  font-size: 18px !important;
  margin-right: 8px !important;
  opacity: .9 !important;
}
#CONFESSDAY-LEFT .event-options{
  justify-content: flex-start !important;
  padding: 8px 0 14px !important;
}


#CONFESSDAY-LEFT .btn-navbar-orange.active,
#CONFESSDAY-LEFT .btn-navbar-orange[data-active="1"]{
  outline: 2px solid #94c13d;
  outline-offset: 2px;
}

#CONFESSDAY-LEFT .btn-navbar-pink.active,
#CONFESSDAY-LEFT .btn-navbar-pink[data-active="1"]{
  outline: 2px solid #ff8f6b;
  outline-offset: 2px;
}
/* ===== Modern pill – Лакомия ===== */
#CONFESSDAY-LEFT .btn-navbar-orange.hdeating{
  background: linear-gradient(
    135deg,
    #cde48f,
    #b8d56f
  ) !important;

  color: #1f2d0a !important;
  border: 1px solid rgba(0,0,0,.06) !important;
}

#CONFESSDAY-LEFT .btn-navbar-orange.hdeating:hover:not(:disabled){
  transform: translateY(-1px) !important;
}

#CONFESSDAY-LEFT .btn-navbar-orange.hdeating.active{
  outline: 2px solid #9ec44d;
  outline-offset: 2px;
}
/* ===== Modern pill – Леност ===== */
#CONFESSDAY-LEFT .btn-navbar-pink.hdtraining{
  background: linear-gradient(
    135deg,
    #ffb997,
    #ffa574
  ) !important;

  color: #3a1e0a !important;
  border: 1px solid rgba(0,0,0,.06) !important;
}

#CONFESSDAY-LEFT .btn-navbar-pink.hdtraining:hover:not(:disabled){
  transform: translateY(-1px) !important;
}

#CONFESSDAY-LEFT .btn-navbar-pink.hdtraining.active{
  outline: 2px solid #ff915a;
  outline-offset: 2px;
}
#CONFESSDAY-LEFT .event-options button i,
#CONFESSDAY-LEFT .event-options button .mdc-button__icon{
  font-size: 18px !important;
  margin-right: 8px !important;
  opacity: .9 !important;
}
/* ===== Fix: remove MDC overlay "double layer" only for top pills ===== */
#CONFESSDAY-LEFT .event-options button.btn-navbar::before,
#CONFESSDAY-LEFT .event-options button.btn-navbar::after{
  opacity: 0 !important;
  background-color: transparent !important;
}

#CONFESSDAY-LEFT .event-options button.btn-navbar .mdc-button__ripple{
  opacity: 0 !important;
}
/* ===== Unify shadow/hover for the 3 top pills ===== */
#CONFESSDAY-LEFT .event-options button.btn-navbar{
  /* един общ shadow за всички */
  box-shadow: 0 8px 18px rgba(0,0,0,.10), inset 0 1px 0 rgba(255,255,255,.35) !important;
}

#CONFESSDAY-LEFT .event-options button.btn-navbar:hover:not(:disabled){
  box-shadow: 0 12px 26px rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.45) !important;
}

/* Цветен “glow” (лек) – еднаква логика за всеки бутон */
#CONFESSDAY-LEFT .btn-navbar-orange.hdeating:hover:not(:disabled){
  box-shadow:
    0 12px 26px rgba(0,0,0,.14),
    0 0 0 3px rgba(160,200,80,.18),
    inset 0 1px 0 rgba(255,255,255,.45) !important;
}

#CONFESSDAY-LEFT .btn-navbar-pink.hdtraining:hover:not(:disabled){
  box-shadow:
    0 12px 26px rgba(0,0,0,.14),
    0 0 0 3px rgba(255,165,116,.18),
    inset 0 1px 0 rgba(255,255,255,.45) !important;
}

#CONFESSDAY-LEFT .btn-navbar-purple.hdbiometrics:hover:not(:disabled){
  box-shadow:
    0 12px 26px rgba(0,0,0,.14),
    0 0 0 3px rgba(233,166,218,.18),
    inset 0 1px 0 rgba(255,255,255,.45) !important;
}
/* === HABIT STREAKS (PASTEL) === */

/* Успешна серия (done) – пастелно teal */
.fc-event.habit-streak-green {
  background-color: #D9F4EE !important;
  border-color: #2FB59E !important;
  color: #0F172A !important;
}

/* Дълга серия (gold) – пастелно златно */
.fc-event.habit-streak-gold {
  background-color: #FFF4CC !important;
  border-color: #E9C75F !important;
  color: #0F172A !important;
  font-weight: 600;
}

/* Прекъсната серия (broken) – пастелно червено */
.fc-event.habit-streak-broken {
  background-color: #FCE3E1 !important;
  border-color: #F3A8A0 !important;
  color: #0F172A !important;
  font-style: italic;
}

/* Нормално / без серия (неизпълнен) – бяло с teal бордер (НЕ синьо) */
.fc-event.habit-streak-neutral {
  background-color: #ffffff !important;
  border-color: #2FB59E !important;
  color: #0F172A !important;
}

/* Лека “карта” сянка само за done/gold (по-деликатно) */
.fc-event.habit-streak-green,
.fc-event.habit-streak-gold {
  box-shadow: 0 0 0 1px rgba(0,0,0,0.04),
              0 2px 6px rgba(0,0,0,0.10);
}

/* Ако не искаш анимация – махни целия този блок */
.fc-event.habit-streak-gold {
  animation: pulse-gold 1.6s ease-in-out infinite alternate;
}
@keyframes pulse-gold {
  from { box-shadow: 0 0 6px rgba(233, 199, 95, 0.25); }
  to   { box-shadow: 0 0 12px rgba(233, 199, 95, 0.45); }
}

.fc-day-today {
        background-color: var(--fc-today-bg-color, rgba(255, 220, 40, 0.15)) !important;
}
/* празните редове за навици */
.fc-event.habit-spacer{
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  color: transparent !important;
  pointer-events: none !important;
}

/* да пазят височина като нормален ред */
.fc-daygrid-event.habit-spacer,
.fc-event.habit-spacer .fc-event-main {
  min-height: 22px; /* нагласи според твоя ред */
}
/* държи “ред”, но е невидим и некликаем */
.fc-daygrid-event.fc-slot-placeholder {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* за всеки случай – да не оставя бордери */
.fc-daygrid-event.fc-slot-placeholder,
.fc-daygrid-event.fc-slot-placeholder .fc-event-main {
  border: 0 !important;
}
/* по-чист текст */
.fc .fc-daygrid-event {
  border-radius: 6px;
}

/* outline events: когато background е transparent, да остане бяло “картонче” */
.fc .fc-daygrid-event {
  background-clip: padding-box;
}

/* по-добър контраст за link/текст */
.fc .fc-daygrid-event .fc-event-title,
.fc .fc-daygrid-event .fc-event-time {
  font-weight: 500;
}
/* по подразбиране placeholders са невидими (това го имаш) */
.fc-daygrid-event.fc-slot-placeholder {
  opacity: 0 !important;
  pointer-events: none !important;
}

/* workout placeholder да се вижда САМО ако е missing (има програма) */
.fc-daygrid-event.fc-slot-placeholder.slot-workout.slot-workout-missing {
  opacity: 1 !important;
  pointer-events: auto !important;

  background: #fff !important;
  border: 1px solid #E8974C !important; /* твоят оранжев */
}

/* текстът да е четим */
.fc-daygrid-event.fc-slot-placeholder.slot-workout.slot-workout-missing .fc-event-title {
  color: #111 !important;
}

/* текстът да е четим */
.fc-daygrid-event.fc-slot-placeholder.slot-workout .fc-event-title {
  color: #111 !important;
}
.fc-event.slot-food {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #D3E4AB !important; /* същото зелено, но само бордер */
}
/* slot 4 - missing diet day: бяло с зелен бордер */
.fc-event.slot-food-missing {
  background: #fff !important;
  color: #111 !important;
  border: 1px solid #D3E4AB !important; /* или какъвто е твоят diet green */
}

/* slot 4 - empty: невидим, но пази мястото */
.fc-event.slot-food-empty {
  background: transparent !important;
  border-color: transparent !important;
  color: transparent !important;
  opacity: 0 !important;          /* пази височина, но не се вижда */
  pointer-events: none !important; /* да не се клика */
  box-shadow: none !important;
}
/* показваме бордер само когато има програма */
.fc-event.slot-workout-missing{
  background:#fff !important;
  color:#111 !important;
  border:1px solid #FFDCCC !important;
}

/* когато няма програма: абсолютно нищо видимо */
.fc-event.slot-workout-empty{
  background:transparent !important;
  border-color:transparent !important;
  color:transparent !important;
  opacity:0 !important;
  pointer-events:none !important;
  box-shadow:none !important;
}
.fc-event.slot-workout-empty,
.fc-event.slot-workout-empty *{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  color: transparent !important;
}

/* poll – зададена, но неотговорена */
.fc-event.poll.slot-poll-missing {
  background: #fff !important;
  border: 1px solid var(--btn-slt, #99D5EC) !important;
}

.fc-event.poll.slot-poll-missing .fc-event-title {
  color: #0F172A !important;
}

/* poll – отговорена: гарантиран четим текст */
.fc-event.poll.poll-done {
  background: var(--btn-slthover, #E6F5FB) !important;
  border: 1px solid var(--btn-slt, #99D5EC) !important;
}

.fc-event.poll.poll-done .fc-event-title {
  color: #0F172A !important;
}
.fc-event.poll .fc-event-title {
  color: #0F172A !important;
}
/* === SELECTED DIET DAY (filled but softer + border) === */
.fc-event.slot-food-selected {
  background: #EAF6D7 !important;      /* по-меко от #D3E4AB */
  border: 1px solid #A7C96E !important; /* по-тъмен зелен бордер */
  color: #0F172A !important;
}

/* === SELECTED WORKOUT (filled but softer + border) === */
.fc-event.slot-workout-selected {
  background: #FFE9DE !important;      /* по-меко от peach */
  border: 1px solid #E8974C !important; /* вашият оранжев бордер */
  color: #0F172A !important;
}
/* === ONE RED THEME (broken) for devil / couch / broken streak === */
.fc-event.is-broken {
  background-color: #FCE3E1 !important;
  border-color: #F3A8A0 !important;
  color: #0F172A !important;
  font-style: italic;
}
/* по-ясен бордер и еднакъв радиус за избрани food/workout */
.fc .fc-daygrid-event {
  border-radius: 6px;
}

/* да не “потъва” бордера при fill event */
.fc .fc-daygrid-event .fc-event-main {
  border-radius: 6px;
}
.fc-event[data-etype="food"],
.fc-event[data-etype="workout"]{
  box-shadow: 0 0 0 1px rgba(0,0,0,0.03);
}
/* === HABITS: махаме checkbox / circle иконките === */
.fc-event.habit .fc-event-main i:first-child,
.fc-event.habit .fc-event-main svg:first-child {
  display: none !important;
}
/* === HABITS – pink based === */

/* done – normal habit */
.fc-event.habit.habit-done {
  background-color: #F6DDE8 !important;
  border-color: #E3AFC4 !important;
  color: #0F172A !important;
}

/* not done – neutral habit */
.fc-event.habit.habit-neutral {
  background-color: #ffffff !important;
  border-color: #E3AFC4 !important;
  color: #0F172A !important;
}

/* broken habit (НЕ розово, а червено – както искаше) */
.fc-event.habit.habit-broken {
  background-color: #FCE3E1 !important;
  border-color: #E76F51 !important;
  color: #0F172A !important;
}

/* gold streak */
.fc-event.habit.habit-gold {
  background-color: #FFF4CC !important;
  border-color: #E9C75F !important;
  color: #0F172A !important;
  font-weight: 600;
}

/* докато се зарежда – скриваме вътрешността, но пазим размера */
.yuli-cal-loading .fc-view-harness,
.yuli-cal-loading .fc-scrollgrid {
  visibility: hidden;
}

/* overlay (по желание) */
.yuli-cal-loading {
  position: relative;
}

.yuli-cal-loading::after {
  content: "Зареждане...";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255,255,255,0.85);
  font-size: 14px;
  z-index: 5;
}
/* всички задачи в дневника */
tr.task th,
tr.task td {
  border-top: 10px solid #fff;
  font-weight: 600;
}

tr.task span {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 25px;
  background: #fff;
  border: 1.5px solid transparent;
  color: var(--fc-text-dark);
}
tr.task-food span {
  border-color: var(--orange-300);
}

tr.task-food.poll-done span {
  background: var(--orange-300);
}
tr.task-workout span {
  border-color: var(--yellow-900);
}

tr.task-workout.poll-done span {
  background: var(--yellow-300);
}
tr.task-vanity span {
  border-color: var(--purple-900);
}

tr.task-vanity.poll-done span {
  background: var(--purple-300);
}
tr.task-poll span {
  border-color: var(--btn-slt);
}

tr.task-poll.poll-done span {
  background: var(--pink-300);
}
tr.task span:hover {
  cursor: pointer;
  background: var(--not-blk);
  color: #fff;
  border-color: var(--not-blk);
}
/* === Confession дневник: colors synced with calendar (overrides) === */

/* общо: правим label-а да изглежда като pill */
tr.slot-food-selected .mdc-button__label,
tr.slot-food-missing  .mdc-button__label,
tr.slot-workout-selected .mdc-button__label,
tr.slot-workout-missing  .mdc-button__label,
tr.slot-poll-missing .mdc-button__label,
tr.poll.poll-done .mdc-button__label,
tr.habit-done .mdc-button__label,
tr.habit-missing .mdc-button__label {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 25px;
  background: #fff !important;
  color: var(--fc-text-dark) !important;
}

/* FOOD (зелено) */
tr.slot-food-missing  .mdc-button__label { border: 1.5px solid var(--orange-300) !important; }
tr.slot-food-selected .mdc-button__label { background: var(--orange-300) !important; border: 1.5px solid var(--orange-300) !important; }

/* WORKOUT (прасковено) */
tr.slot-workout-missing  .mdc-button__label { border: 1.5px solid var(--yellow-900) !important; }
tr.slot-workout-selected .mdc-button__label { background: var(--yellow-300) !important; border: 1.5px solid var(--yellow-900) !important; }

/* POLL (синьо) */
tr.slot-poll-missing .mdc-button__label { border: 1.5px solid var(--btn-slt) !important; }
tr.poll.poll-done    .mdc-button__label { background: var(--pink-300) !important; border: 1.5px solid var(--btn-slt) !important; }

/* HABIT (ако искаш базово teal) */
tr.habit-missing .mdc-button__label { border: 1.5px solid #2FB59E !important; }
tr.habit-done    .mdc-button__label { background: #D9F4EE !important; border: 1.5px solid #2FB59E !important; }

/* hover (по желание) */
tr.slot-food-selected .mdc-button__label:hover,
tr.slot-food-missing  .mdc-button__label:hover,
tr.slot-workout-selected .mdc-button__label:hover,
tr.slot-workout-missing  .mdc-button__label:hover,
tr.slot-poll-missing .mdc-button__label:hover,
tr.poll.poll-done .mdc-button__label:hover,
tr.habit-done .mdc-button__label:hover,
tr.habit-missing .mdc-button__label:hover {
  background: #858585 !important;
  border-color: #858585 !important;
  color: #fff !important;
}
/* =========================================================
   CONFESSION дневник – task pills synced with calendar
   Missing = outline (white), Done = pastel fill, Hover = pastel hover
   ========================================================= */

/* =========================================================
   CONFESSION дневник – SAFE scope само за TASK редове
   (не пипа main-tr-training / main-tr-eating / други редове)
   ========================================================= */

body.confession-page #event-table tr.slot-food-missing  .mdc-button__label,
body.confession-page #event-table tr.slot-food-selected .mdc-button__label,
body.confession-page #event-table tr.slot-workout-missing  .mdc-button__label,
body.confession-page #event-table tr.slot-workout-selected .mdc-button__label,
body.confession-page #event-table tr.slot-poll-missing .mdc-button__label,
body.confession-page #event-table tr.poll .mdc-button__label,
body.confession-page #event-table tr.habit .mdc-button__label{
  display:inline-block;
  padding:6px 12px;
  border-radius:25px;
  background:#fff !important;
  color: var(--fc-text-dark) !important;
  border:1.5px solid var(--grey-300);
  transition: background-color .12s ease, border-color .12s ease, color .12s ease;
}

/* Hover – само за task редове */
body.confession-page #event-table tr.slot-food-missing:hover  .mdc-button__label,
body.confession-page #event-table tr.slot-food-selected:hover .mdc-button__label,
body.confession-page #event-table tr.slot-workout-missing:hover  .mdc-button__label,
body.confession-page #event-table tr.slot-workout-selected:hover .mdc-button__label,
body.confession-page #event-table tr.slot-poll-missing:hover .mdc-button__label,
body.confession-page #event-table tr.poll:hover .mdc-button__label,
body.confession-page #event-table tr.habit:hover .mdc-button__label{
  background:#858585 !important;
  border-color:#858585 !important;
  color:#fff !important;
}

/* FOOD */
body.confession-page #event-table tr.slot-food-missing  .mdc-button__label{ border-color: var(--orange-300) !important; }
body.confession-page #event-table tr.slot-food-selected .mdc-button__label{
  background: var(--orange-300) !important;
  border-color: var(--orange-300) !important;
  color: var(--fc-text-dark) !important;
}

/* WORKOUT */
body.confession-page #event-table tr.slot-workout-missing  .mdc-button__label{ border-color: var(--yellow-900) !important; }
body.confession-page #event-table tr.slot-workout-selected .mdc-button__label{
  background: var(--yellow-300) !important;
  border-color: var(--yellow-900) !important;
  color: var(--fc-text-dark) !important;
}

/* POLL */
body.confession-page #event-table tr.slot-poll-missing .mdc-button__label{ border-color: var(--btn-slt) !important; }
body.confession-page #event-table tr.poll.poll-done .mdc-button__label{
  background: var(--pink-300) !important;
  border-color: var(--btn-slt) !important;
  color: var(--fc-text-dark) !important;
}

/* HABIT */
body.confession-page #event-table tr.habit.habit-missing .mdc-button__label{ border-color:#2FB59E !important; }
body.confession-page #event-table tr.habit.habit-done .mdc-button__label{
  background:#D9F4EE !important;
  border-color:#2FB59E !important;
  color: var(--fc-text-dark) !important;
}
/* =========================================================
   CONFESSION: Food/Workout задачи – subtle selected + color hover (no grey)
   ========================================================= */

/* FOOD base (missing + selected share same hover family) */
body.confession-page #event-table tr.slot-food-missing .mdc-button__label,
body.confession-page #event-table tr.slot-food-selected .mdc-button__label{
  border-color: var(--orange-300) !important;
  color: var(--fc-text-dark) !important;
}

/* FOOD missing = white */
body.confession-page #event-table tr.slot-food-missing .mdc-button__label{
  background: var(--orange-100) !important; /* missing = оцветено */
}

body.confession-page #event-table tr.slot-food-selected .mdc-button__label{
  background:#fff !important;               /* selected = неоцветено */
}

/* FOOD hover (и за missing, и за selected) = същата гама, НЕ сиво */
body.confession-page #event-table tr.slot-food-missing:hover .mdc-button__label,
body.confession-page #event-table tr.slot-food-selected:hover .mdc-button__label{
  background: var(--btn-glthover) !important;
  border-color: var(--orange-300) !important;
  color: var(--fc-text-dark) !important;
}


/* WORKOUT base */
body.confession-page #event-table tr.slot-workout-missing .mdc-button__label,
body.confession-page #event-table tr.slot-workout-selected .mdc-button__label{
  border-color: var(--yellow-300) !important;
  color: var(--fc-text-dark) !important;
}

/* WORKOUT missing = white */
body.confession-page #event-table tr.slot-workout-missing .mdc-button__label{
  background: var(--yellow-100) !important; /* missing = оцветено */
}

body.confession-page #event-table tr.slot-workout-selected .mdc-button__label{
  background:#fff !important;               /* selected = неоцветено */
}


/* WORKOUT hover (и missing, и selected) = същата гама, НЕ сиво */
body.confession-page #event-table tr.slot-workout-missing:hover .mdc-button__label,
body.confession-page #event-table tr.slot-workout-selected:hover .mdc-button__label{
  background: var(--btn-lsthover) !important;
  border-color: var(--yellow-900) !important;
  color: var(--fc-text-dark) !important;
}
/* =========================================================
   CONFESSION: Poll & Habit – subtle color hover (no grey)
   ========================================================= */

/* ---------- POLL ---------- */

/* base */
body.confession-page #event-table tr.slot-poll-missing .mdc-button__label,
body.confession-page #event-table tr.poll.poll-done .mdc-button__label{
  border-color: var(--btn-slt) !important;
  color: var(--fc-text-dark) !important;
}

/* missing = white */
body.confession-page #event-table tr.slot-poll-missing .mdc-button__label{
  background: var(--pink-100) !important;  /* missing = оцветено */
}

body.confession-page #event-table tr.poll.poll-done .mdc-button__label{
  background:#fff !important;              /* done = неоцветено */
}


/* hover = subtle blue (и за missing, и за done) */
body.confession-page #event-table tr.slot-poll-missing:hover .mdc-button__label,
body.confession-page #event-table tr.poll.poll-done:hover .mdc-button__label{
  background: var(--btn-slthover) !important;
  border-color: var(--btn-slt) !important;
  color: var(--fc-text-dark) !important;
}


/* ---------- HABIT ---------- */

/* base */
body.confession-page #event-table tr.habit.habit-missing .mdc-button__label,
body.confession-page #event-table tr.habit.habit-done .mdc-button__label{
  border-color:#2FB59E !important;
  color: var(--fc-text-dark) !important;
}

/* missing = white */
body.confession-page #event-table tr.habit.habit-missing .mdc-button__label{
  background: var(--teal-100) !important; /* missing = оцветено */
}

body.confession-page #event-table tr.habit.habit-done .mdc-button__label{
  background:#fff !important;              /* done = неоцветено */
}


/* hover = subtle teal (и за missing, и за done) */
body.confession-page #event-table tr.habit.habit-missing:hover .mdc-button__label,
body.confession-page #event-table tr.habit.habit-done:hover .mdc-button__label{
  background: #D9F4EE !important; /* вече ползван teal hover */
  border-color:#2FB59E !important;
  color: var(--fc-text-dark) !important;
}
/* =========================================================
   CONFESSION – HABIT buttons: no grey hover, use teal tint
   ========================================================= */

/* 1) База (да сме сигурни, че няма да наследи сивото) */
body.confession-page #event-table tr.habit:hover .mdc-button__label,
body.confession-page #event-table tr.habit:hover span.mdc-button__label{
  background: #D9F4EE !important;   /* лек teal hover */
  border-color: #2FB59E !important;
  color: var(--fc-text-dark) !important;
}

/* 2) Ако имаш отделни класове habit-missing / habit-done – опционално */
body.confession-page #event-table tr.habit.habit-missing .mdc-button__label{
  background: #E6F5F2 !important;   /* missing = оцветено */
  border-color: #2FB59E !important;
  color: var(--fc-text-dark) !important;
}

body.confession-page #event-table tr.habit.habit-done .mdc-button__label{
  background: #fff !important;      /* done = неоцветено */
  border-color: #2FB59E !important;
  color: var(--fc-text-dark) !important;
}


body.confession-page #event-table tr.habit.habit-done:hover .mdc-button__label,
body.confession-page #event-table tr.habit.habit-missing:hover .mdc-button__label{
  background: #D9F4EE !important;
  border-color: #2FB59E !important;
  color: var(--fc-text-dark) !important;
}
body.confession-page #event-table tr.habit:hover,
body.confession-page #event-table tr.habit:hover th,
body.confession-page #event-table tr.habit:hover td{
  background: transparent !important;
}
/* =========================================================
   CONFESSION – hard remove row separators for POLL & HABIT
   (covers border + outline + box-shadow + pseudo dividers)
   ========================================================= */

/* 1) махаме border/outline/shadow на самия ред */
body.confession-page #event-table tr.slot-poll-missing,
body.confession-page #event-table tr.poll.poll-done,
body.confession-page #event-table tr.habit{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* 2) махаме divider-и по клетките */
body.confession-page #event-table tr.slot-poll-missing > td,
body.confession-page #event-table tr.slot-poll-missing > th,
body.confession-page #event-table tr.poll.poll-done > td,
body.confession-page #event-table tr.poll.poll-done > th,
body.confession-page #event-table tr.habit > td,
body.confession-page #event-table tr.habit > th{
  border-top: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  background-image: none !important;
}

/* 3) ако divider-ът е pseudo element (много често при custom таблици) */
body.confession-page #event-table tr.slot-poll-missing::before,
body.confession-page #event-table tr.slot-poll-missing::after,
body.confession-page #event-table tr.poll.poll-done::before,
body.confession-page #event-table tr.poll.poll-done::after,
body.confession-page #event-table tr.habit::before,
body.confession-page #event-table tr.habit::after{
  content: none !important;
  display: none !important;
}

/* 4) ако идва от MDC класовете върху същия tr */
body.confession-page #event-table tr.mdc-data-table__row.slot-poll-missing,
body.confession-page #event-table tr.mdc-data-table__row.poll.poll-done,
body.confession-page #event-table tr.mdc-data-table__row.habit{
  border-bottom: 0 !important;
  box-shadow: none !important;
}
/* =========================================================
   CONFESSION – hide icon for HABIT rows (keep for POLL)
   ========================================================= */

/* скриваме иконката само при навици */
body.confession-page #event-table tr.habit i.material-icons,
body.confession-page #event-table tr.habit .mdc-button__icon{
  display: none !important;
}

/* по желание: леко намаляваме левия padding, за да не остава празно място */
body.confession-page #event-table tr.habit .mdc-button__label{
  padding-left: 10px !important;
}
/* =========================================================
   CONFESSION – hide poll icon when poll is DONE (checkmark is enough)
   ========================================================= */

/* махаме иконата за анкета, когато е poll-done */
body.confession-page #event-table tr.poll.poll i.material-icons,
body.confession-page #event-table tr.poll.poll .mdc-button__icon,
body.confession-page #event-table tr.poll.poll-done i.material-icons,
body.confession-page #event-table tr.poll.poll-done .mdc-button__icon{
  display: none !important;
}

/* леко компенсираме padding-а, за да не остава празно място */
body.confession-page #event-table tr.poll.poll-done .mdc-button__label{
  padding-left: 10px !important;
}
/* =========================================================
   CONFESSION – reduce vertical gap between Food & Workout selectors
   ========================================================= */

/* намаляваме spacing-а САМО за двата top selector реда */
body.confession-page #event-table
tr.slot-food-missing,
body.confession-page #event-table
tr.slot-food-selected,
body.confession-page #event-table
tr.slot-workout-missing,
body.confession-page #event-table
tr.slot-workout-selected{
  border-top-width: 4px !important;   /* било е ~10px */
  border-bottom-width: 4px !important;
}

/* ако spacing-ът идва от td/th */
body.confession-page #event-table
tr.slot-food-missing td,
body.confession-page #event-table
tr.slot-food-selected td,
body.confession-page #event-table
tr.slot-workout-missing td,
body.confession-page #event-table
tr.slot-workout-selected td,
body.confession-page #event-table
tr.slot-food-missing th,
body.confession-page #event-table
tr.slot-food-selected th,
body.confession-page #event-table
tr.slot-workout-missing th,
body.confession-page #event-table
tr.slot-workout-selected th{
  padding-top: 4px !important;
  padding-bottom: 4px !important;
}
body.confession-page #event-table tr.slot-workout-missing{
  border-top-width: 0 !important;
}
/* Segmented control (iOS/Notion vibe) */
.pregled-toolbar{
  display:flex;
  flex-wrap:wrap;
  gap:14px;
  align-items:flex-start;
  margin-bottom:12px;
}

/* wrapper за група */
.seg-wrap{
  display:flex;
  flex-direction:column;
  gap:6px;
}

/* малък надпис над сегментите */
.seg-label{
  font-size:12px;
  font-weight:700;
  color:#666;
  padding-left:2px;
}

/* самата segmented bar */
.seg-group{
  display:flex;
  flex-wrap:nowrap;
  gap:0;
  border:1px solid #e7e7e7;
  background:#fafafa;
  border-radius:12px;
  overflow:hidden;
  width:fit-content;
  max-width:100%;
}

/* сегмент */
.seg{
  position:relative;
  display:inline-flex;
  align-items:center;
  cursor:pointer;
  user-select:none;
}

/* скриваме checkbox-а */
.seg input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

/* видимата част */
.seg span{
  display:inline-flex;
  align-items:center;
  padding:7px 12px;
  font-size:13px;
  color:#666;
  border-right:1px solid #ededed;
  transition:background .15s ease, color .15s ease, box-shadow .15s ease;
  white-space:nowrap;
}

.seg:last-child span{ border-right:none; }

.seg:hover span{ background:#f1f1f1; }

/* active */
.seg input:checked + span{
  background:#fff;
  color:#111;
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.06);
}

/* focus (keyboard) */
.seg input:focus + span{
  outline:2px solid rgba(26,166,196,.35);
  outline-offset:-2px;
}

/* мобилен UX: хоризонтален скрол за всяка група */
@media (max-width: 900px){
  .seg-group{
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }
  .seg-group::-webkit-scrollbar{ height:6px; }
  .seg-group::-webkit-scrollbar-thumb{
    background:#ddd;
    border-radius:999px;
  }
}
/* ===== Sticky one-row toolbar ===== */
.pregled-toolbar--sticky{
  position: sticky;
  top: 0;                 /* ако имаш фиксиран header, ще го офсетнем по-долу */
  z-index: 50;
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.06);
  padding: 10px 8px;
  margin: -16px -16px 12px;  /* ако .pregled-page е padding:16px; */
}

/* един ред за групите */
.pregled-toolbar--sticky{
  display:flex;
  flex-wrap:nowrap;        /* важната част */
  gap:16px;
  align-items:flex-end;
  overflow-x:auto;         /* ако не събира -> скрол встрани */
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}

/* да не се свиват групите */
.pregled-toolbar--sticky .seg-wrap{
  flex: 0 0 auto;
}

/* по-компактни надписи при sticky */
.pregled-toolbar--sticky .seg-label{
  font-size:11px;
  color:#777;
}

/* scrollbar (по-минималистично) */
.pregled-toolbar--sticky::-webkit-scrollbar{ height:6px; }
.pregled-toolbar--sticky::-webkit-scrollbar-thumb{
  background: rgba(0,0,0,.14);
  border-radius:999px;
}
#PREGLED_CALENDAR{ scroll-margin-top: 90px; }

/* Material menu/dropdown винаги над sticky toolbars */
.mdc-menu-surface,
.mdc-menu-surface--open,
.mdc-select__menu,
.mdc-menu-surface--fixed {
  z-index: 99999 !important;
}
.pregled-toolbar--sticky{
  z-index: 40; /* вместо 50 (или 10) */
}
.search-no-diets-found {
    margin: 24px;
}
/* Sticky toolbar (mobile-first) */
#PREGLED_TOGGLE_BAR.pregled-toolbar--sticky{
  position: sticky;
  top: 0;
  z-index: 60; /* под menu-то, което вече вдигнахме */
  background: rgba(255,255,255,.92);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,.08);
  transition: transform .22s ease, box-shadow .22s ease;
}

/* скриване нагоре */
#PREGLED_TOGGLE_BAR.pregled-toolbar--hidden{
  transform: translateY(-110%);
  box-shadow: none;
}

/* леко „премиум“ shadow когато е видим */
#PREGLED_TOGGLE_BAR.pregled-toolbar--elev{
  box-shadow: 0 10px 24px rgba(0,0,0,.06);
}

/* само за мобилно */
@media (max-width: 768px){
  .pregled-page{ padding-top: 8px; }
}