#javascriptDisabled-warning
{   
	text-align: center;
	background: linear-gradient(135deg, #ff6b6b, #ee5a24);
	color: white;
	padding: 20px;
	border-radius: 12px;
	font-weight: 500;
	box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}

.centerHorizontally {
    display: table;
    margin: 0 auto;
}

/* Enhanced flipswitch styles for Numbers toggle */
.custom-size-flipswitch.ui-flipswitch .ui-btn.ui-flipswitch-on {
    text-indent: -7.5em;
}
.custom-size-flipswitch.ui-flipswitch .ui-flipswitch-off {
    text-indent: 0.3em;
}

.custom-size-flipswitch.ui-flipswitch {
    width: 10.5em;
    border-radius: 25px;
    background: rgba(255, 255, 255, 0.2);
    border: none;
    box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.1);
    font-size: 0.85em;
}

.custom-size-flipswitch.ui-flipswitch.ui-flipswitch-active {
    padding-left: 8.5em;
    width: 2em;
}

@media (min-width: 28em) {
    .ui-field-contain > label + .custom-size-flipswitch.ui-flipswitch {
        width: 2em;
    }
}

/* Responsive adjustments for smaller screens */
@media (max-width: 480px) {
    .custom-size-flipswitch.ui-flipswitch {
        width: 9em;
        font-size: 0.75em;
    }
    .custom-size-flipswitch.ui-flipswitch .ui-btn.ui-flipswitch-on {
        text-indent: -6.5em;
    }
    .custom-size-flipswitch.ui-flipswitch.ui-flipswitch-active {
        padding-left: 7em;
        width: 1.8em;
    }
}

@media (max-width: 320px) {
    .custom-size-flipswitch.ui-flipswitch {
        width: 8em;
        font-size: 0.7em;
    }
    .custom-size-flipswitch.ui-flipswitch .ui-btn.ui-flipswitch-on {
        text-indent: -5.8em;
    }
    .custom-size-flipswitch.ui-flipswitch.ui-flipswitch-active {
        padding-left: 6.2em;
        width: 1.6em;
    }
}

/* Modern content styling */
.ui-content {
    padding: 20px;
}

/* Enhanced list view styling */
.ui-listview > li {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.ui-listview > li:hover {
    transform: translateY(-2px);
}

/* Modern form styling */
.ui-input-text {
    border-radius: 12px;
    border: 2px solid #e1e8ed;
    transition: all 0.3s ease;
}

.ui-input-text:focus {
    border-color: #667eea;
    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

/* Enhanced button group styling */
.ui-controlgroup-horizontal .ui-btn {
    border-radius: 12px;
    margin: 2px;
    transition: all 0.3s ease;
}

.ui-controlgroup-horizontal .ui-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15);
}