framework7-without-localstorage
Version:
Full featured mobile HTML framework for building iOS & Android apps
1,133 lines • 398 kB
CSS
/**
* Framework7 1.6.5
* Full featured mobile HTML framework for building iOS & Android apps
*
* Google Material Theme
*
* http://framework7.io/
*
* Copyright 2020, Vladimir Kharlampidi
* The iDangero.us
* http://www.idangero.us/
*
* Licensed under MIT
*
* Released on: August 3, 2020
*/
/*==========================
Framework7 Layouts Themes
==========================*/
/* === Dark layout === */
.layout-dark .page,
.layout-dark .login-screen-content,
.page.layout-dark,
.layout-dark .panel,
.panel.layout-dark {
background-color: #222;
color: rgba(255, 255, 255, 0.87);
}
.layout-dark .content-block-title {
color: rgba(255, 255, 255, 0.87);
}
.layout-dark .content-block-inner:before {
background-color: #393939;
}
.layout-dark .content-block-inner:after {
background-color: #393939;
}
.layout-dark .popover .list-block ul {
background: none;
}
.layout-dark .card {
background: #1c1c1c;
}
.layout-dark .card-header:after {
background-color: #393939;
}
.layout-dark .card-footer {
color: #bbb;
}
.layout-dark .card-footer:before {
background-color: #393939;
}
.layout-dark .list-block ul:before,
.list-block.layout-dark ul:before {
background-color: #393939;
}
.layout-dark .list-block ul:after,
.list-block.layout-dark ul:after {
background-color: #393939;
}
.layout-dark .list-block.inset ul,
.list-block.layout-dark.inset ul {
background: #1c1c1c;
}
.layout-dark .list-block.notifications > ul,
.list-block.layout-dark.notifications > ul {
background: none;
}
.layout-dark li.sorting {
background-color: rgba(34, 34, 34, 0.8);
}
.layout-dark .swipeout-actions-left a,
.layout-dark .swipeout-actions-right a {
background-color: #444;
}
.layout-dark .item-inner:after,
.layout-dark .list-block ul ul li:last-child .item-inner:after {
background-color: #393939;
}
.layout-dark .item-after,
.layout-dark .item-text {
color: rgba(255, 255, 255, 0.7);
}
.layout-dark .list-block-label {
color: #bbb;
}
.layout-dark .item-divider,
.layout-dark .list-group-title {
background: #1a1a1a;
color: #bbb;
}
.layout-dark .item-divider:before,
.layout-dark .list-group-title:before {
background-color: #393939;
}
.layout-dark .contacts-block .list-group-title {
background: none;
}
.layout-dark .autocomplete-dropdown {
background: #1c1c1c;
}
.layout-dark .autocomplete-dropdown .list-block {
color: rgba(255, 255, 255, 0.54);
}
.layout-dark .autocomplete-dropdown .list-block b {
color: rgba(255, 255, 255, 0.87);
}
html:not(.watch-active-state) .layout-dark .item-link:active,
html:not(.watch-active-state) .layout-dark label.label-checkbox:active,
html:not(.watch-active-state) .layout-dark label.label-radio:active,
.layout-dark .item-link.active-state,
.layout-dark label.label-checkbox.active-state,
.layout-dark label.label-radio.active-state {
background-color: rgba(255, 255, 255, 0.05);
}
.layout-dark .list-block input[type="text"],
.layout-dark .list-block input[type="password"],
.layout-dark .list-block input[type="search"],
.layout-dark .list-block input[type="email"],
.layout-dark .list-block input[type="tel"],
.layout-dark .list-block input[type="url"],
.layout-dark .list-block input[type="date"],
.layout-dark .list-block input[type="datetime-local"],
.layout-dark .list-block input[type="time"],
.layout-dark .list-block input[type="number"],
.layout-dark .list-block select,
.layout-dark .list-block textarea {
color: #fff;
}
.layout-dark .list-block input[type="text"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="password"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="search"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="email"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="tel"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="url"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="date"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="datetime-local"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="time"]::-webkit-input-placeholder,
.layout-dark .list-block input[type="number"]::-webkit-input-placeholder,
.layout-dark .list-block select::-webkit-input-placeholder,
.layout-dark .list-block textarea::-webkit-input-placeholder {
color: rgba(255, 255, 255, 0.35);
}
.layout-dark .label-switch .checkbox {
background: rgba(255, 255, 255, 0.3);
}
.layout-dark .item-inner:not(.focus-state) .label,
.layout-dark .item-inner:not(.focus-state) .floating-label {
color: rgba(255, 255, 255, 0.7);
}
.layout-dark .item-inner:not(.focus-state):not(.not-empty-state) .item-input-field:after,
.layout-dark .item-inner:not(.focus-state):not(.not-empty-state) .input-field:after {
background-color: rgba(255, 255, 255, 0.12);
}
.layout-dark label.label-checkbox i.icon-form-checkbox {
border-color: rgba(255, 255, 255, 0.7);
}
.layout-dark label.label-radio i.icon-form-radio {
border-color: rgba(255, 255, 255, 0.7);
}
.layout-dark .item-link.list-button:after,
.layout-dark .list-button:after {
background-color: #393939;
}
.layout-dark .page-content .ripple-wave {
background: rgba(255, 255, 255, 0.3);
}
html:not(.watch-active-state) .layout-dark .button:not(.button-fill):active,
.layout-dark .button:not(.button-fill).active-state {
background: rgba(255, 255, 255, 0.1);
}
.layout-dark .chip {
background: rgba(255, 255, 255, 0.87);
}
.layout-dark .timeline-item-inner {
background: #1c1c1c;
}
.layout-dark .timeline-item-divider {
background: rgba(255, 255, 255, 0.3);
}
.layout-dark .content-block-inner .timeline-item-inner {
border-color: #393939;
}
.layout-dark .timeline-item-time {
color: rgba(255, 255, 255, 0.7);
}
.layout-dark .data-table tbody tr.data-table-row-selected {
background: rgba(255, 255, 255, 0.05);
}
.layout-dark .data-table tbody td:before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: auto;
right: auto;
height: 1px;
width: 100%;
background-color: #393939;
display: block;
z-index: 15;
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
}
html.pixel-ratio-2 .layout-dark .data-table tbody td:before {
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
html.pixel-ratio-3 .layout-dark .data-table tbody td:before {
-webkit-transform: scaleY(0.33);
transform: scaleY(0.33);
}
html:not(.ios):not(.android) .layout-dark .data-table tbody tr:hover {
background: rgba(255, 255, 255, 0.05);
}
.layout-dark .data-table thead th:not(.sortable-active),
.layout-dark .data-table thead td:not(.sortable-active) {
color: rgba(255, 255, 255, 0.5);
}
.layout-dark .data-table th.actions-cell a.link,
.layout-dark .data-table td.actions-cell a.link {
color: rgba(255, 255, 255, 0.5);
}
.layout-dark .data-table .sortable-cell:not(.numeric-cell):after,
.layout-dark .data-table .sortable-cell.numeric-cell:before {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20fill%3D'%23ffffff'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%20width%3D'24'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%3E%3Cpath%20d%3D'M0%200h24v24H0V0z'%20fill%3D'none'%2F%3E%3Cpath%20d%3D'M20%2012l-1.41-1.41L13%2016.17V4h-2v12.17l-5.58-5.59L4%2012l8%208%208-8z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E");
}
.layout-dark .data-table .data-table-actions a.link {
color: rgba(255, 255, 255, 0.5);
}
@media (max-width: 480px) and (orientation: portrait) {
.layout-dark .data-table.data-table-collapsible tr:before {
content: '';
position: absolute;
left: 0;
top: 0;
bottom: auto;
right: auto;
height: 1px;
width: 100%;
background-color: #393939;
display: block;
z-index: 15;
-webkit-transform-origin: 50% 0%;
transform-origin: 50% 0%;
}
html.pixel-ratio-2 .layout-dark .data-table.data-table-collapsible tr:before {
-webkit-transform: scaleY(0.5);
transform: scaleY(0.5);
}
html.pixel-ratio-3 .layout-dark .data-table.data-table-collapsible tr:before {
-webkit-transform: scaleY(0.33);
transform: scaleY(0.33);
}
.layout-dark .data-table.data-table-collapsible tr:hover {
background-color: inherit;
}
.layout-dark .data-table.data-table-collapsible td:not(.checkbox-cell):before {
color: rgba(255, 255, 255, 0.5);
}
}
/*==========================
Framework7 Color Themes
==========================*/
.theme-red .button:not(.button-fill) {
color: #f44336;
}
.theme-red .navbar .button:not(.button-fill),
.theme-red.navbar .button:not(.button-fill),
.theme-red .toolbar .button:not(.button-fill),
.theme-red.toolbar .button:not(.button-fill),
.theme-red .subnavbar .button:not(.button-fill),
.theme-red.subnavbar .button:not(.button-fill) {
color: #fff;
}
.theme-red .button.button-fill {
background: #f44336;
color: #fff;
}
html:not(.watch-active-state) .theme-red .button.button-fill:active,
.theme-red .button.button-fill.active-state {
background: #D32F2F;
}
.progressbar.theme-red,
.theme-red .progressbar {
background-color: rgba(244, 67, 54, 0.5);
}
.progressbar.theme-red span,
.theme-red .progressbar span {
background-color: #f44336;
}
.progressbar-infinite.theme-red,
.theme-red .progressbar-infinite {
background-color: rgba(244, 67, 54, 0.5);
}
.progressbar-infinite.theme-red:after,
.theme-red .progressbar-infinite:after,
.progressbar-infinite.theme-red:before,
.theme-red .progressbar-infinite:before {
background-color: #f44336;
}
.color-red i.icon,
i.icon.color-red {
color: #f44336;
}
i.icon-next.color-red,
i.icon-next.theme-red {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-prev.color-red,
i.icon-prev.theme-red {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23f44336'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-back.color-red,
i.icon-back.theme-red {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
}
i.icon-forward.color-red,
i.icon-forward.theme-red {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
}
i.icon-bars.color-red,
i.icon-bars.theme-red {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
}
.theme-red a,
.theme-red .card a {
color: #f44336;
}
.theme-red .navbar,
.navbar.theme-red,
.theme-red .toolbar,
.toolbar.theme-red,
.theme-red .subnavbar,
.subnavbar.theme-red,
.theme-red .searchbar,
.searchbar.theme-red {
background-color: #f44336;
}
.theme-red .label-switch input[type="checkbox"]:checked + .checkbox,
.label-switch.theme-red input[type="checkbox"]:checked + .checkbox {
background-color: rgba(244, 67, 54, 0.5);
}
.theme-red .label-switch input[type="checkbox"]:checked + .checkbox:after,
.label-switch.theme-red input[type="checkbox"]:checked + .checkbox:after {
background-color: #f44336;
}
.theme-red label.label-checkbox i.icon-form-checkbox:after,
label.label-checkbox.theme-red i.icon-form-checkbox:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E");
}
.theme-red label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
.theme-red label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="radio"]:checked + .item-media i.icon-form-checkbox,
.theme-red label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
.theme-red label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
.theme-red label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
.theme-red label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox {
border-color: #f44336;
background-color: #f44336;
}
.theme-red label.label-radio i.icon-form-radio:after,
label.label-radio.theme-red i.icon-form-radio:after {
background-color: #f44336;
}
.theme-red label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-radio,
.theme-red label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-red input[type="radio"]:checked + .item-media i.icon-form-radio,
.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
.theme-red label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-radio,
.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
.theme-red label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-radio {
border-color: #f44336;
}
.theme-red label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-red input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
.theme-red label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-red input[type="radio"]:checked + .item-media i.icon-form-radio:after,
.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
.theme-red label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-red input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
.theme-red label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-red input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
.theme-red label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-red input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after {
background-color: #f44336;
}
.theme-red .form-checkbox input[type="checkbox"]:checked ~ i,
.form-checkbox.theme-red input[type="checkbox"]:checked ~ i {
border-color: #f44336;
background-color: #f44336;
}
.theme-red .form-radio input[type="radio"]:checked ~ i,
.form-radio.theme-red input[type="radio"]:checked ~ i {
border-color: #f44336;
}
.theme-red .form-radio input[type="radio"]:checked ~ i:after,
.form-radio.theme-red input[type="radio"]:checked ~ i:after {
background-color: #f44336;
}
.theme-red .form-checkbox .ripple-wave,
.theme-red .form-radio .ripple-wave {
background: rgba(244, 67, 54, 0.5);
}
.theme-red .focus-state .label,
.theme-red .focus-state .floating-label {
color: #f44336;
}
.theme-red .item-input-field.focus-state:after,
.theme-red .input-field.focus-state:after,
.theme-red .item-input-field.not-empty-state:after,
.theme-red .input-field.not-empty-state:after {
background: #f44336;
}
.theme-red .picker-calendar-day.picker-calendar-day-today span {
color: #f44336;
}
.theme-red .picker-calendar-day.picker-calendar-day-selected span {
background-color: #f44336;
color: #fff;
}
.theme-red .picker-calendar-day.picker-calendar-day-has-events span:after {
background-color: #f44336;
}
.theme-red .picker-header {
background-color: #f44336;
}
.theme-red .modal-button {
color: #f44336;
}
.theme-red .timeline-horizontal .timeline-item-date,
.timeline-horizontal.theme-red .timeline-item-date {
background-color: #f44336;
}
.theme-red .timeline-year-title,
.theme-red .timeline-month-title {
background-color: #f44336;
}
.theme-red .statusbar-overlay {
background-color: #B71C1C;
}
.theme-red .data-table .data-table-header-selected,
.data-table.theme-red .data-table-header-selected {
background: rgba(244, 67, 54, 0.1);
}
.theme-red .data-table .data-table-title-selected,
.data-table.theme-red .data-table-title-selected {
color: #f44336;
}
.swiper-pagination.color-red .swiper-pagination-bullet-active,
.theme-red .swiper-pagination .swiper-pagination-bullet-active {
background-color: #f44336;
}
.swiper-pagination.color-red .swiper-pagination-progressbar,
.theme-red .swiper-pagination .swiper-pagination-progressbar {
background-color: #f44336;
}
.swiper-pagination.swiper-pagination-progress.bg-red {
background-color: rgba(244, 67, 54, 0.25);
}
.swiper-button-next.color-red,
.swiper-container-rtl .swiper-button-prev.color-red,
.theme-red .swiper-button-next,
.theme-red .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.color-red,
.swiper-container-rtl .swiper-button-next.color-red,
.theme-red .swiper-button-prev,
.theme-red .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23f44336'%2F%3E%3C%2Fsvg%3E");
}
.theme-red .floating-button,
.theme-red .speed-dial-buttons a,
.floating-button.theme-red,
.speed-dial-buttons a.theme-red {
color: #fff;
background: #f44336;
}
html:not(.watch-active-state) .theme-red .floating-button:active,
html:not(.watch-active-state) .theme-red .speed-dial-buttons a:active,
html:not(.watch-active-state) .floating-button.theme-red:active,
html:not(.watch-active-state) .speed-dial-buttons a.theme-red:active,
.theme-red .floating-button.active-state,
.theme-red .speed-dial-buttons a.active-state,
.floating-button.theme-red.active-state,
.speed-dial-buttons a.theme-red.active-state {
background: #D32F2F;
}
.theme-red .floating-button i,
.theme-red .speed-dial-buttons a i,
.floating-button.theme-red i,
.speed-dial-buttons a.theme-red i {
color: inherit;
}
.theme-red .range-slider input[type="range"]::-webkit-slider-thumb:before,
.range-slider.theme-red input[type="range"]::-webkit-slider-thumb:before {
background-color: #f44336;
}
.theme-red .range-slider input[type="range"]::-webkit-slider-thumb,
.range-slider.theme-red input[type="range"]::-webkit-slider-thumb {
background-color: #f44336;
}
.theme-red .range-slider input[type="range"]::-ms-thumb,
.range-slider.theme-red input[type="range"]::-ms-thumb {
background-color: #f44336;
}
.theme-red .range-slider input[type="range"]::-ms-fill-lower,
.range-slider.theme-red input[type="range"]::-ms-fill-lower {
background-color: #f44336;
}
.theme-red .range-slider input[type="range"]::-moz-range-thumb,
.range-slider.theme-red input[type="range"]::-moz-range-thumb {
background-color: #f44336;
}
.badge.theme-red {
background-color: #f44336;
color: #fff;
}
.theme-pink .button:not(.button-fill) {
color: #e91e63;
}
.theme-pink .navbar .button:not(.button-fill),
.theme-pink.navbar .button:not(.button-fill),
.theme-pink .toolbar .button:not(.button-fill),
.theme-pink.toolbar .button:not(.button-fill),
.theme-pink .subnavbar .button:not(.button-fill),
.theme-pink.subnavbar .button:not(.button-fill) {
color: #fff;
}
.theme-pink .button.button-fill {
background: #e91e63;
color: #fff;
}
html:not(.watch-active-state) .theme-pink .button.button-fill:active,
.theme-pink .button.button-fill.active-state {
background: #C2185B;
}
.progressbar.theme-pink,
.theme-pink .progressbar {
background-color: rgba(233, 30, 99, 0.5);
}
.progressbar.theme-pink span,
.theme-pink .progressbar span {
background-color: #e91e63;
}
.progressbar-infinite.theme-pink,
.theme-pink .progressbar-infinite {
background-color: rgba(233, 30, 99, 0.5);
}
.progressbar-infinite.theme-pink:after,
.theme-pink .progressbar-infinite:after,
.progressbar-infinite.theme-pink:before,
.theme-pink .progressbar-infinite:before {
background-color: #e91e63;
}
.color-pink i.icon,
i.icon.color-pink {
color: #e91e63;
}
i.icon-next.color-pink,
i.icon-next.theme-pink {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-prev.color-pink,
i.icon-prev.theme-pink {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23e91e63'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-back.color-pink,
i.icon-back.theme-pink {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
}
i.icon-forward.color-pink,
i.icon-forward.theme-pink {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
}
i.icon-bars.color-pink,
i.icon-bars.theme-pink {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
}
.theme-pink a,
.theme-pink .card a {
color: #e91e63;
}
.theme-pink .navbar,
.navbar.theme-pink,
.theme-pink .toolbar,
.toolbar.theme-pink,
.theme-pink .subnavbar,
.subnavbar.theme-pink,
.theme-pink .searchbar,
.searchbar.theme-pink {
background-color: #e91e63;
}
.theme-pink .label-switch input[type="checkbox"]:checked + .checkbox,
.label-switch.theme-pink input[type="checkbox"]:checked + .checkbox {
background-color: rgba(233, 30, 99, 0.5);
}
.theme-pink .label-switch input[type="checkbox"]:checked + .checkbox:after,
.label-switch.theme-pink input[type="checkbox"]:checked + .checkbox:after {
background-color: #e91e63;
}
.theme-pink label.label-checkbox i.icon-form-checkbox:after,
label.label-checkbox.theme-pink i.icon-form-checkbox:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E");
}
.theme-pink label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
.theme-pink label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="radio"]:checked + .item-media i.icon-form-checkbox,
.theme-pink label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
.theme-pink label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
.theme-pink label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
.theme-pink label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox {
border-color: #e91e63;
background-color: #e91e63;
}
.theme-pink label.label-radio i.icon-form-radio:after,
label.label-radio.theme-pink i.icon-form-radio:after {
background-color: #e91e63;
}
.theme-pink label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-radio,
.theme-pink label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-pink input[type="radio"]:checked + .item-media i.icon-form-radio,
.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
.theme-pink label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-radio,
.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
.theme-pink label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-radio {
border-color: #e91e63;
}
.theme-pink label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-pink input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
.theme-pink label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-pink input[type="radio"]:checked + .item-media i.icon-form-radio:after,
.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
.theme-pink label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-pink input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
.theme-pink label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-pink input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
.theme-pink label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-pink input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after {
background-color: #e91e63;
}
.theme-pink .form-checkbox input[type="checkbox"]:checked ~ i,
.form-checkbox.theme-pink input[type="checkbox"]:checked ~ i {
border-color: #e91e63;
background-color: #e91e63;
}
.theme-pink .form-radio input[type="radio"]:checked ~ i,
.form-radio.theme-pink input[type="radio"]:checked ~ i {
border-color: #e91e63;
}
.theme-pink .form-radio input[type="radio"]:checked ~ i:after,
.form-radio.theme-pink input[type="radio"]:checked ~ i:after {
background-color: #e91e63;
}
.theme-pink .form-checkbox .ripple-wave,
.theme-pink .form-radio .ripple-wave {
background: rgba(233, 30, 99, 0.5);
}
.theme-pink .focus-state .label,
.theme-pink .focus-state .floating-label {
color: #e91e63;
}
.theme-pink .item-input-field.focus-state:after,
.theme-pink .input-field.focus-state:after,
.theme-pink .item-input-field.not-empty-state:after,
.theme-pink .input-field.not-empty-state:after {
background: #e91e63;
}
.theme-pink .picker-calendar-day.picker-calendar-day-today span {
color: #e91e63;
}
.theme-pink .picker-calendar-day.picker-calendar-day-selected span {
background-color: #e91e63;
color: #fff;
}
.theme-pink .picker-calendar-day.picker-calendar-day-has-events span:after {
background-color: #e91e63;
}
.theme-pink .picker-header {
background-color: #e91e63;
}
.theme-pink .modal-button {
color: #e91e63;
}
.theme-pink .timeline-horizontal .timeline-item-date,
.timeline-horizontal.theme-pink .timeline-item-date {
background-color: #e91e63;
}
.theme-pink .timeline-year-title,
.theme-pink .timeline-month-title {
background-color: #e91e63;
}
.theme-pink .statusbar-overlay {
background-color: #880E4F;
}
.theme-pink .data-table .data-table-header-selected,
.data-table.theme-pink .data-table-header-selected {
background: rgba(233, 30, 99, 0.1);
}
.theme-pink .data-table .data-table-title-selected,
.data-table.theme-pink .data-table-title-selected {
color: #e91e63;
}
.swiper-pagination.color-pink .swiper-pagination-bullet-active,
.theme-pink .swiper-pagination .swiper-pagination-bullet-active {
background-color: #e91e63;
}
.swiper-pagination.color-pink .swiper-pagination-progressbar,
.theme-pink .swiper-pagination .swiper-pagination-progressbar {
background-color: #e91e63;
}
.swiper-pagination.swiper-pagination-progress.bg-pink {
background-color: rgba(233, 30, 99, 0.25);
}
.swiper-button-next.color-pink,
.swiper-container-rtl .swiper-button-prev.color-pink,
.theme-pink .swiper-button-next,
.theme-pink .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.color-pink,
.swiper-container-rtl .swiper-button-next.color-pink,
.theme-pink .swiper-button-prev,
.theme-pink .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23e91e63'%2F%3E%3C%2Fsvg%3E");
}
.theme-pink .floating-button,
.theme-pink .speed-dial-buttons a,
.floating-button.theme-pink,
.speed-dial-buttons a.theme-pink {
color: #fff;
background: #e91e63;
}
html:not(.watch-active-state) .theme-pink .floating-button:active,
html:not(.watch-active-state) .theme-pink .speed-dial-buttons a:active,
html:not(.watch-active-state) .floating-button.theme-pink:active,
html:not(.watch-active-state) .speed-dial-buttons a.theme-pink:active,
.theme-pink .floating-button.active-state,
.theme-pink .speed-dial-buttons a.active-state,
.floating-button.theme-pink.active-state,
.speed-dial-buttons a.theme-pink.active-state {
background: #C2185B;
}
.theme-pink .floating-button i,
.theme-pink .speed-dial-buttons a i,
.floating-button.theme-pink i,
.speed-dial-buttons a.theme-pink i {
color: inherit;
}
.theme-pink .range-slider input[type="range"]::-webkit-slider-thumb:before,
.range-slider.theme-pink input[type="range"]::-webkit-slider-thumb:before {
background-color: #e91e63;
}
.theme-pink .range-slider input[type="range"]::-webkit-slider-thumb,
.range-slider.theme-pink input[type="range"]::-webkit-slider-thumb {
background-color: #e91e63;
}
.theme-pink .range-slider input[type="range"]::-ms-thumb,
.range-slider.theme-pink input[type="range"]::-ms-thumb {
background-color: #e91e63;
}
.theme-pink .range-slider input[type="range"]::-ms-fill-lower,
.range-slider.theme-pink input[type="range"]::-ms-fill-lower {
background-color: #e91e63;
}
.theme-pink .range-slider input[type="range"]::-moz-range-thumb,
.range-slider.theme-pink input[type="range"]::-moz-range-thumb {
background-color: #e91e63;
}
.badge.theme-pink {
background-color: #e91e63;
color: #fff;
}
.theme-purple .button:not(.button-fill) {
color: #9c27b0;
}
.theme-purple .navbar .button:not(.button-fill),
.theme-purple.navbar .button:not(.button-fill),
.theme-purple .toolbar .button:not(.button-fill),
.theme-purple.toolbar .button:not(.button-fill),
.theme-purple .subnavbar .button:not(.button-fill),
.theme-purple.subnavbar .button:not(.button-fill) {
color: #fff;
}
.theme-purple .button.button-fill {
background: #9c27b0;
color: #fff;
}
html:not(.watch-active-state) .theme-purple .button.button-fill:active,
.theme-purple .button.button-fill.active-state {
background: #7B1FA2;
}
.progressbar.theme-purple,
.theme-purple .progressbar {
background-color: rgba(156, 39, 176, 0.5);
}
.progressbar.theme-purple span,
.theme-purple .progressbar span {
background-color: #9c27b0;
}
.progressbar-infinite.theme-purple,
.theme-purple .progressbar-infinite {
background-color: rgba(156, 39, 176, 0.5);
}
.progressbar-infinite.theme-purple:after,
.theme-purple .progressbar-infinite:after,
.progressbar-infinite.theme-purple:before,
.theme-purple .progressbar-infinite:before {
background-color: #9c27b0;
}
.color-purple i.icon,
i.icon.color-purple {
color: #9c27b0;
}
i.icon-next.color-purple,
i.icon-next.theme-purple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-prev.color-purple,
i.icon-prev.theme-purple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%239c27b0'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-back.color-purple,
i.icon-back.theme-purple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E");
}
i.icon-forward.color-purple,
i.icon-forward.theme-purple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E");
}
i.icon-bars.color-purple,
i.icon-bars.theme-purple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E");
}
.theme-purple a,
.theme-purple .card a {
color: #9c27b0;
}
.theme-purple .navbar,
.navbar.theme-purple,
.theme-purple .toolbar,
.toolbar.theme-purple,
.theme-purple .subnavbar,
.subnavbar.theme-purple,
.theme-purple .searchbar,
.searchbar.theme-purple {
background-color: #9c27b0;
}
.theme-purple .label-switch input[type="checkbox"]:checked + .checkbox,
.label-switch.theme-purple input[type="checkbox"]:checked + .checkbox {
background-color: rgba(156, 39, 176, 0.5);
}
.theme-purple .label-switch input[type="checkbox"]:checked + .checkbox:after,
.label-switch.theme-purple input[type="checkbox"]:checked + .checkbox:after {
background-color: #9c27b0;
}
.theme-purple label.label-checkbox i.icon-form-checkbox:after,
label.label-checkbox.theme-purple i.icon-form-checkbox:after {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23ffffff'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M9%2016.17L4.83%2012l-1.42%201.41L9%2019%2021%207l-1.41-1.41z'%2F%3E%3C%2Fsvg%3E");
}
.theme-purple label.label-checkbox input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-checkbox,
.theme-purple label.label-checkbox input[type="radio"]:checked + .item-media i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="radio"]:checked + .item-media i.icon-form-checkbox,
.theme-purple label.label-checkbox input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-checkbox,
.theme-purple label.label-checkbox input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-checkbox,
.theme-purple label.label-checkbox input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-checkbox,
.theme-purple label.label-checkbox input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox,
label.label-checkbox.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-checkbox {
border-color: #9c27b0;
background-color: #9c27b0;
}
.theme-purple label.label-radio i.icon-form-radio:after,
label.label-radio.theme-purple i.icon-form-radio:after {
background-color: #9c27b0;
}
.theme-purple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-radio,
.theme-purple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio,
label.label-radio.theme-purple input[type="radio"]:checked + .item-media i.icon-form-radio,
.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio,
.theme-purple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio,
label.label-radio.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-radio,
.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio,
.theme-purple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio,
label.label-radio.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-radio {
border-color: #9c27b0;
}
.theme-purple label.label-radio input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-purple input[type="checkbox"]:checked + .item-media i.icon-form-radio:after,
.theme-purple label.label-radio input[type="radio"]:checked + .item-media i.icon-form-radio:after,
label.label-radio.theme-purple input[type="radio"]:checked + .item-media i.icon-form-radio:after,
.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-after i.icon-form-radio:after,
.theme-purple label.label-radio input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
label.label-radio.theme-purple input[type="radio"]:checked ~ .item-after i.icon-form-radio:after,
.theme-purple label.label-radio input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-purple input[type="checkbox"]:checked ~ .item-inner i.icon-form-radio:after,
.theme-purple label.label-radio input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after,
label.label-radio.theme-purple input[type="radio"]:checked ~ .item-inner i.icon-form-radio:after {
background-color: #9c27b0;
}
.theme-purple .form-checkbox input[type="checkbox"]:checked ~ i,
.form-checkbox.theme-purple input[type="checkbox"]:checked ~ i {
border-color: #9c27b0;
background-color: #9c27b0;
}
.theme-purple .form-radio input[type="radio"]:checked ~ i,
.form-radio.theme-purple input[type="radio"]:checked ~ i {
border-color: #9c27b0;
}
.theme-purple .form-radio input[type="radio"]:checked ~ i:after,
.form-radio.theme-purple input[type="radio"]:checked ~ i:after {
background-color: #9c27b0;
}
.theme-purple .form-checkbox .ripple-wave,
.theme-purple .form-radio .ripple-wave {
background: rgba(156, 39, 176, 0.5);
}
.theme-purple .focus-state .label,
.theme-purple .focus-state .floating-label {
color: #9c27b0;
}
.theme-purple .item-input-field.focus-state:after,
.theme-purple .input-field.focus-state:after,
.theme-purple .item-input-field.not-empty-state:after,
.theme-purple .input-field.not-empty-state:after {
background: #9c27b0;
}
.theme-purple .picker-calendar-day.picker-calendar-day-today span {
color: #9c27b0;
}
.theme-purple .picker-calendar-day.picker-calendar-day-selected span {
background-color: #9c27b0;
color: #fff;
}
.theme-purple .picker-calendar-day.picker-calendar-day-has-events span:after {
background-color: #9c27b0;
}
.theme-purple .picker-header {
background-color: #9c27b0;
}
.theme-purple .modal-button {
color: #9c27b0;
}
.theme-purple .timeline-horizontal .timeline-item-date,
.timeline-horizontal.theme-purple .timeline-item-date {
background-color: #9c27b0;
}
.theme-purple .timeline-year-title,
.theme-purple .timeline-month-title {
background-color: #9c27b0;
}
.theme-purple .statusbar-overlay {
background-color: #4A148C;
}
.theme-purple .data-table .data-table-header-selected,
.data-table.theme-purple .data-table-header-selected {
background: rgba(156, 39, 176, 0.1);
}
.theme-purple .data-table .data-table-title-selected,
.data-table.theme-purple .data-table-title-selected {
color: #9c27b0;
}
.swiper-pagination.color-purple .swiper-pagination-bullet-active,
.theme-purple .swiper-pagination .swiper-pagination-bullet-active {
background-color: #9c27b0;
}
.swiper-pagination.color-purple .swiper-pagination-progressbar,
.theme-purple .swiper-pagination .swiper-pagination-progressbar {
background-color: #9c27b0;
}
.swiper-pagination.swiper-pagination-progress.bg-purple {
background-color: rgba(156, 39, 176, 0.25);
}
.swiper-button-next.color-purple,
.swiper-container-rtl .swiper-button-prev.color-purple,
.theme-purple .swiper-button-next,
.theme-purple .swiper-container-rtl .swiper-button-prev {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E");
}
.swiper-button-prev.color-purple,
.swiper-container-rtl .swiper-button-next.color-purple,
.theme-purple .swiper-button-prev,
.theme-purple .swiper-container-rtl .swiper-button-next {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%239c27b0'%2F%3E%3C%2Fsvg%3E");
}
.theme-purple .floating-button,
.theme-purple .speed-dial-buttons a,
.floating-button.theme-purple,
.speed-dial-buttons a.theme-purple {
color: #fff;
background: #9c27b0;
}
html:not(.watch-active-state) .theme-purple .floating-button:active,
html:not(.watch-active-state) .theme-purple .speed-dial-buttons a:active,
html:not(.watch-active-state) .floating-button.theme-purple:active,
html:not(.watch-active-state) .speed-dial-buttons a.theme-purple:active,
.theme-purple .floating-button.active-state,
.theme-purple .speed-dial-buttons a.active-state,
.floating-button.theme-purple.active-state,
.speed-dial-buttons a.theme-purple.active-state {
background: #7B1FA2;
}
.theme-purple .floating-button i,
.theme-purple .speed-dial-buttons a i,
.floating-button.theme-purple i,
.speed-dial-buttons a.theme-purple i {
color: inherit;
}
.theme-purple .range-slider input[type="range"]::-webkit-slider-thumb:before,
.range-slider.theme-purple input[type="range"]::-webkit-slider-thumb:before {
background-color: #9c27b0;
}
.theme-purple .range-slider input[type="range"]::-webkit-slider-thumb,
.range-slider.theme-purple input[type="range"]::-webkit-slider-thumb {
background-color: #9c27b0;
}
.theme-purple .range-slider input[type="range"]::-ms-thumb,
.range-slider.theme-purple input[type="range"]::-ms-thumb {
background-color: #9c27b0;
}
.theme-purple .range-slider input[type="range"]::-ms-fill-lower,
.range-slider.theme-purple input[type="range"]::-ms-fill-lower {
background-color: #9c27b0;
}
.theme-purple .range-slider input[type="range"]::-moz-range-thumb,
.range-slider.theme-purple input[type="range"]::-moz-range-thumb {
background-color: #9c27b0;
}
.badge.theme-purple {
background-color: #9c27b0;
color: #fff;
}
.theme-deeppurple .button:not(.button-fill) {
color: #673ab7;
}
.theme-deeppurple .navbar .button:not(.button-fill),
.theme-deeppurple.navbar .button:not(.button-fill),
.theme-deeppurple .toolbar .button:not(.button-fill),
.theme-deeppurple.toolbar .button:not(.button-fill),
.theme-deeppurple .subnavbar .button:not(.button-fill),
.theme-deeppurple.subnavbar .button:not(.button-fill) {
color: #fff;
}
.theme-deeppurple .button.button-fill {
background: #673ab7;
color: #fff;
}
html:not(.watch-active-state) .theme-deeppurple .button.button-fill:active,
.theme-deeppurple .button.button-fill.active-state {
background: #512DA8;
}
.progressbar.theme-deeppurple,
.theme-deeppurple .progressbar {
background-color: rgba(103, 58, 183, 0.5);
}
.progressbar.theme-deeppurple span,
.theme-deeppurple .progressbar span {
background-color: #673ab7;
}
.progressbar-infinite.theme-deeppurple,
.theme-deeppurple .progressbar-infinite {
background-color: rgba(103, 58, 183, 0.5);
}
.progressbar-infinite.theme-deeppurple:after,
.theme-deeppurple .progressbar-infinite:after,
.progressbar-infinite.theme-deeppurple:before,
.theme-deeppurple .progressbar-infinite:before {
background-color: #673ab7;
}
.color-deeppurple i.icon,
i.icon.color-deeppurple {
color: #673ab7;
}
i.icon-next.color-deeppurple,
i.icon-next.theme-deeppurple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M10%206L8.59%207.41%2013.17%2012l-4.58%204.59L10%2018l6-6z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-prev.color-deeppurple,
i.icon-prev.theme-deeppurple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20fill%3D'%23673ab7'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M15.41%207.41L14%206l-6%206%206%206%201.41-1.41L10.83%2012z'%2F%3E%3Cpath%20d%3D'M0%200h24v24H0z'%20fill%3D'none'%2F%3E%3C%2Fsvg%3E");
}
i.icon-back.color-deeppurple,
i.icon-back.theme-deeppurple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M20%2011H7.83l5.59-5.59L12%204l-8%208%208%208%201.41-1.41L7.83%2013H20v-2z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E");
}
i.icon-forward.color-deeppurple,
i.icon-forward.theme-deeppurple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M12%204l-1.41%201.41L16.17%2011H4v2h12.17l-5.58%205.59L12%2020l8-8z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E");
}
i.icon-bars.color-deeppurple,
i.icon-bars.theme-deeppurple {
background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'24'%20height%3D'24'%20viewBox%3D'0%200%2024%2024'%3E%3Cpath%20d%3D'M3%2018h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z'%20fill%3D'%23673ab7'%2F%3E%3C%2Fsvg%3E");
}
.theme-deeppurple a,
.theme-deeppurple .card a {
color: #673ab7;
}
.theme-deeppurple .navbar,
.navbar.theme-deeppurple,
.theme-deeppurple .toolbar,
.toolbar.theme-deeppurple,
.theme-deeppurple .subnavbar,
.subnav