.cgb-block-container {
margin: 20px 0;
} .cgb-responsive {
width: 100%;
max-width: 100%;
} .cgb-shadow {
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
} .cgb-rounded {
border-radius: 8px;
} .cgb-animate {
transition: all 0.3s ease;
}
.cgb-animate:hover {
transform: translateY(-2px);
box-shadow: 0 4px 8px rgba(0,0,0,0.15);
} .cgb-gradient {
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
color: white;
} .cgb-icon {
display: inline-block;
margin-right: 8px;
vertical-align: middle;
} .cgb-badge {
display: inline-block;
padding: 4px 8px;
border-radius: 12px;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.5px;
} .cgb-button {
display: inline-block;
padding: 10px 20px;
border-radius: 4px;
text-decoration: none;
font-weight: 600;
transition: all 0.3s ease;
border: none;
cursor: pointer;
}
.cgb-button:hover {
transform: translateY(-1px);
box-shadow: 0 2px 4px rgba(0,0,0,0.2);
} .cgb-card {
background: #fff;
border-radius: 8px;
box-shadow: 0 2px 4px rgba(0,0,0,0.1);
padding: 20px;
margin: 10px 0;
} .cgb-alert {
padding: 15px 20px;
border-radius: 8px;
border-left: 4px solid;
margin: 20px 0;
position: relative;
} .cgb-modal {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0,0,0,0.5);
display: flex;
align-items: center;
justify-content: center;
z-index: 1000;
}
.cgb-modal-content {
background: #fff;
border-radius: 8px;
padding: 20px;
max-width: 500px;
width: 90%;
max-height: 80vh;
overflow-y: auto;
} .avviso-block {
padding: 20px 30px 30px 30px;
margin: 20px 0;
border-radius: 2px;
position: relative;
font-size: 14px;
line-height: 1.6;
background-color: #F9F9F9;
}
.avviso-block .avviso-title {
font-weight: 400;
font-size: 24px;
line-height: 36px;
color: #000000;
margin-bottom: 20px;
}
.avviso-block .avviso-content {
margin: 0;
}
.avviso-block .avviso-content {
font-weight: 400;
font-size: 16px;
line-height: 24px;
margin: 0;
} @media (max-width: 768px) {
.avviso-block {
padding: 12px 15px;
margin: 15px 0;
font-size: 13px;
}
.avviso-block .avviso-title {
font-size: 16px;
}
} .checkbox-list-block {
margin: 20px 0;
}
.checkbox-list {
list-style: none;
padding: 0;
margin: 40px 0;
}
.checkbox-item {
display: flex;
align-items: flex-start;
margin-bottom: 12px;
line-height: 1.5;
}
.checkbox-icon {
display: inline-flex;
align-items: center;
justify-content: center;
width: 20px;
height: 20px;
margin-right: 12px;
position: relative;
top: 2.5px;
flex-shrink: 0;
background-image: url(//www.teatrolemaschere.it/wp-content/plugins/gutenberg-custom-blocks/assets/images/checked.png);
background-size: contain;
background-repeat: no-repeat;
background-position: center;
}
.checkbox-content {
flex: 1;
display: flex;
flex-wrap: wrap;
align-items: baseline;
}
.checkbox-label {
font-weight: normal;
color: #646464;
}
.checkbox-value {
font-weight: 500;
color: #333;
margin-left: 4px;
}
.separator {
color: #333;
margin: 0 4px;
} .checkbox-list-block-editor {
margin: 10px 0;
}
.checkbox-list-block-editor .checkbox-list {
border: 1px solid #ddd;
border-radius: 4px;
padding: 15px;
background-color: #f9f9f9;
}
.checkbox-list-block-editor .checkbox-item {
margin-bottom: 15px;
padding: 8px;
background-color: white;
border-radius: 3px;
border: 1px solid #e0e0e0;
}
.checkbox-list-block-editor .checkbox-item:last-child {
margin-bottom: 0;
}
.checkbox-list-block-editor .checkbox-label,
.checkbox-list-block-editor .checkbox-value {
min-width: 100px;
}
.checkbox-list-block-editor .checkbox-label:empty::before {
content: 'Label...';
color: #999;
font-style: italic;
}
.checkbox-list-block-editor .checkbox-value:empty::before {
content: 'Valore...';
color: #999;
font-style: italic;
} .add-item-container {
margin-top: 15px;
text-align: center;
padding: 10px;
border-top: 1px solid #e0e0e0;
}
.add-item-btn {
margin: 0 auto;
}
.remove-item-btn {
margin-left: 10px;
padding: 2px 6px;
font-size: 12px;
line-height: 1;
min-width: auto;
}
.checkbox-list-block-editor .checkbox-content {
display: flex;
align-items: center;
flex-wrap: wrap;
} .item-controls {
margin-bottom: 15px;
padding: 10px;
background-color: #f0f0f0;
border-radius: 3px;
}
.item-controls h4 {
margin: 0 0 10px 0;
font-size: 14px;
color: #333;
} @media (max-width: 768px) {
.checkbox-item {
margin-bottom: 10px;
}
.checkbox-icon {
width: 14px;
height: 14px;
font-size: 8px;
margin-right: 10px;
}
.checkbox-content {
font-size: 14px;
}
.checkbox-list-block-editor .checkbox-list {
padding: 10px;
}
.checkbox-list-block-editor .checkbox-item {
padding: 6px;
}
}