:root {
	--color-today: #7E81B1;
	--color-selected: #333676;
	--color-off: #DD5CA5;
	--color-morning: #FFCA6B;
	--color-eat: #9DD93C;
	--color-afternoon: #8F5DC7;
	--color-endofday: #4EBABA;
}

.logo { height: 100px; max-width: 80%; object-fit: contain; }

@media all and (max-width: 578px) {
	.nav-container { flex-wrap: nowrap !important; padding: 0 10px !important; }
}

.profile-card { min-height: 150px; height: 100%;	}
.profile-card .card-body { display: flex; flex-direction: column; }
.profile-card .btn-primary { margin-top: auto; }

.profile-card .quick-stats .progress { position: relative; --bs-progress-height: 2rem; }
.profile-card .quick-stats .time { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px;  }
.profile-card .quick-stats .time > .time-done { font-weight: bold; }
.profile-card .quick-stats .time > .time-target { font-size: 0.65rem; }
.profile-card .quick-stats .time-delta { position: absolute; top: 50%; right: 3px; transform: translateY(-50%); display: inline-block; background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px; margin-left: 5px; font-weight: bold; }
.profile-card .quick-stats .time-delta:empty { display: none; }
.profile-card .quick-stats[month-score="good"] .time-delta { color: var(--bs-success); }
.profile-card .quick-stats[month-score="bad"] .time-delta { color: var(--bs-warning); }

.btn.ico-left > i { margin-right: 5px; }
.btn.ico-right > i { margin-left: 5px; }


.app-profile-time .month-stats .progress { position: relative; --bs-progress-height: 2rem; }
.app-profile-time .month-stats .time { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px;  }
.app-profile-time .month-stats .time > .time-done { font-weight: bold; }
.app-profile-time .month-stats .time > .time-target { font-size: 0.65rem; }
.app-profile-time .month-stats .time-delta { position: absolute; top: 50%; right: 3px; transform: translateY(-50%); display: inline-block; background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px; margin-left: 5px; font-weight: bold; }
.app-profile-time .month-stats .time-delta:empty { display: none; }
.app-profile-time[month-score="good"] .month-stats .time-delta { color: var(--bs-success); }
.app-profile-time[month-score="bad"] .month-stats .time-delta { color: var(--bs-warning); }

.app-profile-time .weeks > .profile-week { margin: 5px 0; }
.app-profile-time .weeks > .profile-week .week-stats .progress { position: relative; --bs-progress-height: 2rem; }
.app-profile-time .weeks > .profile-week .week-stats .time { position: absolute; top: 50%; left: 50%; transform: translateX(-50%) translateY(-50%); background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px;  }
.app-profile-time .weeks > .profile-week .week-stats .time > .time-done { font-weight: bold; }
.app-profile-time .weeks > .profile-week .week-stats .time > .time-target { font-size: 0.65rem; }
.app-profile-time .weeks > .profile-week .week-stats .time-delta { position: absolute; top: 50%; right: 3px; transform: translateY(-50%); display: inline-block; background: rgba(255, 255, 255, 0.8); text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15); padding: 3px; border-radius: 5px; margin-left: 5px; font-weight: bold; }
.app-profile-time .weeks > .profile-week .week-stats .time-delta:empty { display: none; }
.app-profile-time .weeks > .profile-week[week-score="good"] .week-stats .time-delta { color: var(--bs-success); }
.app-profile-time .weeks > .profile-week[week-score="bad"] .week-stats .time-delta { color: var(--bs-warning); }

.app-profile-time .days-summary { display: flex; flex-direction: row;  }
.app-profile-time .days-summary > .profile-day { flex: 1 1; margin: 5px; }
.app-profile-time .days-summary > .profile-day .day-state > i { font-size: 1.25rem; }
.app-profile-time .days-summary > .profile-day[day-type="holiday"] .day-state > i::before { content: '\f236'; color: #DD5CA5; }
.app-profile-time .days-summary > .profile-day[day-type="work"] .day-state > i::before { content: '\3f'; }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="morningstarted"] .day-state > i::before { content: '\f185'; color: var(--color-morning); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="morningended"] .day-state > i::before { content: '\e4c6'; color: var(--color-eat); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonstarted"] .day-state > i::before { content: '\f0b1'; color: var(--color-afternoon); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonended"] .day-state > i::before { content: '\f59a'; color: var(--color-endofday); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonended"][day-score="good"] .day-state > i::before { content: '\f59a'; color: var(--bs-success); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonended"][day-score="bad"] .day-state > i::before { content: '\f5b4'; color: var(--bs-warning); }

.app-profile-time .days-summary > .profile-day[today="1"]:not(.selected) { --bs-card-border-color: var(--color-today); }
.app-profile-time .days-summary > .profile-day[today="1"]:not(.selected) > .card-header { --bs-card-cap-bg: var(--color-today); }
.app-profile-time .days-summary > .profile-day[today="1"]:not(.selected) .day-name { font-weight: bold !important; color: #fff !important; }
.app-profile-time .days-summary > .profile-day[today="1"]:not(.selected) .day-no { font-weight: bold !important; color: #fff !important; }

.app-profile-time .days-summary > .profile-day.selected { --bs-card-border-color: var(--color-selected); }
.app-profile-time .days-summary > .profile-day.selected > .card-header {  --bs-card-cap-bg: var(--color-selected); }
.app-profile-time .days-summary > .profile-day.selected .day-name { font-weight: bold !important; color: #fff !important; }
.app-profile-time .days-summary > .profile-day.selected .day-no { font-weight: bold !important; color: #fff !important; }

.app-profile-time .days-summary > .profile-day .card-footer { ----bs-card-cap-padding-y: 3px; --bs-card-cap-padding-x: 3px; }
.app-profile-time .days-summary > .profile-day:not(.show-stats) .card-footer { display: none; }
.app-profile-time .days-summary > .profile-day:not([day-type="work"]) .card-footer { display: none; }
.app-profile-time .days-summary > .profile-day .card-footer > .time-stats { display: flex; flex-direction: column; align-items: center; }
@media (min-width: 768px) {
	.app-profile-time .days-summary > .profile-day .card-footer > .time-stats {
		flex-direction: row;
		justify-content: space-around;
		align-items: stretch;
	}
}
.app-profile-time .days-summary > .profile-day .card-footer > .time-stats > span.total { font-size: 0.8rem; }
.app-profile-time .days-summary > .profile-day .card-footer > .time-stats > span.delta { font-size: 0.7rem; font-weight: bold; }

.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonended"][day-score="good"] .card-footer > .time-stats > span.delta { color: var(--bs-success); }
.app-profile-time .days-summary > .profile-day[day-type="work"][day-state="afternoonended"][day-score="bad"] .card-footer > .time-stats > span.delta { color: var(--bs-warning); }

.app-profile-time .day-edit > .profile-day { margin: 0.3rem;  --bs-card-border-color: var(--color-selected); --bs-card-cap-bg: var(--color-selected); }
.app-profile-time .day-edit > .profile-day .day-full { font-weight: bold !important; color: #fff !important; }

.app-profile-time .time-init { display: flex; flex-direction: row; padding: 0.15rem; }
@media (max-width: 767px) {
	.app-profile-time .time-init { flex-direction: column; }
}
.app-profile-time .time-init > .btn { flex: 1 1; margin: 0.15rem; }

.app-profile-time .input-time { flex: 1 1; }
@media (max-width: 767px) {
	.app-profile-time .input-time { flex: 1 1 100%; }
}
.app-profile-time .input-time > .time-edit { display: flex; flex-direction: row; align-items: center; padding: 0.3rem; }
.app-profile-time .input-time > .time-edit > i { flex: 0 0; font-size: 20px; margin-right: 8px; }
.app-profile-time .input-time > .time-edit > input { flex: 1 1; }

.app-profile-time .input-time[period="morningstart"] > .time-edit > i { color: var(--color-morning); }
.app-profile-time .input-time[period="morningend"] > .time-edit > i { color: var(--color-eat); }
.app-profile-time .input-time[period="afternoonstart"] > .time-edit > i { color: var(--color-afternoon); }
.app-profile-time .input-time[period="afternoonend"] > .time-edit > i { color: var(--color-endofday); }

.btn.btn-primary.morningStart { --bs-btn-bg: var(--color-morning); --bs-btn-border-color: var(--color-morning); }
.btn.btn-primary.dayOff { --bs-btn-bg: var(--color-off); --bs-btn-border-color: var(--color-off); }
.btn.btn-primary.morningEnd { --bs-btn-bg: var(--color-eat); --bs-btn-border-color: var(--color-eat); }
.btn.btn-primary.afternoonStart { --bs-btn-bg: var(--color-afternoon); --bs-btn-border-color: var(--color-afternoon); }
.btn.btn-primary.afternoonEnd { --bs-btn-bg: var(--color-endofday); --bs-btn-border-color: var(--color-endofday); }

.app-profile-time .day-edit > .profile-day:not([today="1"]) .time-init { display: none; }
.app-profile-time .day-edit > .profile-day[today="1"] .time-type-change { display: none; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningstarted"] .time-type-change { display: block; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningended"] .time-type-change { display: block; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonstarted"] .time-type-change { display: block; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonended"] .time-type-change { display: block; }

.app-profile-time .day-edit > .profile-day[day-type="holiday"][today="1"] .time-type-change { display: block; }

.app-profile-time .day-edit > .profile-day[day-type="holiday"] .input-time { display: none; }
.app-profile-time .day-edit > .profile-day[day-type="holiday"] .time-init { display: none; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"] .time-init { display: none; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"] .time-init > .btn { flex: 1 1; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"] .input-time { display: none; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="none"] .time-init[period="morningstart"] { display: flex; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningstarted"] .time-init[period="morningend"] { display: flex; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningstarted"] .input-time[period="morningstart"] { display: block; }


.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningended"] .time-init[period="afternoonstart"] { display: flex; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningended"] .input-time[period="morningstart"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="morningended"] .input-time[period="morningend"] { display: block; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonstarted"] .time-init[period="afternoonend"] { display: flex; }
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonstarted"] .input-time[period="morningstart"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonstarted"] .input-time[period="morningend"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonstarted"] .input-time[period="afternoonstart"] { display: block; }

.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonended"] .input-time[period="morningstart"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonended"] .input-time[period="morningend"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonended"] .input-time[period="afternoonstart"],
.app-profile-time .day-edit > .profile-day[day-type="work"][today="1"][day-state="afternoonended"] .input-time[period="afternoonend"] { display: block; }