:root{
    --moon-gold:#a89652;
}



#moon-day-widget{
    font-family:inherit;
    color:inherit;
    --mdw-accent:var(--moon-gold);
}

#moon-day-widget .card{
    border: 1px solid rgba(0,0,0,.08); 
    background: #fff; 
    border-radius: 18px; 
    padding: 18px;
    box-shadow:
        0 10px 30px rgba(0,0,0,.06),
        0 2px 10px rgba(168,150,82,.08);
}

#moon-day-widget .head{
    display:flex; 
    align-items:center; 
    justify-content:space-between; 
    gap:12px; 
    margin-bottom:12px;
}

#moon-day-widget .title{ 
    font-weight:800; 
    font-size: clamp(1.05rem,1.6vw,1.25rem); 
}

#moon-day-widget .toggle{
    display:inline-grid; 
    place-items:center; 
    width:38px; 
    height:38px; 
    border-radius:12px;
    background: var(--mdw-accent); 
    color:#fff; cursor:pointer; 
    user-select:none; font-weight:900;
}

#moon-day-widget .hero{
    position: relative;
    background: linear-gradient(90deg,rgba(168,150,82,0.15),rgba(168,150,82,0.03));
    border-radius: 12px;
    padding: 30px 90px 30px 140px;
    border-left: 4px solid var(--moon-gold);
}

#moon-day-widget{
    min-height:500px;
}
.moon-header{
    width: 90%;
    max-width: 1100px;
    margin: 0 auto;
    text-align: center;
}

.moon-title{
    margin-bottom:0;
}

.moon-intro{
    font-size: 1.25rem;
    line-height: 1.7;
    max-width: 750px;
    margin: 20px auto 40px;
    text-align: center;
    color: #5f5f5f;
}

#moon-day-widget .hero .dayimg{
    position:absolute;
    top:15px;
    left:15px;
    width:130px;
    height:130px;
    background:transparent;
}

#moon-day-widget .hero .dayimg img{
    height:130px;
	min-height:110px;
    object-fit:contain;
}

#moon-day-widget .hero .phaseicon{
    position:absolute;
    top:20px;
    right:20px;
    width:60px;
    height:60px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
}

#moon-day-widget .phaseicon{
    box-shadow:0 0 20px rgba(168,150,82,.25);
}

#moon-day-widget .day-number{
    display:inline-block;
    background:var(--moon-gold);
    color:white;
    padding:4px 12px;
    border-radius:20px;
    font-weight:600;
}

.moon-divider{
    color:var(--moon-gold);
    font-size:24px;
    letter-spacing:8px;
    margin:20px auto 10px;
    text-align:center;
    width:100%;
}

/*Papildinformācija*/

 #moon-day-widget .chips{ 
    display:flex; 
    flex-wrap:wrap; 
    gap:10px; 
    margin-top:14px; 
}
        
#moon-day-widget .chip{
    border:1px dashed rgba(0,0,0,.12); 
    border-radius:12px; 
    padding:8px 12px; 
    background:#fff;
    font-size:.95rem;
}

#moon-day-widget .mutedlink{
    opacity:.9; 
    text-decoration:underline; 
    text-decoration-style:dotted; 
}
        
#moon-day-widget .row{ 
    margin-top:10px; 
    display:flex; 
    align-items:center; 
    gap:10px; }

#moon-day-widget .row label{ 
    display:flex; 
    align-items:center; 
    gap:8px; 
}


/* Telefoniem */


@media (max-width:700px){


#moon-day-widget .dayimg{
    width:100%;
    text-align:center;
}


#moon-day-widget .dayimg img{
    max-width:150px;
    width:100%;
    height:auto;
}

#moon-day-widget .desc{
    order:3;
    width:100%;
    text-align:left;
}
    
#moon-day-widget .hero{
    display:flex;
    flex-direction:column;
    align-items:center;
    padding:20px;
}
#moon-day-widget .phaseicon{
    display:none !important;
}

#moon-day-widget .hero .dayimg{
    width:80px;
    height:auto;
    position:static;
    margin-bottom:15px;
}
}

@media (max-width:768px){

header .container{
    padding:15px 15px;
}
	
#moon-day-widget .chip{
    padding: 5px 10px;
    font-size: .80rem;
}
	
.moon-hero{
	margin-top: 20px;
}
	
.page-title{
    font-size:42px;
    line-height:1.1;
}
	
#moon-day-widget{
	font-size: 1rem;
}
	
.moon-intro{
    font-size:1rem;
}
#moon-day-widget .card {
	padding: 5px; 
}
#mdw-day-desc{
	font-size:0.9rem; 
}
	
#mdw-phase-desc{
	font-size:0.9rem; 
}
#moon-day-widget label{
    font-size:0.8rem;
}

       
@media (max-width:900px){
    #moon-day-widget .hero{
        padding:25px;
    }
}