/*====================
  Primary Theme
  ==================== */
.text-color-primary {
  --f7-theme-color-text-color: var(--f7-theme-color);
}
.bg-color-primary {
  --f7-theme-color-bg-color: var(--f7-theme-color);
}
.border-color-primary {
  --f7-theme-color-border-color: var(--f7-theme-color);
}
.ripple-color-primary {
  --f7-theme-color-ripple-color: rgba(var(--f7-theme-color-rgb), 0.3);
}
/*====================
  Colors List
  ==================== */
:root {
  --f7-color-red: #ff3b30;
  --f7-color-red-rgb: 255, 59, 48;
  --f7-color-red-shade: #ff1407;
  --f7-color-red-tint: #ff6259;
  --f7-color-green: #4cd964;
  --f7-color-green-rgb: 76, 217, 100;
  --f7-color-green-shade: #2cd048;
  --f7-color-green-tint: #6ee081;
  --f7-color-blue: #2196f3;
  --f7-color-blue-rgb: 33, 150, 243;
  --f7-color-blue-shade: #0c82df;
  --f7-color-blue-tint: #48a8f5;
  --f7-color-pink: #ff2d55;
  --f7-color-pink-rgb: 255, 45, 85;
  --f7-color-pink-shade: #ff0434;
  --f7-color-pink-tint: #ff5676;
  --f7-color-yellow: #ffcc00;
  --f7-color-yellow-rgb: 255, 204, 0;
  --f7-color-yellow-shade: #d6ab00;
  --f7-color-yellow-tint: #ffd429;
  --f7-color-orange: #ff9500;
  --f7-color-orange-rgb: 255, 149, 0;
  --f7-color-orange-shade: #d67d00;
  --f7-color-orange-tint: #ffa629;
  --f7-color-purple: #9c27b0;
  --f7-color-purple-rgb: 156, 39, 176;
  --f7-color-purple-shade: #7e208f;
  --f7-color-purple-tint: #b92fd1;
  --f7-color-deeppurple: #673ab7;
  --f7-color-deeppurple-rgb: 103, 58, 183;
  --f7-color-deeppurple-shade: #563098;
  --f7-color-deeppurple-tint: #7c52c8;
  --f7-color-lightblue: #5ac8fa;
  --f7-color-lightblue-rgb: 90, 200, 250;
  --f7-color-lightblue-shade: #32bbf9;
  --f7-color-lightblue-tint: #82d5fb;
  --f7-color-teal: #009688;
  --f7-color-teal-rgb: 0, 150, 136;
  --f7-color-teal-shade: #006d63;
  --f7-color-teal-tint: #00bfad;
  --f7-color-lime: #cddc39;
  --f7-color-lime-rgb: 205, 220, 57;
  --f7-color-lime-shade: #bac923;
  --f7-color-lime-tint: #d6e25c;
  --f7-color-deeporange: #ff6b22;
  --f7-color-deeporange-rgb: 255, 107, 34;
  --f7-color-deeporange-shade: #f85200;
  --f7-color-deeporange-tint: #ff864b;
  --f7-color-gray: #8e8e93;
  --f7-color-gray-rgb: 142, 142, 147;
  --f7-color-gray-shade: #79797f;
  --f7-color-gray-tint: #a3a3a7;
  --f7-color-white: #ffffff;
  --f7-color-white-rgb: 255, 255, 255;
  --f7-color-white-shade: #ebebeb;
  --f7-color-white-tint: #ffffff;
  --f7-color-black: #000000;
  --f7-color-black-rgb: 0, 0, 0;
  --f7-color-black-shade: #000000;
  --f7-color-black-tint: #141414;
}
/*====================
  Color Themes
  ==================== */
.color-theme-red {
  --f7-theme-color: #ff3b30;
  --f7-theme-color-rgb: 255, 59, 48;
  --f7-theme-color-shade: #ff1407;
  --f7-theme-color-tint: #ff6259;
}
.color-theme-green {
  --f7-theme-color: #4cd964;
  --f7-theme-color-rgb: 76, 217, 100;
  --f7-theme-color-shade: #2cd048;
  --f7-theme-color-tint: #6ee081;
}
.color-theme-blue {
  --f7-theme-color: #2196f3;
  --f7-theme-color-rgb: 33, 150, 243;
  --f7-theme-color-shade: #0c82df;
  --f7-theme-color-tint: #48a8f5;
}
.color-theme-pink {
  --f7-theme-color: #ff2d55;
  --f7-theme-color-rgb: 255, 45, 85;
  --f7-theme-color-shade: #ff0434;
  --f7-theme-color-tint: #ff5676;
}
.color-theme-yellow {
  --f7-theme-color: #ffcc00;
  --f7-theme-color-rgb: 255, 204, 0;
  --f7-theme-color-shade: #d6ab00;
  --f7-theme-color-tint: #ffd429;
}
.color-theme-orange {
  --f7-theme-color: #ff9500;
  --f7-theme-color-rgb: 255, 149, 0;
  --f7-theme-color-shade: #d67d00;
  --f7-theme-color-tint: #ffa629;
}
.color-theme-purple {
  --f7-theme-color: #9c27b0;
  --f7-theme-color-rgb: 156, 39, 176;
  --f7-theme-color-shade: #7e208f;
  --f7-theme-color-tint: #b92fd1;
}
.color-theme-deeppurple {
  --f7-theme-color: #673ab7;
  --f7-theme-color-rgb: 103, 58, 183;
  --f7-theme-color-shade: #563098;
  --f7-theme-color-tint: #7c52c8;
}
.color-theme-lightblue {
  --f7-theme-color: #5ac8fa;
  --f7-theme-color-rgb: 90, 200, 250;
  --f7-theme-color-shade: #32bbf9;
  --f7-theme-color-tint: #82d5fb;
}
.color-theme-teal {
  --f7-theme-color: #009688;
  --f7-theme-color-rgb: 0, 150, 136;
  --f7-theme-color-shade: #006d63;
  --f7-theme-color-tint: #00bfad;
}
.color-theme-lime {
  --f7-theme-color: #cddc39;
  --f7-theme-color-rgb: 205, 220, 57;
  --f7-theme-color-shade: #bac923;
  --f7-theme-color-tint: #d6e25c;
}
.color-theme-deeporange {
  --f7-theme-color: #ff6b22;
  --f7-theme-color-rgb: 255, 107, 34;
  --f7-theme-color-shade: #f85200;
  --f7-theme-color-tint: #ff864b;
}
.color-theme-gray {
  --f7-theme-color: #8e8e93;
  --f7-theme-color-rgb: 142, 142, 147;
  --f7-theme-color-shade: #79797f;
  --f7-theme-color-tint: #a3a3a7;
}
.color-theme-white {
  --f7-theme-color: #ffffff;
  --f7-theme-color-rgb: 255, 255, 255;
  --f7-theme-color-shade: #ebebeb;
  --f7-theme-color-tint: #ffffff;
}
.color-theme-black {
  --f7-theme-color: #000000;
  --f7-theme-color-rgb: 0, 0, 0;
  --f7-theme-color-shade: #000000;
  --f7-theme-color-tint: #141414;
}
/*====================
  Color Overrides
  ==================== */
.color-red {
  --f7-theme-color: #ff3b30;
  --f7-theme-color-rgb: 255, 59, 48;
  --f7-theme-color-shade: #ff1407;
  --f7-theme-color-tint: #ff6259;
}
.text-color-red {
  --f7-theme-color-text-color: #ff3b30;
}
.bg-color-red {
  --f7-theme-color-bg-color: #ff3b30;
}
.border-color-red {
  --f7-theme-color-border-color: #ff3b30;
}
.ripple-color-red,
.ripple-red {
  --f7-theme-color-ripple-color: rgba(255, 59, 48, 0.3);
}
.color-green {
  --f7-theme-color: #4cd964;
  --f7-theme-color-rgb: 76, 217, 100;
  --f7-theme-color-shade: #2cd048;
  --f7-theme-color-tint: #6ee081;
}
.text-color-green {
  --f7-theme-color-text-color: #4cd964;
}
.bg-color-green {
  --f7-theme-color-bg-color: #4cd964;
}
.border-color-green {
  --f7-theme-color-border-color: #4cd964;
}
.ripple-color-green,
.ripple-green {
  --f7-theme-color-ripple-color: rgba(76, 217, 100, 0.3);
}
.color-blue {
  --f7-theme-color: #2196f3;
  --f7-theme-color-rgb: 33, 150, 243;
  --f7-theme-color-shade: #0c82df;
  --f7-theme-color-tint: #48a8f5;
}
.text-color-blue {
  --f7-theme-color-text-color: #2196f3;
}
.bg-color-blue {
  --f7-theme-color-bg-color: #2196f3;
}
.border-color-blue {
  --f7-theme-color-border-color: #2196f3;
}
.ripple-color-blue,
.ripple-blue {
  --f7-theme-color-ripple-color: rgba(33, 150, 243, 0.3);
}
.color-pink {
  --f7-theme-color: #ff2d55;
  --f7-theme-color-rgb: 255, 45, 85;
  --f7-theme-color-shade: #ff0434;
  --f7-theme-color-tint: #ff5676;
}
.text-color-pink {
  --f7-theme-color-text-color: #ff2d55;
}
.bg-color-pink {
  --f7-theme-color-bg-color: #ff2d55;
}
.border-color-pink {
  --f7-theme-color-border-color: #ff2d55;
}
.ripple-color-pink,
.ripple-pink {
  --f7-theme-color-ripple-color: rgba(255, 45, 85, 0.3);
}
.color-yellow {
  --f7-theme-color: #ffcc00;
  --f7-theme-color-rgb: 255, 204, 0;
  --f7-theme-color-shade: #d6ab00;
  --f7-theme-color-tint: #ffd429;
}
.text-color-yellow {
  --f7-theme-color-text-color: #ffcc00;
}
.bg-color-yellow {
  --f7-theme-color-bg-color: #ffcc00;
}
.border-color-yellow {
  --f7-theme-color-border-color: #ffcc00;
}
.ripple-color-yellow,
.ripple-yellow {
  --f7-theme-color-ripple-color: rgba(255, 204, 0, 0.3);
}
.color-orange {
  --f7-theme-color: #ff9500;
  --f7-theme-color-rgb: 255, 149, 0;
  --f7-theme-color-shade: #d67d00;
  --f7-theme-color-tint: #ffa629;
}
.text-color-orange {
  --f7-theme-color-text-color: #ff9500;
}
.bg-color-orange {
  --f7-theme-color-bg-color: #ff9500;
}
.border-color-orange {
  --f7-theme-color-border-color: #ff9500;
}
.ripple-color-orange,
.ripple-orange {
  --f7-theme-color-ripple-color: rgba(255, 149, 0, 0.3);
}
.color-purple {
  --f7-theme-color: #9c27b0;
  --f7-theme-color-rgb: 156, 39, 176;
  --f7-theme-color-shade: #7e208f;
  --f7-theme-color-tint: #b92fd1;
}
.text-color-purple {
  --f7-theme-color-text-color: #9c27b0;
}
.bg-color-purple {
  --f7-theme-color-bg-color: #9c27b0;
}
.border-color-purple {
  --f7-theme-color-border-color: #9c27b0;
}
.ripple-color-purple,
.ripple-purple {
  --f7-theme-color-ripple-color: rgba(156, 39, 176, 0.3);
}
.color-deeppurple {
  --f7-theme-color: #673ab7;
  --f7-theme-color-rgb: 103, 58, 183;
  --f7-theme-color-shade: #563098;
  --f7-theme-color-tint: #7c52c8;
}
.text-color-deeppurple {
  --f7-theme-color-text-color: #673ab7;
}
.bg-color-deeppurple {
  --f7-theme-color-bg-color: #673ab7;
}
.border-color-deeppurple {
  --f7-theme-color-border-color: #673ab7;
}
.ripple-color-deeppurple,
.ripple-deeppurple {
  --f7-theme-color-ripple-color: rgba(103, 58, 183, 0.3);
}
.color-lightblue {
  --f7-theme-color: #5ac8fa;
  --f7-theme-color-rgb: 90, 200, 250;
  --f7-theme-color-shade: #32bbf9;
  --f7-theme-color-tint: #82d5fb;
}
.text-color-lightblue {
  --f7-theme-color-text-color: #5ac8fa;
}
.bg-color-lightblue {
  --f7-theme-color-bg-color: #5ac8fa;
}
.border-color-lightblue {
  --f7-theme-color-border-color: #5ac8fa;
}
.ripple-color-lightblue,
.ripple-lightblue {
  --f7-theme-color-ripple-color: rgba(90, 200, 250, 0.3);
}
.color-teal {
  --f7-theme-color: #009688;
  --f7-theme-color-rgb: 0, 150, 136;
  --f7-theme-color-shade: #006d63;
  --f7-theme-color-tint: #00bfad;
}
.text-color-teal {
  --f7-theme-color-text-color: #009688;
}
.bg-color-teal {
  --f7-theme-color-bg-color: #009688;
}
.border-color-teal {
  --f7-theme-color-border-color: #009688;
}
.ripple-color-teal,
.ripple-teal {
  --f7-theme-color-ripple-color: rgba(0, 150, 136, 0.3);
}
.color-lime {
  --f7-theme-color: #cddc39;
  --f7-theme-color-rgb: 205, 220, 57;
  --f7-theme-color-shade: #bac923;
  --f7-theme-color-tint: #d6e25c;
}
.text-color-lime {
  --f7-theme-color-text-color: #cddc39;
}
.bg-color-lime {
  --f7-theme-color-bg-color: #cddc39;
}
.border-color-lime {
  --f7-theme-color-border-color: #cddc39;
}
.ripple-color-lime,
.ripple-lime {
  --f7-theme-color-ripple-color: rgba(205, 220, 57, 0.3);
}
.color-deeporange {
  --f7-theme-color: #ff6b22;
  --f7-theme-color-rgb: 255, 107, 34;
  --f7-theme-color-shade: #f85200;
  --f7-theme-color-tint: #ff864b;
}
.text-color-deeporange {
  --f7-theme-color-text-color: #ff6b22;
}
.bg-color-deeporange {
  --f7-theme-color-bg-color: #ff6b22;
}
.border-color-deeporange {
  --f7-theme-color-border-color: #ff6b22;
}
.ripple-color-deeporange,
.ripple-deeporange {
  --f7-theme-color-ripple-color: rgba(255, 107, 34, 0.3);
}
.color-gray {
  --f7-theme-color: #8e8e93;
  --f7-theme-color-rgb: 142, 142, 147;
  --f7-theme-color-shade: #79797f;
  --f7-theme-color-tint: #a3a3a7;
}
.text-color-gray {
  --f7-theme-color-text-color: #8e8e93;
}
.bg-color-gray {
  --f7-theme-color-bg-color: #8e8e93;
}
.border-color-gray {
  --f7-theme-color-border-color: #8e8e93;
}
.ripple-color-gray,
.ripple-gray {
  --f7-theme-color-ripple-color: rgba(142, 142, 147, 0.3);
}
.color-white {
  --f7-theme-color: #ffffff;
  --f7-theme-color-rgb: 255, 255, 255;
  --f7-theme-color-shade: #ebebeb;
  --f7-theme-color-tint: #ffffff;
}
.text-color-white {
  --f7-theme-color-text-color: #ffffff;
}
.bg-color-white {
  --f7-theme-color-bg-color: #ffffff;
}
.border-color-white {
  --f7-theme-color-border-color: #ffffff;
}
.ripple-color-white,
.ripple-white {
  --f7-theme-color-ripple-color: rgba(255, 255, 255, 0.3);
}
.color-black {
  --f7-theme-color: #000000;
  --f7-theme-color-rgb: 0, 0, 0;
  --f7-theme-color-shade: #000000;
  --f7-theme-color-tint: #141414;
}
.text-color-black {
  --f7-theme-color-text-color: #000000;
}
.bg-color-black {
  --f7-theme-color-bg-color: #000000;
}
.border-color-black {
  --f7-theme-color-border-color: #000000;
}
.ripple-color-black,
.ripple-black {
  --f7-theme-color-ripple-color: rgba(0, 0, 0, 0.3);
}