div.orgfroid-calculator .orgfroid-toggle-group {
display: flex !important;
gap: 8px !important;
}
div.orgfroid-calculator .orgfroid-toggle-btn {
flex: 1 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
gap: 8px !important;
padding: 12px 16px !important;
border: 2px solid var(--orgfroid-border) !important;
border-radius: var(--orgfroid-radius-sm) !important;
background: var(--orgfroid-bg-white) !important;
color: var(--orgfroid-text-light) !important;
font-size: 14px !important;
font-weight: 500 !important;
font-family: var(--orgfroid-font) !important;
transition: all 0.2s ease !important;
}
div.orgfroid-calculator .orgfroid-toggle-btn:hover {
border-color: var(--orgfroid-primary) !important;
color: var(--orgfroid-text) !important;
}
div.orgfroid-calculator .orgfroid-toggle-btn.active {
border-color: var(--orgfroid-primary) !important;
background: var(--orgfroid-primary-light) !important;
color: var(--orgfroid-text) !important;
} div.orgfroid-calculator .orgfroid-info-box {
display: flex !important;
align-items: center !important;
gap: 10px !important;
padding: 12px 16px !important;
background: var(--orgfroid-primary-light) !important;
border: 1px solid rgba(36, 224, 186, 0.3) !important;
border-radius: var(--orgfroid-radius-sm) !important;
font-size: 14px !important;
color: var(--orgfroid-text) !important;
margin-top: 4px !important;
} div.orgfroid-calculator .orgfroid-input-suffix-select {
max-width: 120px !important;
min-width: 100px !important;
border-left: 1px solid var(--orgfroid-border) !important;
border-radius: 0 var(--orgfroid-radius-sm) var(--orgfroid-radius-sm) 0 !important;
background: var(--orgfroid-bg-card) !important;
padding: 0 12px !important;
font-size: 14px !important;
} div.orgfroid-calculator .orgfroid-field-row {
display: flex !important;
gap: 16px !important;
}
div.orgfroid-calculator .orgfroid-field-half {
flex: 1 !important;
} div.orgfroid-calculator .orgfroid-alert {
display: flex !important;
gap: 14px !important;
padding: 16px 20px !important;
border-radius: var(--orgfroid-radius-md) !important;
margin-bottom: 20px !important;
}
div.orgfroid-calculator .orgfroid-alert--warning {
background: #fff8e1 !important;
border: 1px solid #ffe082 !important;
}
div.orgfroid-calculator .orgfroid-alert--warning .orgfroid-alert-icon {
color: #f39c12 !important;
flex-shrink: 0 !important;
margin-top: 2px !important;
}
div.orgfroid-calculator .orgfroid-alert-title {
display: block !important;
font-size: 14px !important;
font-weight: 600 !important;
color: var(--orgfroid-text) !important;
margin-bottom: 4px !important;
}
div.orgfroid-calculator .orgfroid-alert-text {
font-size: 13px !important;
color: var(--orgfroid-text-light) !important;
margin: 0 !important;
line-height: 1.5 !important;
} div.orgfroid-calculator .orgfroid-checklist {
display: flex !important;
flex-direction: column !important;
gap: 8px !important;
}
div.orgfroid-calculator .orgfroid-checklist-item {
display: flex !important;
align-items: center !important;
gap: 12px !important;
padding: 12px 16px !important;
background: var(--orgfroid-bg-card) !important;
border: 1px solid var(--orgfroid-border) !important;
border-radius: var(--orgfroid-radius-sm) !important;
cursor: pointer !important;
transition: all 0.2s ease !important;
}
div.orgfroid-calculator .orgfroid-checklist-item:hover {
border-color: var(--orgfroid-primary) !important;
}
div.orgfroid-calculator .orgfroid-checklist-checkbox {
display: none !important;
}
div.orgfroid-calculator .orgfroid-checklist-check {
width: 22px !important;
height: 22px !important;
min-width: 22px !important;
border: 2px solid var(--orgfroid-border) !important;
border-radius: 4px !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
transition: all 0.2s ease !important;
background: var(--orgfroid-bg-white) !important;
}
div.orgfroid-calculator .orgfroid-checklist-checkbox:checked ~ .orgfroid-checklist-check {
background: var(--orgfroid-primary) !important;
border-color: var(--orgfroid-primary) !important;
}
div.orgfroid-calculator .orgfroid-checklist-checkbox:checked ~ .orgfroid-checklist-check::after {
content: '' !important;
display: block !important;
width: 6px !important;
height: 10px !important;
border: solid #fff !important;
border-width: 0 2px 2px 0 !important;
transform: rotate(45deg) !important;
margin-top: -2px !important;
}
div.orgfroid-calculator .orgfroid-checklist-checkbox:checked ~ .orgfroid-checklist-text {
text-decoration: line-through !important;
color: var(--orgfroid-text-muted) !important;
}
div.orgfroid-calculator .orgfroid-checklist-text {
font-size: 14px !important;
color: var(--orgfroid-text) !important;
line-height: 1.4 !important;
} div.orgfroid-calculator .orgfroid-tips-grid {
display: grid !important;
grid-template-columns: 1fr 1fr !important;
gap: 12px !important;
}
div.orgfroid-calculator .orgfroid-tip-card {
display: flex !important;
gap: 12px !important;
padding: 14px 16px !important;
background: var(--orgfroid-bg-card) !important;
border: 1px solid var(--orgfroid-border) !important;
border-radius: var(--orgfroid-radius-sm) !important;
}
div.orgfroid-calculator .orgfroid-tip-icon {
flex-shrink: 0 !important;
width: 24px !important;
height: 24px !important;
margin-top: 1px !important;
}
div.orgfroid-calculator .orgfroid-tip-text {
font-size: 13px !important;
color: var(--orgfroid-text-light) !important;
line-height: 1.5 !important;
} div.orgfroid-calculator .orgfroid-formula-box {
background: var(--orgfroid-bg-card) !important;
border: 1px solid var(--orgfroid-border) !important;
border-radius: var(--orgfroid-radius-md) !important;
padding: 24px !important;
margin: 16px 0 !important;
text-align: center !important;
}
div.orgfroid-calculator .orgfroid-formula {
display: block !important;
font-size: 20px !important;
font-weight: 600 !important;
color: var(--orgfroid-text) !important;
margin-bottom: 16px !important;
font-family: 'Courier New', monospace !important;
}
div.orgfroid-calculator .orgfroid-formula-legend {
text-align: left !important;
max-width: 400px !important;
margin: 0 auto !important;
}
div.orgfroid-calculator .orgfroid-formula-legend li {
font-size: 14px !important;
color: var(--orgfroid-text-light) !important;
padding: 4px 0 !important;
list-style: none !important;
} div.orgfroid-calculator .orgfroid-seo-table-wrapper {
overflow-x: auto !important;
margin: 16px 0 !important;
}
div.orgfroid-calculator .orgfroid-seo-table {
width: 100% !important;
border-collapse: collapse !important;
font-size: 14px !important;
}
div.orgfroid-calculator .orgfroid-seo-table th,
div.orgfroid-calculator .orgfroid-seo-table td {
padding: 10px 14px !important;
border: 1px solid var(--orgfroid-border) !important;
text-align: center !important;
}
div.orgfroid-calculator .orgfroid-seo-table th {
background: var(--orgfroid-bg-card) !important;
font-weight: 600 !important;
color: var(--orgfroid-text) !important;
}
div.orgfroid-calculator .orgfroid-seo-table td {
color: var(--orgfroid-text-light) !important;
} div.orgfroid-calculator .orgfroid-seo-list li {
padding: 6px 0 6px 20px !important;
position: relative !important;
font-size: 14px !important;
color: var(--orgfroid-text-light) !important;
list-style: none !important;
}
div.orgfroid-calculator .orgfroid-seo-list li::before {
content: '' !important;
position: absolute !important;
left: 0 !important;
top: 14px !important;
width: 6px !important;
height: 6px !important;
border-radius: 50% !important;
background: var(--orgfroid-primary) !important;
}
div.orgfroid-calculator ol.orgfroid-seo-list {
counter-reset: seo-list !important;
}
div.orgfroid-calculator ol.orgfroid-seo-list li {
padding-left: 28px !important;
counter-increment: seo-list !important;
}
div.orgfroid-calculator ol.orgfroid-seo-list li::before {
content: counter(seo-list) !important;
width: 20px !important;
height: 20px !important;
border-radius: 50% !important;
background: var(--orgfroid-primary) !important;
color: #fff !important;
font-size: 11px !important;
font-weight: 700 !important;
display: flex !important;
align-items: center !important;
justify-content: center !important;
top: 10px !important;
} @media (max-width: 640px) {
div.orgfroid-calculator .orgfroid-toggle-group {
flex-direction: column !important;
}
div.orgfroid-calculator .orgfroid-field-row {
flex-direction: column !important;
gap: 0 !important;
}
div.orgfroid-calculator .orgfroid-tips-grid {
grid-template-columns: 1fr !important;
}
div.orgfroid-calculator .orgfroid-input-suffix-select {
min-width: 80px !important;
}
}