<?php
$primary_color = sanitize_hex_color( get_theme_mod( 'anila_primary_color', '{$primary_color}' ) );
$primary_color_light = sanitize_hex_color( get_theme_mod( 'anila_primary-color-light', '{$primary_color_light}' ) );
$primary_color_dark = sanitize_hex_color( get_theme_mod( 'anila_primary-color-dark', '{$primary_color_dark}' ) );
$font_color = sanitize_hex_color( get_theme_mod( 'anila_font-color', '{$font_color}' ) );
$heading_font_weight = get_theme_mod( 'anila_Typography_heading_weight', '600' );
$paragraph_font_weight = get_theme_mod( 'anila_Typography_paragraph_weight', '400' );

$inline_styles = "
h1, h2, h3, h4, h5, h6 {
    font-weight: {$heading_font_weight};
}

figure figcaption {
    background-color: {$primary_color_light};
    border-bottom: 2px solid {$primary_color_dark}; }

:focus {
    outline: 2px solid {$primary_color}; 
}

::selection {
    background: {$primary_color};
    color: #ffffff; 
}

::-moz-selection {
    background: {$primary_color};
    color: #ffffff; 
}

h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
    color: {$font_color}; 
}

a {
    color: {$primary_color}; 
}

a:hover {
    color: {$primary_color_dark};
}

blockquote {
    background-color: {$primary_color_light};
    border-left: 4px solid {$primary_color};
}

code {
    border: none;
    background: #dddfd4;
}

table {
    border: 2px solid {$primary_color_dark}; 
}

thead {
    background-color: {$primary_color_dark};
    border: 1px solid {$font_color}; 
}

tr, td {
    border: 1px solid {$font_color}; 
}

body {
    color: {$font_color};
    font-weight: {$paragraph_font_weight};
}

.anilaDefaultHeader__top {
    background-color: {$primary_color}; 
}

.anilaDefaultHeader__top .top-menu a {
    color: #dddfd4;
}

.anilaDefaultHeader__top .social-media .fab {
    color: #dddfd4;
}

.anilaDefaultHeader__bottom {
    background-color: {$primary_color_dark};
}

.anilaDefaultHeader__bottom .main-menu ul li {
    border-left: 1px solid {$primary_color};
}

.anilaDefaultHeader__bottom .main-menu ul li a:hover {
    background: {$primary_color};
    color: {$font_color};
}

.anilaDefaultHeader__bottom .main-menu li ul li {
    border-bottom: 1px solid {$primary_color};
}

.anilaDefaultHeader__bottom .main-menu li:hover > ul {
    background: {$primary_color_dark};
    color: {$font_color};
}

.anilaDefaultHeader__bottom .main-menu .current-menu-item {
    background: {$primary_color}; 
}

.anilaDefaultHeader__bottom .main-menu .menu-item-home {
    background: {$primary_color}; 
}

@media only screen and (max-device-width: 1023px) {
.anilaDefaultHeader__top .social-media {
    background-color: {$primary_color_dark}; }}

.anilaHeaderTwo {
    border-bottom: solid 4px {$primary_color};
}

.anilaHeaderTwo__menu ul li {
    border-left: 1px solid {$primary_color};
}

.anilaHeaderTwo__menu ul li a:hover {
    background: {$primary_color};
    color: {$font_color}; 

}

.anilaHeaderTwo__menu li ul li {
    border-bottom: 1px solid #000;
    border-right: 1px solid #000;
}

.anilaHeaderTwo__menu li:hover > ul {
    background: {$primary_color};
    color: {$font_color}; 
}

.anilaHeaderTwo__menu .current-menu-item {
    background-color: {$primary_color}; 
}

.anilaHeaderTwo__menu .menu-item-home {
    background-color: {$primary_color}; 
}

.anilaHeaderTwo .fa-searchengin:hover {
    color: {$font_color};
    background-color: {$primary_color_dark};
}

.anilaHeaderTwo .search_background {
    background-image: linear-gradient(15deg, {$primary_color_dark}, {$primary_color}, {$primary_color_dark});
}

.search-query {
    color: {$font_color};
}

.fa-search {
    color: {$primary_color_dark};
    background-color: #ddd;
    border-left: 2px solid {$primary_color_dark};
}

.fa-search:hover {
    color: {$primary_color};
    background-color: #121212;
    border-left: 2px solid {$primary_color};
    border-right: 2px solid {$primary_color};
}

.anilaDefaultHome {
    background-image: linear-gradient(5deg, #dddfd4, #f4f5f1, #dddfd4);
}

.sticky-wrapper {
    
    border-bottom: 2px solid {$primary_color};
}

.sticky-wrapper .sticky__meta .sticky-rm a {
    background-color: {$primary_color_dark};
}

.sticky-wrapper .sticky__meta .sticky-rm a:hover {
    background-color: {$primary_color};
   
}

.sticky-wrapper .sticky-rm-for-mobile a {
    background-color: {$primary_color_dark};
}

.sticky-wrapper .sticky-rm-for-mobile a:hover {
    background-color: {$primary_color};
}

.post-navigation {
    background-color: {$primary_color_dark};
}

.text-center a {
    background-color: {$primary_color_dark};
}

.text-center a:hover {
    background-color: {$primary_color};
}

.nav-links a {
    background-color: {$primary_color};
}

.nav-links a:hover {
    background-color: #dddfd4;
    color: {$font_color};
}

.current {
    color: {$primary_color};
}

.front-page-advt {
    background-color: {$primary_color};
}

.anilaDefaultHome-post h2 a {
    color: {$font_color};
}

.anilaDefaultHome-post__cat a {
    background-color: {$primary_color_dark};
}

.anilaDefaultHome-post__cat a:hover {
    background-color: {$primary_color};
}

.anilaDefaultHome-post__rm a {
    background-color: {$primary_color_dark};
}

.anilaDefaultHome-post__rm a:hover {
    background-color: {$primary_color};
}

.big-thumbnail-wrapper__rm a {
    background-color: {$primary_color_dark};
}

.big-thumbnail-wrapper__rm a:hover {
    background-color: {$primary_color};
}

.category-box .category-1 .small-thumbnail-post .small-post-wrapper .small-post-content-wrapper__rm a, .category-box .category-2 .small-thumbnail-post .small-post-wrapper .small-post-content-wrapper__rm a {
    background-color: {$primary_color_dark};
}

.category-box .category-1 .small-thumbnail-post .small-post-wrapper .small-post-content-wrapper__rm a:hover, .category-box .category-2 .small-thumbnail-post .small-post-wrapper .small-post-content-wrapper__rm a:hover {
    background-color: {$primary_color};
}

.home-2-container .home-2-row .sidebar-column {
    background-color: {$primary_color_light};
}

.home-2-article__wrapper .home-2-article__rm a {
    background-color: {$primary_color_dark};
}

.home-2-article__wrapper .home-2-article__rm a:hover {
    background-color: {$primary_color};
}

.sticky {
    border-left: 6px solid {$primary_color}; 
}

.sticky {
    
    border: 3px solid {$primary_color}; 
}

.home-3-container .home-3-row .sidebar-column {
    background-color: {$primary_color_light};
}

.home-3-contnet__rm a {
    background-color: {$primary_color_dark};
}

.home-3-contnet__rm a:hover {
    background-color: {$primary_color}; 
}

.home-4-container .home-4-row .sidebar-column {
    background-color: {$primary_color_light};
}

.single-default-headline {
    border-bottom: 2px solid {$primary_color}; 
}

.single-default-container .single-default-row .single-default-sidebar-column {
    background-color: {$primary_color_light};
}

.single-default-article__meta {
    background-image: linear-gradient(20deg, {$primary_color_light}, white, {$primary_color_light});
    border-bottom: 2px solid {$primary_color};
    border-bottom: solid 2px {$primary_color};
}

.post-tags a, .tagcloud a {
    color: {$font_color};
}

.post-tags a:hover, .tagcloud a:hover {
    background-color: {$primary_color};
}

.post-tags a:hover:before,
.tagcloud a:hover:before {
  border-right-color: {$primary_color};
}

.single-author {
    background-image: linear-gradient(20deg, {$primary_color_light}, white, {$primary_color_light});
    border-bottom: 2px solid {$primary_color}; 
}

.author-area {
    background-image: linear-gradient(20deg, {$primary_color_light}, white, {$primary_color_light});
    border-bottom: 2px solid {$primary_color};
}

.post-nav {
    border-bottom: 2px solid {$primary_color};
}

.post-nav__prev-fa a {
    color: {$font_color}; 
}

.post-nav__prev-text a {
    color: {$font_color}; 
}

.post-nav__next-text a {
    color: {$font_color}; 
}

.post-nav__next-fa a {
    color: {$font_color}; 
}

.comment-form-comment button, input[type=button], input[type=reset], input[type=submit], .button, .entry-content .button {
    background-color: {$primary_color};
    color: #FFFFFF;
}

.comment-form-comment button:hover, input[type=button]:hover, input[type=reset]:hover, input[type=submit]:hover, .button:hover, .entry-content .button:hover {
    background-color: {$primary_color_dark};
}

.single-comment__body .single-comment__content .single-comment__comment {    
    border-bottom: 2px solid {$primary_color};
}

.single-comment__body .single-comment__content .single-comment__reply a {
    background-color: {$primary_color};
}

.single-comment__body .single-comment__content .single-comment__reply a:hover {
    background-color: {$primary_color_dark};
}

.comment-form {
    
    border-bottom: 2px solid {$primary_color};
}

.mob-home .sidebar-area {
    background-color: {$primary_color_light};
}

.mob-header {
    background-color: {$primary_color};
}

.mob-header__logo {
    background-color: {$primary_color_dark};
}

.mob-header__menu .navigation__background {
    background-image: radial-gradient({$primary_color}, {$primary_color_dark}, {$primary_color});
}

.mob-header__search .search_background {
    background-image: linear-gradient(15deg, {$primary_color_dark}, {$primary_color}, {$primary_color_dark});
}

.c-sidebar-widget {
    background-color: {$primary_color_light};
}

.c-sidebar-widget .widget-title {
    color: {$primary_color_dark};
    border-bottom: 2px solid white;
}

.c-sidebar-widget .widget-title::after {
    background: {$primary_color_dark};
}

.c-footer-widget--dark .widget-title::after {
    background: {$primary_color};
}

.c-footer-widget--light {
    color: {$font_color}; 
}

.c-footer-widget--light .widget-title {
    color: {$primary_color_dark};
}

.c-footer-widget--light .widget-title::after {
    background: {$primary_color_dark};
}

.errorheading {
    border-bottom: 3px solid {$primary_color_dark}; 
}

.errorpage {
    background-image: linear-gradient(to right bottom, {$primary_color_dark}, {$primary_color});
} 

.fournotfour {
    text-shadow: 0 2px 2px {$primary_color_dark}; 
}

.homebox p {
    background-image: linear-gradient(to right bottom, {$primary_color}, {$primary_color_dark});
    text-shadow: 0 2px 2px {$primary_color_dark};
}

.homebox p:hover {
    background-image: linear-gradient(to right bottom, {$primary_color_dark}, {$primary_color});
}

";