#ee-qotd-banner.ee-qotd-banner{
position: fixed;
left: 0;
right: 0;
top: var(--ee-qotd-top-offset);
bottom: auto;
min-height: var(--ee-qotd-height);
background: var(--ee-qotd-bg);
color: var(--ee-qotd-text);
z-index: 999999;
box-shadow: 0 2px 12px rgba(0,0,0,.18);
display: flex;
align-items: center;
font-family: var(--ee-qotd-font);
}
body.admin-bar #ee-qotd-banner.ee-qotd-banner{
top: calc(var(--ee-qotd-top-offset) + 32px);
}
@media (max-width: 782px){
body.admin-bar #ee-qotd-banner.ee-qotd-banner{
top: calc(var(--ee-qotd-top-offset) + 46px);
}
}
#ee-qotd-banner.ee-qotd-banner.ee-qotd-bottom{
top: auto;
bottom: var(--ee-qotd-bottom-offset);
}
#ee-qotd-banner .ee-qotd-link{
color: inherit;
text-decoration: none;
width: 100%;
height: 100%;
display: flex;
align-items: center;
}
#ee-qotd-banner .ee-qotd-inner{
width: 100%;
display: flex;
gap: 14px;
align-items: center;
padding: 10px 16px;
box-sizing: border-box;
}
#ee-qotd-banner .ee-qotd-textblock{
flex: 1 1 auto;
min-width: 0;
display: flex;
flex-direction: column;
gap: 6px;
}
#ee-qotd-banner .ee-qotd-toprow{
display: flex;
gap: 10px;
align-items: baseline;
flex-wrap: wrap;
}
#ee-qotd-banner .ee-qotd-label{
font-weight: 900;
opacity: .95;
white-space: nowrap;
font-size: var(--ee-qotd-label-font-size);
letter-spacing: .02em;
text-transform: uppercase;
}
#ee-qotd-banner .ee-qotd-author{
opacity: .9;
white-space: nowrap;
font-size: var(--ee-qotd-label-font-size);
}
#ee-qotd-banner .ee-qotd-date{
opacity: .85;
white-space: nowrap;
font-size: var(--ee-qotd-label-font-size);
margin-left: auto;
}
#ee-qotd-banner .ee-qotd-quote{
font-size: var(--ee-qotd-banner-font-size);
line-height: 1.25;
width: 100%;
}
#ee-qotd-banner.ee-qotd-truncate .ee-qotd-quote{
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
} #ee-qotd-banner.ee-qotd-center .ee-qotd-toprow{ justify-content: center; }
#ee-qotd-banner.ee-qotd-center .ee-qotd-date{ margin-left: 0; }
#ee-qotd-banner.ee-qotd-center .ee-qotd-quote{ text-align: center; } .ee-qotd-avatar{
width: var(--ee-qotd-avatar-size);
height: var(--ee-qotd-avatar-size);
border-radius: var(--ee-qotd-avatar-radius);
overflow: hidden;
flex: 0 0 auto;
border: 1px solid rgba(255,255,255,.22);
background: rgba(255,255,255,.08);
display: inline-flex;
align-items: center;
justify-content: center;
}
.ee-qotd-avatar img{
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.ee-qotd-avatar.ee-qotd-avatar-empty{ opacity: .35; } .ee-qotd-card{
background: var(--ee-qotd-card-bg);
border: 1px solid rgba(0,0,0,.08);
border-radius: 14px;
padding: 18px 18px 14px;
max-width: 900px;
font-family: var(--ee-qotd-font);
}
.ee-qotd-card-header{
display: flex;
gap: 12px;
align-items: center;
margin-bottom: 10px;
}
.ee-qotd-card-title{
font-weight: 900;
font-size: 1.2em;
margin: 0 0 2px;
}
.ee-qotd-card-meta{ opacity: .75; font-size: .95em; }
.ee-qotd-card-quote{
margin: 0;
padding-left: 14px;
border-left: 4px solid rgba(0,0,0,.18);
font-size: var(--ee-qotd-card-font-size);
line-height: 1.4;
} .ee-qotd-archive{
font-family: var(--ee-qotd-font);
max-width: 980px;
}
.ee-qotd-archive-title{ margin: 0 0 10px; }
.ee-qotd-archive-nav{
display: flex;
justify-content: space-between;
gap: 12px;
align-items: center;
margin: 10px 0 18px;
padding: 10px 12px;
border: 1px solid rgba(0,0,0,.08);
border-radius: 12px;
}
.ee-qotd-archive-month{ font-weight: 900; }
.ee-qotd-archive-navlink{ text-decoration: none; font-weight: 700; }
.ee-qotd-archive-item{
border: 1px solid rgba(0,0,0,.08);
border-radius: 14px;
padding: 12px 14px;
margin: 0 0 10px;
}
.ee-qotd-archive-date{ font-weight: 900; opacity: .8; margin-bottom: 8px; }
.ee-qotd-archive-row{ display: flex; gap: 12px; align-items: flex-start; }
.ee-qotd-archive-quote{ font-size: var(--ee-qotd-card-font-size); line-height: 1.35; }
.ee-qotd-archive-author{ margin-top: 6px; opacity: .85; font-weight: 700; }
.ee-qotd-archive-empty{ opacity: .8; } .ee-qotd-card-title,
.ee-qotd-archive-title,
.ee-qotd-archive-month,
.ee-qotd-archive-date{
color: var(--ee-qotd-heading);
}
.ee-qotd-card a.ee-qotd-card-link,
.ee-qotd-archive a.ee-qotd-archive-link,
.ee-qotd-archive a.ee-qotd-archive-navlink{
color: var(--ee-qotd-link);
text-decoration: none;
font-weight: 700;
}
.ee-qotd-card a.ee-qotd-card-link:hover,
.ee-qotd-archive a.ee-qotd-archive-link:hover,
.ee-qotd-archive a.ee-qotd-archive-navlink:hover{
text-decoration: underline;
}