/*==================================================
  DoubtNest Theme
  Part 1 : Base / Reset / Variables
==================================================*/

/*==============================
  CSS Variables
==============================*/

:root{
    --primary-color:#274c4f;
    --secondary-color:#d39e76;
    --accent-color:#35c1b4;

    --background:#ffffff;
    --light-bg:#eef4f5;

    --text-color:#222222;
    --muted-text:#777777;

    --border-color:#ebebeb;

    --shadow:0 2px 10px rgba(0,0,0,.08);

    --radius:12px;
    --transition:.3s ease;
}


/*==============================
  Reset
==============================*/

*,
*::before,
*::after{
    margin:0;
    padding:0;
    box-sizing:border-box;
}


/*==============================
  HTML
==============================*/

html{
    scroll-behavior:smooth;
}


/*==============================
  Body
==============================*/

body{
    font-family:Arial,Helvetica,sans-serif;
    background:var(--background);
    color:var(--text-color);
    line-height:1.6;
}


/*==============================
  Links
==============================*/

a{
    color:inherit;
    text-decoration:none;
    transition:var(--transition);
}


/*==============================
  Images
==============================*/

img{
    display:block;
    max-width:100%;
    height:auto;
}


/*==============================
  Lists
==============================*/

ul,
ol{
    list-style:none;
}


/*==============================
  Form Elements
==============================*/

button,
input,
textarea,
select{
    font:inherit;
}


/*==============================
  Container
==============================*/

.container{
    width:100%;
    margin:0 auto;
    padding:0 20px;
}


/*==============================
  Utility Classes
==============================*/

.text-center{
    text-align:center;
}

.hidden{
    display:none !important;
}

.full-width{
    width:100%;
}


/*==============================
  Common Card
==============================*/

.card{
    background:#fff;
    border-radius:var(--radius);
    box-shadow:var(--shadow);
    overflow:hidden;
    transition:var(--transition);
}

.card:hover{
    transform:translateY(-4px);
}

.card-content{
    padding:20px;
}

.card-title{
    font-size:18px;
    font-weight:700;
    margin-bottom:10px;
}

.card-text{
    color:var(--muted-text);
    font-size:14px;
}


/*==============================
  Section Title
==============================*/

.title-wrap{
    width:100%;
    margin:30px 0 20px;
    border-bottom:1px solid var(--border-color);
}

.title-wrap h2{
    display:inline-block;
    position:relative;
    padding-bottom:10px;
    font-size:20px;
    font-weight:700;
}

.title-wrap h2::after{
    content:"";
    position:absolute;
    left:0;
    bottom:-1px;
    width:55px;
    height:3px;
    background:var(--accent-color);
}


/*==============================
  Loader
==============================*/

.loader{
    width:35px;
    height:35px;
    margin:auto;
    border-radius:50%;
    border:3px solid #ddd;
    border-top-color:var(--accent-color);
    animation:spin .8s linear infinite;
}


/*==============================
  Fade Animation
==============================*/

.fade-in{
    animation:fadeIn .5s ease;
}


/*==============================
  Keyframes
==============================*/

@keyframes spin{
    from{
        transform:rotate(0deg);
    }
    to{
        transform:rotate(360deg);
    }
}

@keyframes fadeIn{
    from{
        opacity:0;
        transform:translateY(20px);
    }
    to{
        opacity:1;
        transform:translateY(0);
    }
}

/*==================================================
  DoubtNest Theme
  Part 2 : Header / Navigation
==================================================*/

/*==============================
  Top Secondary Menu
==============================*/

.top-secondary-menu{
    width:100%;
    height:38px;
    background:var(--primary-color);
    box-shadow:0 1px 5px rgba(0,0,0,.15);
}

.top-secondary-menu .container{
    height:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.top-second-menu ul{
    display:flex;
    align-items:center;
    height:38px;
    overflow-x:auto;
    scrollbar-width:none;
}

.top-second-menu ul::-webkit-scrollbar{
    display:none;
}

.top-second-menu li{
    flex-shrink:0;
}

.top-second-menu a{
    display:block;
    height:38px;
    line-height:38px;
    margin-right:25px;
    color:#fff;
    font-size:14px;
    text-transform:capitalize;
    transition:var(--transition);
}

.top-second-menu a:hover{
    color:var(--accent-color);
}


/*==============================
  Header Wrapper
==============================*/

.header-wrapper,
#header-wrapper{
    width:100%;
    background:#fff;
    border-bottom:1px solid var(--border-color);
    box-shadow:0 2px 8px rgba(0,0,0,.08);
}

#header{
    padding:12px 0;
}


/*==============================
  Header Layout
==============================*/

.header-inner{
    min-height:80px;
    display:flex;
    align-items:center;
    justify-content:space-between;
}

.header-header .container,
.header-wrap,
.header-inner{
    display:flex;
    align-items:center;
}


/*==============================
  Logo
==============================*/

.logo,
.header-logo{
    display:flex;
    align-items:center;
}

.logo{
    font-size:28px;
    font-weight:800;
    color:var(--primary-color);
}

.logo span{
    color:var(--accent-color);
}

.header-logo img{
    display:block;
    max-width:100%;
    height:auto;
}


/*==============================
  Main Navigation
==============================*/

.main-menu,
#menu{
    display:flex;
    align-items:center;
    background:#fff;
}

.main-menu ul{
    display:flex;
    align-items:center;
    gap:25px;
}

.main-menu li{
    list-style:none;
}

.main-menu a,
#menu a{
    display:block;
    padding:8px 12px;
    color:var(--text-color);
    font-size:15px;
    font-weight:600;
    border-radius:6px;
    transition:var(--transition);
}

.main-menu a:hover,
#menu a:hover{
    background:#f3f4f6;
    color:#0969da;
}


/*==============================
  Right Header Area
==============================*/

.header-right{
    display:flex;
    align-items:center;
    gap:15px;
}


/*==============================
  Search Box
==============================*/

.search-form input,
.search-box input{
    width:100%;
    padding:8px 12px;
    border:1px solid #d0d7de;
    border-radius:6px;
    background:#fff;
    color:#24292f;
    transition:.2s;
}

.search-form input:focus,
.search-box input:focus{
    outline:none;
    border-color:#0969da;
    box-shadow:0 0 0 3px rgba(9,105,218,.15);
}


/*==============================
  Mobile Menu Button
==============================*/

.menu-toggle,
.slide-menu-toggle,
.mobile-menu{
    display:none;
    cursor:pointer;
    font-size:26px;
}


/*==============================
  Responsive Header
==============================*/

@media (max-width:980px){

    .header-inner{
        min-height:65px;
    }

    .main-menu,
    #main-menu{
        display:none;
    }

    .menu-toggle,
    .slide-menu-toggle,
    .mobile-menu{
        display:block;
    }

    .header-logo{
        width:100%;
        max-width:100%;
        text-align:center;
        padding:20px 0;
    }

    .header-logo img{
        margin:auto;
    }

    .top-secondary-menu .container{
        justify-content:center;
    }

    .header-right{
        width:100%;
        justify-content:space-between;
    }
}

@media (max-width:600px){

    .header-inner{
        padding:0 12px;
    }

    .top-second-menu a{
        margin-right:18px;
        font-size:13px;
    }
}

/*==================================================
  DoubtNest Theme
  Part 3 : Hero Slider
==================================================*/

/*==============================
  Hero Wrapper
==============================*/

.hero-wrapper{
    width:100%;
    padding:30px 0;
    background:#fff;
}


/*==============================
  Hero Slider
==============================*/

.hero-slider{
    position:relative;
    width:100%;
    height:520px;
    overflow:hidden;
    border-radius:20px;
    background:var(--light-bg);
}


/*==============================
  Hero Slides
==============================*/

.hero-slide{
    position:relative;
    width:100%;
    height:100%;
    display:none;
}

.hero-slide.active{
    display:block;
    animation:fadeIn .5s ease;
}


/*==============================
  Hero Image
==============================*/

.hero-image,
.hero-slide img{
    width:100%;
    height:100%;
    object-fit:cover;
}


/*==============================
  Hero Content Card
==============================*/

.hero-content{
    position:absolute;
    left:30px;
    bottom:30px;
    max-width:560px;
    padding:25px;
    background:#fff;
    border-radius:12px;
    box-shadow:var(--shadow);
    z-index:2;
}


/*==============================
  Hero Title
==============================*/

.hero-title{
    margin-bottom:10px;
    font-size:32px;
    font-weight:800;
    color:var(--primary-color);
    line-height:1.2;
}


/*==============================
  Hero Description
==============================*/

.hero-description{
    font-size:16px;
    line-height:1.7;
    color:var(--muted-text);
}


/*==============================
  Hero Buttons
==============================*/

.hero-buttons{
    display:flex;
    gap:15px;
    margin-top:20px;
    flex-wrap:wrap;
}

.hero-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:150px;
    height:46px;
    padding:0 24px;
    background:var(--primary-color);
    color:#fff;
    border-radius:30px;
    font-weight:700;
    transition:var(--transition);
}

.hero-button:hover{
    background:var(--accent-color);
    transform:translateY(-2px);
}


/*==============================
  Hero Card
==============================*/

.hero-card{
    width:95%;
    max-width:900px;
    margin:30px auto;
    overflow:hidden;
    background:#fff;
    border-radius:20px;
    box-shadow:0 10px 25px rgba(0,0,0,.12);
}

.hero-card img{
    display:block;
    width:100%;
}

.hero-card .hero-content{
    position:static;
    max-width:100%;
    padding:20px;
    text-align:center;
    box-shadow:none;
}


/*==============================
  Slider Controls
==============================*/

.slider-control{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    width:45px;
    height:45px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    border-radius:50%;
    box-shadow:var(--shadow);
    cursor:pointer;
    transition:var(--transition);
    z-index:5;
}

.slider-control:hover{
    background:var(--accent-color);
    color:#fff;
}

.slider-prev{
    left:15px;
}

.slider-next{
    right:15px;
}


/*==============================
  Slider Indicators (Optional)
==============================*/

.slider-dots{
    position:absolute;
    left:50%;
    bottom:18px;
    transform:translateX(-50%);
    display:flex;
    gap:8px;
}

.slider-dots span{
    width:10px;
    height:10px;
    border-radius:50%;
    background:rgba(255,255,255,.6);
    cursor:pointer;
    transition:.3s;
}

.slider-dots span.active{
    background:var(--accent-color);
}


/*==============================
  Responsive
==============================*/

@media (max-width:992px){

    .hero-slider{
        height:430px;
    }

    .hero-title{
        font-size:28px;
    }

    .hero-content{
        max-width:480px;
    }

}

@media (max-width:768px){

    .hero-slider{
        height:400px;
    }

    .hero-content{
        left:15px;
        right:15px;
        bottom:15px;
        max-width:none;
        padding:18px;
    }

    .hero-title{
        font-size:24px;
    }

    .hero-description{
        font-size:14px;
    }

    .hero-buttons{
        justify-content:center;
    }

    .hero-button{
        width:100%;
    }

}

@media (max-width:480px){

    .hero-slider{
        height:320px;
    }

    .hero-title{
        font-size:20px;
    }

    .hero-description{
        font-size:13px;
    }

}

/*==================================================
  DoubtNest Theme
  Part 4 : Features / Testimonials / Info Sections
==================================================*/


/*==============================
  Features Section
==============================*/

.features-section{
    padding:40px 0;
}

.features-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}

.feature-card{
    background:#fff;
    border-radius:12px;
    padding:22px;
    text-align:center;
    box-shadow:var(--shadow);
    transition:var(--transition);
}

.feature-card:hover{
    transform:translateY(-5px);
}

.feature-icon{
    width:60px;
    height:60px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--light-bg);
    color:var(--primary-color);
    border-radius:50%;
    font-size:26px;
}

.feature-title{
    margin-top:16px;
    font-size:18px;
    font-weight:700;
    color:var(--text-color);
}

.feature-description{
    margin-top:10px;
    color:var(--muted-text);
    font-size:14px;
    line-height:1.6;
}


/*==============================
  Important Features Buttons
==============================*/

.important-features{
    width:100%;
    min-height:95px;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    font-size:26px;
    font-weight:700;
    color:#a1187f;
}

.features-area{
    display:grid;
    grid-template-columns:repeat(3,minmax(90px,160px));
    justify-content:center;
    gap:15px;
    width:100%;
}

.feature-btn{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:60px;
    background:#166534;
    color:#fff;
    border-radius:16px;
    text-decoration:none;
    font-size:14px;
    font-weight:600;
    transition:var(--transition);
}

.feature-btn:hover{
    background:#14532d;
    transform:translateY(-2px);
}


/*==============================
  Testimonials
==============================*/

.testimonial-section{
    padding:50px 0;
}

.testimonial-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.testimonial-card{
    padding:25px;
    text-align:center;
    color:#fff;
    background:var(--primary-color);
    border-radius:15px;
    transition:var(--transition);
}

.testimonial-card:hover{
    transform:translateY(-4px);
}

.testimonial-avatar{
    width:75px;
    height:75px;
    margin:0 auto 15px;
    overflow:hidden;
    border-radius:50%;
    border:3px solid #fff;
}

.testimonial-avatar img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.testimonial-name{
    font-size:18px;
    font-weight:700;
}

.testimonial-role{
    margin-top:4px;
    font-size:13px;
    opacity:.8;
}

.testimonial-text{
    margin-top:18px;
    font-size:15px;
    line-height:1.7;
}

.testimonial-text::before{
    content:"“";
    color:var(--accent-color);
    font-size:38px;
}

.testimonial-text::after{
    content:"”";
    color:var(--accent-color);
    font-size:38px;
}


/*==============================
  Info Boxes
==============================*/

.info-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-top:35px;
}

.info-box{
    position:relative;
    height:280px;
    overflow:hidden;
    border-radius:15px;
}

.info-box img{
    width:100%;
    height:100%;
    object-fit:cover;
}

.info-content{
    position:absolute;
    left:50%;
    bottom:15px;
    transform:translateX(-50%);
    width:90%;
    background:#fff;
    border-radius:10px;
    padding:16px;
    text-align:center;
    box-shadow:var(--shadow);
}

.info-title{
    font-size:18px;
    font-weight:700;
    color:var(--text-color);
}

.info-text{
    margin-top:8px;
    color:var(--muted-text);
    font-size:14px;
}


/*==============================
  Full Width Box
==============================*/

.full-box{
    width:100%;
    min-height:120px;
    background:#fff;
    padding:20px;
    border-radius:12px;
    box-shadow:var(--shadow);
}


/*==============================
  Section Heading
==============================*/

.section-title{
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
    margin:35px 0;
    font-size:24px;
    font-weight:700;
    color:#a1187f;
}

.section-title::before{
    content:"";
    position:absolute;
    left:0;
    right:170px;
    height:2px;
    background:#4f46e5;
}

.section-title span{
    position:relative;
    z-index:2;
    padding:10px 22px;
    border-radius:0 16px 16px 0;
    background:#4f46e5;
    color:#fff;
}


/*==============================
  Responsive
==============================*/

@media(max-width:992px){

    .features-grid{
        grid-template-columns:repeat(2,1fr);
    }

    .testimonial-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .features-grid,
    .testimonial-grid,
    .info-grid,
    .features-area{
        grid-template-columns:1fr;
    }

    .important-features{
        font-size:22px;
    }

    .feature-btn{
        font-size:15px;
    }

    .section-title{
        font-size:20px;
    }

}

@media(max-width:480px){

    .feature-card,
    .testimonial-card{
        padding:18px;
    }

    .info-box{
        height:220px;
    }

}

/*==================================================
  DoubtNest Theme
  Part 5 : Blog / Posts / Sidebar
==================================================*/


/*==============================
  Blog Section
==============================*/

.posts-section{
    padding:40px 0;
}


/*==============================
  Posts Grid
==============================*/

.posts-grid,
.grid-posts{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:20px;
}


/*==============================
  Blog Card
==============================*/

.post-card,
.index-post{
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    overflow:hidden;
    box-shadow:var(--shadow);
    transition:var(--transition);
}

.post-card:hover,
.index-post:hover{
    transform:translateY(-5px);
    border-color:#0969da;
}


/*==============================
  Featured Image
==============================*/

.post-image,
.post-image-wrap{
    position:relative;
    overflow:hidden;
    width:100%;
    height:220px;
}

.post-image img,
.post-image-wrap img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:.35s;
}

.post-card:hover .post-image img,
.index-post:hover .post-image-wrap img{
    transform:scale(1.05);
}


/*==============================
  Post Content
==============================*/

.post-content,
.product-info{
    padding:18px;
}

.post-category{
    display:inline-block;
    padding:5px 12px;
    background:var(--accent-color);
    color:#fff;
    border-radius:20px;
    font-size:12px;
    text-transform:uppercase;
    font-weight:600;
}


/*==============================
  Post Title
==============================*/

.post-title{
    margin-top:12px;
    font-size:18px;
    font-weight:700;
    line-height:1.4;
}

.post-title a{
    color:var(--text-color);
    transition:var(--transition);
}

.post-title a:hover{
    color:#0969da;
}


/*==============================
  Post Meta
==============================*/

.post-meta,
.meta-price{
    margin-top:10px;
    font-size:13px;
    color:var(--muted-text);
}


/*==============================
  Description
==============================*/

.post-description{
    margin-top:12px;
    color:var(--muted-text);
    font-size:14px;
    line-height:1.6;
}


/*==============================
  Main Layout
==============================*/

.content-layout{
    display:grid;
    grid-template-columns:1fr 300px;
    gap:30px;
}


/*==============================
  Sidebar
==============================*/

.sidebar{
    background:#fff;
    border-radius:12px;
    box-shadow:var(--shadow);
}

.sidebar .widget{
    margin-bottom:20px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    overflow:hidden;
}

.sidebar-title,
.sidebar .widget-title{
    padding:14px 18px;
    font-size:17px;
    font-weight:700;
    border-bottom:1px solid var(--border-color);
    color:var(--text-color);
}

.sidebar .widget-content{
    padding:18px;
}


/*==============================
  Sidebar List
==============================*/

.sidebar ul{
    margin:0;
    padding:0;
}

.sidebar li{
    border-bottom:1px solid var(--border-color);
}

.sidebar li:last-child{
    border-bottom:none;
}

.sidebar li a{
    display:block;
    padding:12px 0;
    color:var(--text-color);
    transition:var(--transition);
}

.sidebar li a:hover{
    color:#0969da;
    padding-left:6px;
}


/*==============================
  Labels / Tags
==============================*/

.label,
.post-labels a{
    display:inline-block;
    padding:5px 10px;
    margin:3px;
    background:#ddf4ff;
    color:#0969da;
    border-radius:20px;
    font-size:12px;
    font-weight:600;
    transition:var(--transition);
}

.label:hover,
.post-labels a:hover{
    background:#0969da;
    color:#fff;
}


/*==============================
  Repository Style Cards
==============================*/

.repo-card{
    padding:18px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    transition:var(--transition);
}

.repo-card:hover{
    border-color:#0969da;
}

.repo-card h3{
    margin-bottom:8px;
}

.repo-card h3 a{
    color:#0969da;
    text-decoration:none;
}

.repo-card h3 a:hover{
    text-decoration:underline;
}

.repo-description{
    color:var(--muted-text);
    font-size:14px;
}


/*==============================
  Pagination
==============================*/

.blog-pager{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin:35px 0;
}

.blog-pager a,
.blog-pager span{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:36px;
    height:36px;
    padding:0 12px;
    border:1px solid var(--border-color);
    border-radius:8px;
    background:#fff;
    color:var(--text-color);
    font-weight:600;
    transition:var(--transition);
}

.blog-pager a:hover,
.blog-pager .page-active{
    background:#0077cc;
    color:#fff;
    border-color:#0077cc;
}


/*==============================
  Responsive
==============================*/

@media(max-width:992px){

    .posts-grid,
    .grid-posts{
        grid-template-columns:repeat(2,1fr);
    }

    .content-layout{
        grid-template-columns:1fr;
    }

}

@media(max-width:768px){

    .posts-grid,
    .grid-posts{
        grid-template-columns:1fr;
    }

    .post-image,
    .post-image-wrap{
        height:200px;
    }

}

@media(max-width:480px){

    .post-content,
    .product-info{
        padding:15px;
    }

    .post-title{
        font-size:16px;
    }

}

/*==================================================
  DoubtNest Theme
  Part 6 : Product Page
==================================================*/


/*==============================
  Product Layout
==============================*/

.product-post{
    position:relative;
    width:100%;
}

.product-post .post-content{
    position:relative;
    width:100%;
    float:left;
    margin:0;
}

.item-post .post-outer{
    padding:0;
}

.item-post .post-body{
    float:left;
    width:100%;
    margin:0 0 30px;
    padding:20px;
    overflow:hidden;
    box-sizing:border-box;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    font-size:15px;
    line-height:1.7;
}


/*==============================
  Product Header
==============================*/

.product-header{
    padding:24px;
    margin-bottom:25px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    box-shadow:var(--shadow);
}


/*==============================
  Product Title
==============================*/

.product-post h1.post-title{
    margin-bottom:15px;
    padding-bottom:15px;
    border-bottom:1px solid #d8dee4;
    color:#1f2328;
    font-size:30px;
    font-weight:700;
    line-height:1.4;
}


/*==============================
  Product Meta
==============================*/

.product-meta{
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:12px;
    color:var(--muted-text);
    font-size:14px;
}


/*==============================
  Product Image
==============================*/

.product-image,
.product-image-wrap{
    overflow:hidden;
    border-radius:12px;
}

.product-image img,
.product-image-wrap img{
    width:100%;
    display:block;
    object-fit:cover;
    transition:.3s;
}

.product-image:hover img{
    transform:scale(1.04);
}


/*==============================
  Price
==============================*/

.item_price{
    font-size:28px;
    font-weight:700;
    color:#1f883d;
}

.item_oldprice{
    margin-left:10px;
    color:#8c959f;
    text-decoration:line-through;
    font-size:18px;
}


/*==============================
  Product Description
==============================*/

.product-description{
    margin-top:20px;
    color:var(--muted-text);
    line-height:1.8;
}


/*==============================
  Size Dropdown
==============================*/

.item_size{
    width:100%;
    padding:10px 40px 10px 12px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:8px;
    color:#24292f;
    appearance:none;
    -webkit-appearance:none;
    cursor:pointer;
    transition:var(--transition);
}

.item_size:hover{
    border-color:#8c959f;
}

.item_size:focus{
    outline:none;
    border-color:#0969da;
    box-shadow:0 0 0 3px rgba(9,105,218,.15);
}

.item_size option{
    background:#fff;
    color:#24292f;
}


/*==============================
  Buy Buttons
==============================*/

.sora-product-buy-buttons{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    margin-top:25px;
}

.sora-product-buy-buttons a,
.item_add{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:170px;
    height:46px;
    padding:0 20px;
    background:#24292f;
    color:#fff;
    border:1px solid rgba(31,35,40,.15);
    border-radius:8px;
    font-weight:600;
    transition:var(--transition);
}

.sora-product-buy-buttons a:hover,
.item_add:hover{
    background:#0969da;
}


/*==============================
  Bookmark / Love Button
==============================*/

.bookmark-button,
.sora-love,
.loveit-toggle{
    width:42px;
    height:42px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#fff;
    color:#57606a;
    border:1px solid #d0d7de;
    border-radius:50%;
    cursor:pointer;
    transition:var(--transition);
}

.bookmark-button:hover,
.sora-love:hover,
.loveit-toggle:hover{
    color:#0969da;
    border-color:#0969da;
}

.bookmark-button.active,
.loved .sora-love.unlike{
    background:#cf222e;
    color:#fff;
    border-color:#cf222e;
}


/*==============================
  Love Popup
==============================*/

#loveit-wrap{
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:10px;
    box-shadow:0 8px 24px rgba(140,149,159,.2);
}

.loveit-inner{
    padding:18px;
}

.loveit-item{
    padding:12px 0;
    border-bottom:1px solid #d8dee4;
}

.loveit-item:last-child{
    border-bottom:none;
}

.loveit-item .entry-title{
    color:#24292f;
}

.loveit-item:hover .entry-title{
    color:#0969da;
}


/*==============================
  Product Tags
==============================*/

.post-labels{
    margin:30px 0;
}

.post-labels span{
    font-weight:700;
}

.post-labels a{
    color:#0969da;
    transition:var(--transition);
}

.post-labels a:hover{
    text-decoration:underline;
}


/*==============================
  Responsive
==============================*/

@media(max-width:768px){

    .product-header{
        padding:18px;
    }

    .product-post h1.post-title{
        font-size:24px;
    }

    .item_price{
        font-size:24px;
    }

    .sora-product-buy-buttons{
        flex-direction:column;
    }

    .sora-product-buy-buttons a,
    .item_add{
        width:100%;
    }

}

/*==================================================
  DoubtNest Theme
  Part 7 : Comments / Share / Navigation
==================================================*/


/*==============================
  Share Buttons
==============================*/

.post-share{
    margin:35px 0;
    padding:20px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
}

.post-share h3{
    margin-bottom:15px;
    font-size:18px;
    font-weight:700;
}

.share-links{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}

.share-links a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-width:42px;
    height:42px;
    padding:0 16px;
    border-radius:8px;
    background:#f6f8fa;
    color:#24292f;
    border:1px solid #d0d7de;
    transition:var(--transition);
}

.share-links a:hover{
    background:#0969da;
    color:#fff;
    border-color:#0969da;
}


/*==============================
  Author Box
==============================*/

.author-box{
    display:flex;
    align-items:center;
    gap:20px;
    margin:35px 0;
    padding:20px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
}

.author-box img{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:cover; /* fixed */
}

.author-info{
    flex:1;
}

.author-info h3{
    margin-bottom:8px;
    font-size:20px;
    font-weight:700;
}

.author-info p{
    color:var(--muted-text);
    line-height:1.7;
}


/*==============================
  Post Navigation
==============================*/

.post-nav{
    display:flex;
    justify-content:space-between;
    gap:20px;
    margin:35px 0;
}

.post-nav a{
    flex:1;
    padding:18px;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:10px;
    color:#24292f;
    transition:var(--transition);
}

.post-nav a:hover{
    border-color:#0969da;
    color:#0969da;
}

.post-nav .nav-label{
    display:block;
    margin-bottom:8px;
    font-size:12px;
    text-transform:uppercase;
    color:#8c959f;
    font-weight:600;
}

.post-nav .nav-title{
    font-size:15px;
    font-weight:600;
    line-height:1.5;
}


/*==============================
  Related Posts
==============================*/

.related-posts{
    margin:45px 0;
}

.related-title{
    margin-bottom:20px;
    font-size:22px;
    font-weight:700;
}

.related-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px;
}

.related-card{
    overflow:hidden;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    transition:var(--transition);
}

.related-card:hover{
    transform:translateY(-4px);
    border-color:#0969da;
}

.related-card img{
    width:100%;
    height:190px;
    object-fit:cover;
}

.related-content{
    padding:16px;
}

.related-content h3{
    font-size:16px;
    line-height:1.5;
}

.related-content h3 a{
    color:#24292f;
}

.related-content h3 a:hover{
    color:#0969da;
}


/*==============================
  Tags
==============================*/

.tags-wrapper{
    margin:30px 0;
}

.tags-wrapper a{
    display:inline-block;
    margin:5px;
    padding:8px 14px;
    background:#ddf4ff;
    color:#0969da;
    border-radius:30px;
    font-size:13px;
    transition:var(--transition);
}

.tags-wrapper a:hover{
    background:#0969da;
    color:#fff;
}


/*==============================
  Comments
==============================*/

.comments{
    margin:45px 0;
}

.comments h3{
    margin-bottom:20px;
    font-size:22px;
}

.comment{
    display:flex;
    gap:15px;
    margin-bottom:25px;
    padding-bottom:25px;
    border-bottom:1px solid #d8dee4;
}

.comment:last-child{
    border-bottom:none;
}

.comment-avatar img{
    width:55px;
    height:55px;
    border-radius:50%;
    object-fit:cover;
}

.comment-body{
    flex:1;
}

.comment-author{
    font-weight:700;
}

.comment-date{
    margin-top:3px;
    color:#8c959f;
    font-size:13px;
}

.comment-text{
    margin-top:10px;
    line-height:1.7;
}


/*==============================
  Comment Form
==============================*/

.comment-form input,
.comment-form textarea{
    width:100%;
    margin-bottom:15px;
    padding:12px 14px;
    border:1px solid #d0d7de;
    border-radius:8px;
    transition:var(--transition);
}

.comment-form textarea{
    min-height:140px;
    resize:vertical;
}

.comment-form input:focus,
.comment-form textarea:focus{
    outline:none;
    border-color:#0969da;
    box-shadow:0 0 0 3px rgba(9,105,218,.15);
}

.comment-form button{
    padding:12px 24px;
    background:#24292f;
    color:#fff;
    border:none;
    border-radius:8px;
    cursor:pointer;
    transition:var(--transition);
}

.comment-form button:hover{
    background:#0969da;
}


/*==============================
  Responsive
==============================*/

@media(max-width:768px){

    .author-box{
        flex-direction:column;
        text-align:center;
    }

    .post-nav{
        flex-direction:column;
    }

    .related-grid{
        grid-template-columns:1fr;
    }

    .comment{
        flex-direction:column;
    }

}

/*==================================================
  DoubtNest Theme
  Part 8 : Footer / Back To Top / Error Page
==================================================*/


/*==============================
  Footer
==============================*/

#footer-wrapper,
.footer-wrapper{
    width:100%;
    margin-top:50px;
    background:#161b22;
    color:#c9d1d9;
}

.footer-inner{
    padding:50px 0;
}

.footer-grid{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:30px;
}


/*==============================
  Footer Widgets
==============================*/

.footer-widget{
    width:100%;
}

.footer-widget-title{
    margin-bottom:20px;
    color:#fff;
    font-size:20px;
    font-weight:700;
    position:relative;
}

.footer-widget-title::after{
    content:"";
    display:block;
    width:45px;
    height:3px;
    margin-top:8px;
    background:#0969da;
}

.footer-widget p{
    color:#8b949e;
    line-height:1.8;
}


/*==============================
  Footer Links
==============================*/

.footer-links{
    margin:0;
    padding:0;
    list-style:none;
}

.footer-links li{
    margin-bottom:10px;
}

.footer-links a{
    color:#c9d1d9;
    transition:var(--transition);
}

.footer-links a:hover{
    color:#58a6ff;
    padding-left:5px;
}


/*==============================
  Newsletter
==============================*/

.newsletter{
    margin-top:20px;
}

.newsletter input{
    width:100%;
    padding:12px 15px;
    margin-bottom:12px;
    border:1px solid #30363d;
    border-radius:8px;
    background:#0d1117;
    color:#fff;
}

.newsletter input:focus{
    outline:none;
    border-color:#58a6ff;
}

.newsletter button{
    width:100%;
    padding:12px;
    border:none;
    border-radius:8px;
    background:#238636;
    color:#fff;
    font-weight:600;
    cursor:pointer;
    transition:var(--transition);
}

.newsletter button:hover{
    background:#2ea043;
}


/*==============================
  Footer Social Icons
==============================*/

.footer-social{
    display:flex;
    gap:10px;
    margin-top:20px;
}

.footer-social a{
    width:40px;
    height:40px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#21262d;
    color:#fff;
    transition:var(--transition);
}

.footer-social a:hover{
    background:#0969da;
}


/*==============================
  Sub Footer
==============================*/

#sub-footer-wrapper,
.sub-footer{
    border-top:1px solid #30363d;
    background:#0d1117;
}

.sub-footer-inner{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding:18px 0;
    color:#8b949e;
    font-size:14px;
}

.sub-footer a{
    color:#58a6ff;
}

.sub-footer a:hover{
    text-decoration:underline;
}


/*==============================
  Back To Top
==============================*/

.back-top,
.back-to-top{
    position:fixed;
    right:25px;
    bottom:25px;
    width:48px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#0969da;
    color:#fff;
    cursor:pointer;
    opacity:0;
    visibility:hidden;
    box-shadow:var(--shadow);
    transition:var(--transition);
    z-index:999;
}

.back-top.show,
.back-to-top.show{
    opacity:1;
    visibility:visible;
}

.back-top:hover,
.back-to-top:hover{
    background:#0550ae;
    transform:translateY(-3px);
}


/*==============================
  Error Page
==============================*/

.errorWrap{
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    min-height:70vh;
    text-align:center;
    padding:40px 20px;
}

.errorWrap h1{
    margin-bottom:10px;
    font-size:110px;
    font-weight:800;
    color:#cf222e;
}

.errorWrap h2{
    margin-bottom:15px;
    font-size:32px;
}

.errorWrap p{
    max-width:600px;
    color:var(--muted-text);
    line-height:1.8;
}

.errorWrap .home-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-top:25px;
    padding:12px 28px;
    background:#0969da;
    color:#fff;
    border-radius:8px;
    transition:var(--transition);
}

.errorWrap .home-btn:hover{
    background:#0550ae;
}


/*==============================
  Responsive
==============================*/

@media(max-width:992px){

    .footer-grid{
        grid-template-columns:repeat(2,1fr);
    }

}

@media(max-width:768px){

    .footer-grid{
        grid-template-columns:1fr;
    }

    .sub-footer-inner{
        flex-direction:column;
        gap:12px;
        text-align:center;
    }

}

@media(max-width:480px){

    .errorWrap h1{
        font-size:72px;
    }

    .errorWrap h2{
        font-size:24px;
    }

    .back-top,
    .back-to-top{
        width:42px;
        height:42px;
        right:15px;
        bottom:15px;
    }

}

/*==================================================
  DoubtNest Theme
  Part 9 : GitHub Theme Overrides
==================================================*/


/*==============================
  GitHub Container
==============================*/

.github-theme{
    background:#ffffff;
    color:#24292f;
    font-size:16px;
    line-height:1.7;
}


/*==============================
  Typography
==============================*/

.github-theme h1,
.github-theme h2,
.github-theme h3,
.github-theme h4,
.github-theme h5,
.github-theme h6{
    margin:1.5em 0 .75em;
    font-weight:600;
    line-height:1.25;
    color:#24292f;
}

.github-theme h1{
    font-size:2em;
    padding-bottom:.3em;
    border-bottom:1px solid #d8dee4;
}

.github-theme h2{
    font-size:1.5em;
    padding-bottom:.3em;
    border-bottom:1px solid #d8dee4;
}

.github-theme h3{
    font-size:1.25em;
}

.github-theme p{
    margin:0 0 16px;
}

.github-theme strong{
    font-weight:600;
}

.github-theme em{
    font-style:italic;
}


/*==============================
  Links
==============================*/

.github-theme a{
    color:#0969da;
    text-decoration:none;
}

.github-theme a:hover{
    text-decoration:underline;
}


/*==============================
  Lists
==============================*/

.github-theme ul,
.github-theme ol{
    margin:0 0 16px 24px;
}

.github-theme li{
    margin:4px 0;
}


/*==============================
  Blockquotes
==============================*/

.github-theme blockquote{
    margin:16px 0;
    padding:0 16px;
    color:#57606a;
    border-left:4px solid #d0d7de;
}


/*==============================
  Inline Code
==============================*/

.github-theme code{
    padding:.2em .4em;
    background:#f6f8fa;
    border-radius:6px;
    font-size:85%;
    font-family:Consolas,Monaco,monospace;
}


/*==============================
  Code Blocks
==============================*/

.github-theme pre{
    overflow:auto;
    margin:16px 0;
    padding:16px;
    background:#0d1117;
    border-radius:8px;
}

.github-theme pre code{
    padding:0;
    background:none;
    color:#e6edf3;
}


/*==============================
  Tables
==============================*/

.github-theme table{
    width:100%;
    border-collapse:collapse;
    margin:20px 0;
}

.github-theme th,
.github-theme td{
    padding:10px 14px;
    border:1px solid #d0d7de;
}

.github-theme th{
    background:#f6f8fa;
    font-weight:600;
}


/*==============================
  Images
==============================*/

.github-theme img{
    display:block;
    max-width:100%;
    height:auto;
    border-radius:8px;
}


/*==============================
  Horizontal Rule
==============================*/

.github-theme hr{
    height:1px;
    margin:24px 0;
    background:#d8dee4;
    border:none;
}


/*==============================
  Repository Card
==============================*/

.repo-box{
    padding:20px;
    margin:20px 0;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    transition:var(--transition);
}

.repo-box:hover{
    border-color:#0969da;
}

.repo-box h3{
    margin-bottom:8px;
}

.repo-box p{
    color:#57606a;
}


/*==============================
  Repository Stats
==============================*/

.repo-stats{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin-top:15px;
    color:#57606a;
    font-size:14px;
}


/*==============================
  Profile Card
==============================*/

.profile-card{
    display:flex;
    align-items:center;
    gap:18px;
    padding:20px;
    margin:20px 0;
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
}

.profile-card img{
    width:90px;
    height:90px;
    border-radius:50%;
    object-fit:cover;
}

.profile-info h3{
    margin:0 0 8px;
}

.profile-info p{
    color:#57606a;
}


/*==============================
  Badges
==============================*/

.badge{
    display:inline-block;
    padding:4px 10px;
    border-radius:20px;
    background:#ddf4ff;
    color:#0969da;
    font-size:12px;
    font-weight:600;
}


/*==============================
  Alerts
==============================*/

.alert{
    padding:16px;
    margin:20px 0;
    border-left:4px solid #0969da;
    background:#ddf4ff;
    border-radius:6px;
}

.alert-success{
    border-color:#1a7f37;
    background:#dafbe1;
}

.alert-warning{
    border-color:#bf8700;
    background:#fff8c5;
}

.alert-danger{
    border-color:#cf222e;
    background:#ffebe9;
}


/*==============================
  Forms
==============================*/

.github-theme input,
.github-theme textarea,
.github-theme select{
    width:100%;
    padding:10px 12px;
    border:1px solid #d0d7de;
    border-radius:6px;
    background:#fff;
    transition:.2s;
}

.github-theme input:focus,
.github-theme textarea:focus,
.github-theme select:focus{
    outline:none;
    border-color:#0969da;
    box-shadow:0 0 0 3px rgba(9,105,218,.15);
}

.github-theme button{
    padding:10px 18px;
    background:#2da44e;
    color:#fff;
    border:none;
    border-radius:6px;
    cursor:pointer;
    transition:.2s;
}

.github-theme button:hover{
    background:#218bff;
}


/*==============================
  Responsive
==============================*/

@media(max-width:768px){

    .profile-card{
        flex-direction:column;
        text-align:center;
    }

    .repo-stats{
        gap:10px;
    }

    .github-theme table{
        display:block;
        overflow-x:auto;
    }

}

/*==================================================
  DoubtNest Theme
  Part 10 : Utilities / Animations / Final Cleanup
==================================================*/


/*==============================
  Utility Classes
==============================*/

.d-flex{
    display:flex;
}

.d-grid{
    display:grid;
}

.align-center{
    align-items:center;
}

.justify-center{
    justify-content:center;
}

.justify-between{
    justify-content:space-between;
}

.flex-wrap{
    flex-wrap:wrap;
}

.w-100{
    width:100%;
}

.h-100{
    height:100%;
}

.text-left{
    text-align:left;
}

.text-center{
    text-align:center;
}

.text-right{
    text-align:right;
}

.rounded{
    border-radius:12px;
}

.shadow{
    box-shadow:var(--shadow);
}

.hidden{
    display:none!important;
}


/*==============================
  Margin Helpers
==============================*/

.mt-10{margin-top:10px;}
.mt-20{margin-top:20px;}
.mt-30{margin-top:30px;}
.mt-40{margin-top:40px;}

.mb-10{margin-bottom:10px;}
.mb-20{margin-bottom:20px;}
.mb-30{margin-bottom:30px;}
.mb-40{margin-bottom:40px;}


/*==============================
  Padding Helpers
==============================*/

.p-10{padding:10px;}
.p-20{padding:20px;}
.p-30{padding:30px;}


/*==============================
  Common Buttons
==============================*/

.btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    padding:12px 22px;
    border:none;
    border-radius:8px;
    cursor:pointer;
    font-weight:600;
    text-decoration:none;
    transition:var(--transition);
}

.btn-primary{
    background:#0969da;
    color:#fff;
}

.btn-primary:hover{
    background:#0550ae;
}

.btn-success{
    background:#1a7f37;
    color:#fff;
}

.btn-success:hover{
    background:#116329;
}

.btn-outline{
    background:#fff;
    color:#24292f;
    border:1px solid #d0d7de;
}

.btn-outline:hover{
    border-color:#0969da;
    color:#0969da;
}


/*==============================
  Cards
==============================*/

.box{
    background:#fff;
    border:1px solid #d0d7de;
    border-radius:12px;
    box-shadow:var(--shadow);
}


/*==============================
  Transitions
==============================*/

.transition{
    transition:var(--transition);
}


/*==============================
  Animations
==============================*/

.fade{
    animation:fade .4s ease;
}

.slide-up{
    animation:slideUp .4s ease;
}

.zoom{
    animation:zoom .3s ease;
}


/*==============================
  Keyframes
==============================*/

@keyframes fade{

    from{
        opacity:0;
    }

    to{
        opacity:1;
    }

}

@keyframes slideUp{

    from{
        opacity:0;
        transform:translateY(25px);
    }

    to{
        opacity:1;
        transform:translateY(0);
    }

}

@keyframes zoom{

    from{
        opacity:0;
        transform:scale(.95);
    }

    to{
        opacity:1;
        transform:scale(1);
    }

}


/*==============================
  Scrollbar
==============================*/

::-webkit-scrollbar{
    width:10px;
}

::-webkit-scrollbar-track{
    background:#f6f8fa;
}

::-webkit-scrollbar-thumb{
    background:#c1c7d0;
    border-radius:10px;
}

::-webkit-scrollbar-thumb:hover{
    background:#8c959f;
}


/*==============================
  Selection
==============================*/

::selection{
    background:#0969da;
    color:#fff;
}


/*==============================
  Focus Accessibility
==============================*/

a:focus,
button:focus,
input:focus,
textarea:focus,
select:focus{
    outline:2px solid #0969da;
    outline-offset:2px;
}


/*==============================
  Print
==============================*/

@media print{

    .header-wrapper,
    .top-secondary-menu,
    .footer-wrapper,
    .back-top,
    .back-to-top,
    .share-links,
    .comment-form{
        display:none!important;
    }

    body{
        background:#fff;
        color:#000;
    }

}


/*==============================
  Final Responsive
==============================*/

@media(max-width:1200px){

    .container{
        width:95%;
    }

}

@media(max-width:992px){

    .container{
        width:94%;
    }

}

@media(max-width:768px){

    body{
        font-size:15px;
    }

    .container{
        width:92%;
    }

}

@media(max-width:480px){

    body{
        font-size:14px;
    }

    .container{
        width:90%;
    }

}

/*=====================================
  Typography & ShortCodes
=====================================*/

.firstcharacter{
    float:left;
    color:#27ae60;
    font-size:75px;
    line-height:60px;
    padding-right:8px;
}

.post-body p{
    margin-bottom:25px;
}

.post-body h1,
.post-body h2,
.post-body h3,
.post-body h4,
.post-body h5,
.post-body h6{
    color:#000;
    line-height:1.3em;
    margin:0 0 20px;
}

.post-body img{
    height:auto!important;
}


/*=====================================
  Blockquote
=====================================*/

blockquote{
    position:relative;
    background-color:rgba(155,155,155,.05);
    color:#000;
    font-style:normal;
    padding:20px 25px;
    margin:0;
    border-radius:3px;
}

blockquote:before{
    position:absolute;
    left:10px;
    top:10px;
    content:'\f10e';
    font-family:'Font Awesome 5 Free';
    font-size:33px;
    font-style:normal;
    font-weight:900;
    color:#000;
    line-height:1;
    opacity:.05;
    margin:0;
}


/*=====================================
  Responsive Video
=====================================*/

.post-body .responsive-video-wrap{
    position:relative;
    width:100%;
    padding:0;
    padding-top:56%;
}

.post-body .responsive-video-wrap iframe{
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

/*=====================================
  Lists
=====================================*/

.post-body ul{
    padding:0 0 0 15px;
    margin:10px 0;
}

.post-body li{
    margin:5px 0;
    padding:0;
}

.post-body ul li,
.post-body ol ul li{
    list-style:none;
}

.post-body ul li:before{
    display:inline-block;
    content:'\2022';
    margin:0 5px 0 0;
}

.post-body ol{
    counter-reset:ify;
    padding:0 0 0 15px;
    margin:10px 0;
}

.post-body ol > li{
    counter-increment:ify;
    list-style:none;
}

.post-body ol > li:before{
    display:inline-block;
    content:counters(ify,'.')'.';
    margin:0 5px 0 0;
}


/*=====================================
  Text Formatting
=====================================*/

.post-body u{
    text-decoration:underline;
}

.post-body strike{
    text-decoration:line-through;
}

.post-body sup{
    vertical-align:super;
}


/*=====================================
  Links
=====================================*/

.post-body a{

}

.post-body a:hover{

}


/*=====================================
  Buttons
=====================================*/

.post-body a.button{
    display:inline-block;
    height:34px;
    background-color:#2c3e50;
    font-size:14px;
    color:#ffffff;
    font-weight:400;
    line-height:34px;
    text-align:center;
    text-decoration:none;
    cursor:pointer;
    padding:0 20px;
    margin:0 6px 8px 0;
}

.post-body a.colored-button{
    color:#fff;
}

.post-body a.button:hover{
    background-color:#f47500;
    color:#fff;
}

.post-body a.colored-button:hover{
    background-color:#f47500!important;
    color:#fff!important;
}


/*=====================================
  Button Icons
=====================================*/

.button:before{
    float:left;
    font-family:'Font Awesome 5 Free';
    font-weight:900;
    display:inline-block;
    margin:0 8px 0 0;
}

.button.preview:before{
    content:'\f06e';
}

.button.download:before{
    content:'\f019';
}

.button.link:before{
    content:'\f0c1';
}

.button.cart:before{
    content:'\f07a';
}

.button.info:before{
    content:'\f06a';
}

.button.share:before{
    content:'\f1e0';
}

.button.contact:before{
    content:'\f0e0';
    font-weight:400;
}

/*=====================================
  Alert Messages
=====================================*/

.alert-message{
    position:relative;
    display:block;
    padding:15px;
    border:1px solid rgba(155,155,155,.1);
    border-radius:3px;
}

.alert-message.alert-success{
    background-color:rgba(34,245,121,.03);
    border:1px solid rgba(34,245,121,.5);
}

.alert-message.alert-info{
    background-color:rgba(55,153,220,.03);
    border:1px solid rgba(55,153,220,.5);
}

.alert-message.alert-warning{
    background-color:rgba(185,139,61,.03);
    border:1px solid rgba(185,139,61,.5);
}

.alert-message.alert-error{
    background-color:rgba(231,76,60,.03);
    border:1px solid rgba(231,76,60,.5);
}

.alert-message:before{
    font-family:'Font Awesome 5 Free';
    font-size:16px;
    font-weight:900;
    display:inline-block;
    margin:0 5px 0 0;
}

.alert-message.alert-success:before{
    content:'\f058';
    color:rgba(34,245,121,1);
}

.alert-message.alert-info:before{
    content:'\f05a';
    color:rgba(55,153,220,1);
}

.alert-message.alert-warning:before{
    content:'\f06a';
    color:rgba(185,139,61,1);
}

.alert-message.alert-error:before{
    content:'\f057';
    color:rgba(231,76,60,1);
}


/*=====================================
  Tables
=====================================*/

.post-body table{
    width:100%;
    overflow-x:auto;
    text-align:left;
    margin:0;
    border-collapse:collapse;
    border:1px solid #161619;
}

.post-body table td,
.post-body table th{
    padding:7px 15px;
    border:1px solid #161619;
}

.post-body table thead th{
    color:#000;
    font-weight:700;
    text-align:left;
    vertical-align:bottom;
}


/*=====================================
  Blogger Image Caption Tables
=====================================*/

table.tr-caption-container,
table.tr-caption-container td,
table.tr-caption-container th{
    line-height:1;
    padding:0;
    border:0;
}

table.tr-caption-container td.tr-caption{
    font-size:13px;
    color:#666666;
    padding:6px 0 0;
}

/*=====================================
  Table of Contents (TOC)
=====================================*/

.tocify-wrap{
    display:flex;
    width:100%;
    clear:both;
    margin:0;
}

.tocify-inner{
    position:relative;
    max-width:100%;
    display:flex;
    flex-direction:column;
    overflow:hidden;
    background-color:rgba(155,155,155,.05);
    color:#000;
    font-size:14px;
    line-height:1.6em;
    border:1px solid rgba(155,155,155,.1);
    border-radius:3px;
}

.tocify-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:12px 15px;
    font-size:16px;
    font-weight:700;
    cursor:pointer;
    border-bottom:1px solid rgba(155,155,155,.1);
}

.tocify-title-text{
    flex:1;
}

.tocify-title i{
    font-size:14px;
    transition:.3s ease;
}

.tocify-content{
    padding:15px;
}

.tocify-content ul{
    margin:0;
    padding-left:18px;
}

.tocify-content li{
    margin:6px 0;
    line-height:1.6;
}

.tocify-content a{
    color:#2c3e50;
    text-decoration:none;
    transition:.3s ease;
}

.tocify-content a:hover{
    color:#f47500;
}

.tocify-content ul ul{
    margin-top:5px;
    padding-left:18px;
}

/*=====================================
  Table of Contents (TOC)
=====================================*/

.tocify-wrap{
    display:flex;
    width:100%;
    clear:both;
    margin:0;
}

.tocify-inner{
    position:relative;
    display:flex;
    flex-direction:column;
    max-width:100%;
    overflow:hidden;
    background:rgba(155,155,155,.05);
    color:#000;
    font-size:14px;
    line-height:1.6;
    border:1px solid rgba(155,155,155,.1);
    border-radius:3px;
}

a.tocify-title{
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:relative;
    height:38px;
    padding:0 15px;
    margin:0;
    color:#000;
    font-size:16px;
    font-weight:700;
    text-decoration:none;
}

.tocify-title-text{
    display:flex;
    align-items:center;
}

.tocify-title-text::before{
    content:"\f0cb";
    font-family:"Font Awesome 5 Free";
    font-weight:900;
    font-size:14px;
    margin-right:6px;
}

.tocify-title::after{
    content:"\f078";
    font-family:"Font Awesome 5 Free";
    font-weight:900;
    font-size:12px;
    margin-left:25px;
}

.tocify-title.is-expanded::after{
    content:"\f077";
}

a.tocify-title:hover{
    text-decoration:none;
}

#tocify{
    display:none;
    padding:0 15px 10px;
    margin:0;
}

#tocify ol{
    margin:0;
    padding-left:15px;
}

#tocify li{
    margin:8px 0;
    font-size:14px;
}

#tocify li a{
    color:#f47500;
    text-decoration:none;
}

#tocify li a:hover{
    color:#f47500;
    text-decoration:underline;
}


/*=====================================
  Contact Form Container
=====================================*/

.post-body .contact-form{
    display:block;
}

.contact-form .widget-title{
    display:none;
}

.contact-form .contact-form-name{
    width:calc(50% - 5px);
}

.contact-form .contact-form-email{
    float:right;
    width:calc(50% - 5px);
}


/*=====================================
  Code Blocks
=====================================*/

.post-body pre,
pre.code-box{
    display:block;
    position:relative;
    margin:0;
    padding:15px;
    background:rgba(155,155,155,.05);
    color:#47474a;
    font:13px/1.4 monospace;
    white-space:pre-wrap;
    border:1px solid rgba(155,155,155,.1);
    border-radius:3px;
}


/*=====================================
  Miscellaneous
=====================================*/

.post-body .google-auto-placed{
    margin:25px 0;
}

#hidden-widgets-wrap,
.hidden-widgets{
    display:none;
    visibility:hidden;
}


/*=====================================
  Responsive
=====================================*/

@media (max-width:680px){

    .post-body table{
        display:block;
        overflow-x:auto;
    }

}

/*=====================================
  Contact Form
=====================================*/

#ContactForm1{
    width:100%;
    overflow:hidden;
    margin:20px 0;
    padding:20px;
    background:#fff;
    border:1px solid #e1e8ed;
    border-radius:3px;
    box-sizing:border-box;
    box-shadow:0 1px 0 rgba(0,0,0,.02);
}

.contact-form-widget{
    max-width:100%;
}

.contact-style{
    width:100%;
    height:40px;
    margin:0 0 10px;
    padding:5px 10px;
    font:13px inherit;
    line-height:30px;
    outline:none;
    border:1px solid #e1e8ed;
    border-radius:3px;
    box-sizing:border-box;
    box-shadow:none;
    transition:border-color .2s ease;
}

.contact-style:hover{
    border-color:#c6c6c6;
}

.contact-style:focus{
    border-color:#00b140;
}

.contact-style.error{
    border-color:#e74c3c;
}


/*=====================================
  Contact Form Layout
=====================================*/

.contact-form-name,
.contact-form-email{
    width:calc(50% - 5px);
}

.contact-form-name{
    float:left;
}

.contact-form-email{
    float:right;
}

.contact-form-message{
    width:100%;
    min-height:120px;
    resize:vertical;
    float:left;
}


/*=====================================
  Buttons
=====================================*/

.contact-form-button{
    float:right;
    width:calc(50% - 5px);
    height:40px;
    border:0;
    border-radius:3px;
    background:#00b140;
    color:#fff;
    font:500 15px inherit;
    cursor:pointer;
    box-shadow:none;
    transition:background .2s ease;
}

.contact-form-button:hover{
    background:#009a38;
}

.contact-form-button:disabled{
    opacity:.65;
    cursor:not-allowed;
}


/*=====================================
  Messages
=====================================*/

.contact-form-error-message-with-border,
.contact-form-success-message-with-border{
    width:100%;
    float:left;
    margin:10px 0 0;
    background:#fff;
    border:0;
    box-shadow:none;
    font-size:14px;
    text-align:left;
}

.contact-form-error-message-with-border{
    color:#e74c3c;
}

.contact-form-success-message-with-border{
    color:#2196f3;
}

.contact-form-cross{
    margin:-3px 0 0 4px;
    cursor:pointer;
    vertical-align:middle;
}

/*=====================================
  Error Page
=====================================*/

.errorWrap{
    padding:120px 20px 100px;
    text-align:center;
    color:#29313a;
}

.errorWrap h3{
    margin:0 0 30px;
    font-size:160px;
    line-height:1;
}

.errorWrap h3 span{
    display:inline-block;
    vertical-align:top;
    font-size:140px;
}

.errorWrap h4{
    margin:0 0 20px;
    font-size:25px;
}

.errorWrap p{
    padding:0 0 50px;
    color:#656565;
    line-height:1.7;
}

.errorWrap a{
    display:inline-block;
    padding:10px 20px;
    background:#3c97ef;
    color:#fff;
    font-size:15px;
    font-weight:500;
    text-decoration:none;
    border-radius:3px;
    transition:background .2s ease;
}

.errorWrap a:hover{
    background:#3688d7;
}


/*=====================================
  Empty Search / Empty State
=====================================*/

.queryEmpty{
    width:70%;
    margin:0 auto;
    padding:0 10px;
    text-align:center;
}

.queryEmpty span{
    display:block;
    margin:40px 0 0;
    padding:15px;
    background:#fff;
    border:1px solid #e1e8ed;
    border-radius:3px;
    box-shadow:0 1px 0 rgba(0,0,0,.02);
    font-size:14px;
}


/*=====================================
  Hidden Utility
=====================================*/

.cod-but{
    display:none;
}

/*=====================================
  Responsive Contact Form
=====================================*/

@media (max-width:480px){

    .contact-form-name,
    .contact-form-email{
        width:100%;
        max-width:100%;
        float:none;
    }

    .contact-form-button{
        width:100%;
        max-width:100%;
        float:none;
        margin-top:10px;
    }

}


/*=====================================
  Responsive Tables
=====================================*/

@media (max-width:480px){

    .post-body table{
        display:block;
        width:100%;
        overflow-x:auto;
    }

    .post-body table tbody,
    .post-body table tr{
        display:table-row;
    }

}


/*=====================================
  Checkout / Order Styles Removed
=====================================*/

/*
The following Blogger/Sora Fashion Cart selectors were removed:

.widget .post-body .checkout-options ...
.sora-upi-details ...
.sorainfoorder ...
.sorasuccessbox ...
.sora_order ...
.soraorderdetails ...

These depend on the Sora Fashion Cart Blogger theme
and have no functionality on GitHub Pages.
*/