--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/default/assets/scss/components/_widgets.scss	Sat May 31 09:21:51 2025 +0800
@@ -0,0 +1,1688 @@
+// main: ../style.scss
+/********************************
+*********************************
+Widgets
+*********************************
+*********************************/
+
+/* Widgets
+========================*/
+.widget-holder,
+.widget-latest-comments,
+.widget-todo,
+.widget-latest-transactions,
+.widget-user-activities {
+  figure {
+    margin-bottom: 0;
+  }
+  .single {
+    padding: em(15) 0;
+    border-bottom: 1px solid $theme-border-color;
+    &:first-of-type { padding-top: 0 }
+    &:last-of-type {
+      border-bottom: 0;
+      padding-bottom: 0;
+    }
+  }
+  .single-header {
+    margin-bottom: 10px;
+  }
+  .single-amount,
+  .single-user-details {
+    margin-left: 1.5em;
+  }
+  .single-event-icon,
+  .single-user-avatar {
+    margin-right: 1.5em;
+  }
+  .single-user-details {
+    font-size: em(14);
+    small { line-height: 1 }
+  }
+  .single-user-name {
+    line-height: 1.3;
+    font-weight: 600;
+    color: $headings-color;
+    display: block;
+  }
+  .single-user-name {
+    font-family: $headings-font-family;
+  }
+
+  body.rtl & {
+    .single-user-avatar {
+      margin-left: 1.5em;
+      margin-right: 0;
+    }
+  }
+}
+
+/* Latest Transactions
+========================*/
+.widget-latest-transactions {
+  width: 100%;
+  tr {
+    border-bottom: 1px solid $theme-border-color;
+  }
+  td {
+    padding: em(15) 0;
+  }
+  tr:first-child td { padding-top: 0 }
+  tr:last-child td { padding-bottom: 0;  }
+  tr:last-child { border-bottom: 0; }
+  figure {
+    margin-bottom: 0;
+  }
+  .single-amount,
+  .single-user-details {
+    flex: 1;
+    margin-left: 1.5em;
+  }
+  .single-user-details {
+    font-size: em(14);
+    small { line-height: 1 }
+  }
+  .single-status,
+  .single-amount {
+    font-size: em(13);
+  }
+  .single-amount {
+    color: $headings-color;
+    margin-bottom: 0;
+    font-weight: 500;
+  }
+  .single-status {
+    vertical-align: middle;
+    letter-spacing: -0.05em;
+    i { margin-right: 0.4em; }
+  }
+  .single-status, .single-user-name, .single-amount {
+    font-family: $headings-font-family;
+  }
+}
+
+/* User Activities
+========================*/
+.widget-user-activities {
+  width: 100%;
+  .single {
+    flex-wrap: wrap;
+    padding: em(25) 0;
+  }
+  .single-body {
+    flex-basis: 100%;
+    padding-left: calc(50px + 1.5em);
+    p { font-size: em(13) }
+  }
+  .single-likes {
+    i {
+      margin-right: 0.5em;
+      color: $text-muted;
+    }
+  }
+  .single-attachment {
+    display: block;
+    background: rgba($info, 0.05);
+    border: 1px solid rgba($info, 0.1);
+    border-radius: 3px;
+    padding: em(10);
+    margin-top: em(10);
+  }
+  .single-attachment-icon {
+    background: $info;
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    @include size(em(40,20));
+    color: #fff;
+    font-size: em(20);
+    border-radius: 3px;
+    float: left;
+    margin-right: em(15,20);
+  }
+  .single-attachment-filesize,
+  .single-attachment-filename {
+    display: block;
+    font-size: em(12);
+  }
+  .single-attachment-filename {
+    font-family: $headings-font-family;
+    font-weight: 600;
+    color: $headings-color;
+  }
+  .single-attachment-filesize {
+    color: $text-muted;
+  }
+  .single-event-icon {
+    background: $color-scheme;
+    color: #fff;
+    border-radius: 100px;
+    font-size: rem(20);
+    @include size(rem(50));
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+  }
+
+  .single-users-list {
+    display: flex;
+    flex-flow: row-reverse;
+    align-items: center;
+    justify-content: flex-end;
+    a {
+      @include size(rem(35));
+      margin-left: rem(-10);
+      &:nth-last-child(2) { margin-left: 0 }
+      img {
+        border-radius: 100px;
+        border: 2px solid $widget-bg;
+      }
+
+      &.more {
+        @include size(auto);
+        order: -1;
+        margin-left: 1em;
+        color: $content-color;
+      }
+    }
+  }
+  body.rtl & {
+    .single-event-icon {
+      margin-right: 0;
+      margin-left: 1.5em;
+    }
+    .single-users-list a.more {
+      margin-left: 0;
+      margin-right: 1em;
+    }
+  }
+}
+
+/* Chat Activities
+========================*/
+.widget-chat-activity {
+  .message {
+    margin: em(10) 0;
+    &:first-child { margin-top: 0; }
+    &:last-child { margin-bottom: 0; }
+    p {
+      background: $color-scheme;
+      border: 1px solid $color-scheme;
+      border-top-left-radius: 3px;
+      border-bottom-left-radius: 3px;
+      padding: .5em 1em;
+      color: #fff;
+      margin-bottom: .5em;
+      position: relative;
+      &:first-child {
+        &:before,
+        &:after {
+          content: "";
+          @include size(0);
+          display: block;
+          @include position(absolute, rem(20) -7px null auto);
+          border-style: solid;
+          border-width: 6px 0 7px 6px;
+          border-color: transparent transparent transparent $color-scheme;
+          transform: translateY(-50%);
+        }
+        &:before {
+          right: -7px;
+          border-left-color: $color-scheme;
+        }
+      }
+    }
+    .message-body {
+      margin-top: .5em;
+      display: inline-flex;
+      flex-direction: column;
+      align-items: flex-end;
+      margin: auto 1.5em;
+      order: 1;
+    }
+    figure {
+      order: 2;
+    }
+    &.reply {
+      p {
+        background: #fff;
+        border: 1px solid $theme-border-color;
+        border-radius: 0;
+        border-top-right-radius: 3px;
+        border-bottom-right-radius: 3px;
+        color: #666;
+        &:first-child {
+          &:before,
+          &:after {
+            content: "";
+            @include size(0);
+            display: block;
+            @include position(absolute, null auto null -7px);
+            border-style: solid;
+            border-width: 6px 7px 6px 0;
+            border-color: transparent #fff transparent transparent;
+            transform: translateY(-50%);
+          }
+          &:before {
+            left: -9px;
+            border-right-color: $theme-border-color;
+          }
+        }
+      }
+      figure {
+        order: 1;
+      }
+      .message-body {
+        align-items: flex-start;
+        order: 2;
+      }
+    }
+  }
+
+  body.rtl & {
+    .message {
+      p:first-child::before,
+      p:first-child::after {
+        border-width: 6px 7px 6px 0;
+        border-color: transparent $color-scheme transparent transparent;
+      }
+
+      p:first-child:after,
+      p:first-child:before {
+        right: auto;
+        left: -7px;
+      }
+
+      &.reply p:first-child::after,
+      &.reply p:first-child::before {
+        border-width: 6px 0 6px 7px;
+        border-color: transparent transparent transparent $color-scheme;
+      }
+
+      &.reply p:first-child:after,
+      &.reply p:first-child:before {
+        left: auto;
+        right: -7px;
+      }
+
+      &.reply p:first-child:before {
+        border-left-color: $theme-border-color;
+        right: -8px;
+      }
+
+      &.reply p:first-child:after {
+        border-left-color: #fff;
+      }
+    }
+  }
+}
+
+/* Latest Comments
+========================*/
+.widget-latest-comments {
+  .single {
+    align-items: flex-start;
+  }
+  .single-body {
+    margin-left: 1.5em;
+  }
+  .single-user-name {
+    display: inline;
+  }
+  .single-timestamp {
+    font-size: em(13);
+    margin-left: 0.4em;
+  }
+  .single:hover .single-footer ul {
+    display: block;
+  }
+  .single-footer {
+    .badge {
+      @include padding(null $spacer(1));
+      font-family: $headings-font-family;
+    }
+    ul {
+      list-style: none;
+      padding-left: 0;
+      margin-bottom: 0;
+      display: none;
+      @include tablet {
+        display: block;
+      }
+      @include mobile {
+        display: block;
+      }
+      li {
+        display: inline-block;
+        font-size: em(18);
+        line-height: 1em;
+        padding-left: em(5,18);
+        padding-right: em(5,18);
+        a {
+          color: $text-muted;
+          &:hover {
+            color: $color-scheme;
+          }
+        }
+      }
+    }
+  }
+}
+
+
+/* Latest Posts
+========================*/
+.widget-latest-posts {
+  position: relative;
+  .widget-bg {
+    border-radius: 5px;
+    overflow: hidden;
+  }
+  .widget-body {
+    padding: 0;
+  }
+  .box-title {
+    text-transform: uppercase;
+    font-size: rem(12);
+    font-weight: 600;
+    color: $text-muted;
+    letter-spacing: .1em;
+  }
+  article {
+    margin-left: 0;
+    margin-right: 0;
+    display: flex;
+    flex-flow: column;
+    .row { margin: 0; }
+  }
+  figure { margin-bottom: 0; }
+  .post-img { padding: 0 }
+  .post-details {
+    display: flex;
+    flex-direction: column;
+    padding: em(30) em(20);
+    figure { @include size(rem(30)) }
+    .post-links {
+      display: flex;
+      align-items: center;
+      ul {
+        margin-left: 1em;
+        padding-left: 0;
+        margin-bottom: 0;
+        list-style: none;
+      }
+      li {
+        display: inline-block;
+        padding: 0 0.5em;
+        font-family: $headings-font-family;
+        font-size: em(11);
+        font-weight: 700;
+        a {
+          i { color: $text-muted }
+          color: $headings-color;
+          &:hover { color: $color-scheme }
+        }
+      }
+    }
+  }
+  .post-title {
+    margin-top: 0;
+    margin-bottom: rem(20);
+    font-weight: 300;
+    a {
+      color: $headings-color;
+      &:hover { color: $color-scheme }
+    }
+  }
+  .carousel.slick-slider.slick-dotted {
+    margin-bottom: 0;
+  }
+  .carousel.slick-slider .slick-dots {
+    @include position(absolute, null null 20px 0);
+    width: 42%;
+    text-align: center;
+
+    li {
+      @include margin(null 3px);
+    }
+    li button::before {
+      background: none;
+      border: 2px solid #fff;
+      opacity: 1;
+      @include size(12px);
+    }
+    .slick-active button::before {
+      transform: none;
+      background: #fff;
+    }
+  }
+  body.rtl & {
+    .post-details {
+      direction: rtl;
+    }
+  }
+}
+
+/* User Profile
+========================*/
+.widget-user-profile {
+  .profile-wall-img img {
+    width: 100%;
+    height: auto;
+  }
+  .profile-body {
+    padding: 0 $widget-padding-y;
+    text-align: center;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+  }
+  .profile-user-avatar {
+    margin-top: em(-80);
+    a {
+      display: block;
+    }
+    img {
+      border-radius: 100px;
+      border: 2px solid #fff;
+      box-shadow: 0 0 5px 0 rgba(0,0,0,.4);
+    }
+    &:after {
+      content: '';
+      width: 30px;
+      height: 1px;
+      background: $theme-border-color;
+      margin-top: em(20);
+    }
+  }
+  .profile-user-name {
+    font-weight: 300;
+    margin-top: rem(24);
+    margin-bottom: rem(5);
+  }
+  .profile-seperator {
+    width: 30px;
+    border-top-color: $theme-border-color;
+    margin-top: rem(20);
+  }
+  .profile-user-address {
+    font-size: em(12);
+    font-family: $headings-font-family;
+    font-weight: 600;
+  }
+}
+
+/* Counter Widget
+========================*/
+.widget-todo {
+  .single {
+    padding: em(20) 0;
+  }
+  .single-icon {
+    margin-right: em(15);
+    margin-top: em(3);
+    font-size: em(20);
+  }
+  .single-title {
+    margin: em(6) 0;
+    font-size: rem(14);
+    letter-spacing: 0;
+    font-weight: 600;
+  }
+  .dropdown-item {
+    display: flex;
+    align-items: center;
+    .list-icon {
+      margin-right: em(6);
+      font-size: 1em;
+    }
+  }
+  .single-tags {
+    font-family: $headings-font-family;
+    li {
+      display: inline-block;
+      margin-right: em(5);
+      font-weight: 600;
+      font-size: 0.9em;
+      a:before {
+        content: '\0023';
+      }
+    }
+  }
+  .single.done {
+    .media-body {
+      opacity: 0.4;
+    }
+  }
+  .dropdown > .dropdown-toggle {
+    color: $content-color;
+  }
+  .add-btn {
+    @include position(absolute, null 50% 0 null);
+    transform: translateY(50%) translateX(50%);
+  }
+
+  body.rtl & {
+    .dropdown-item .list-icon {
+      margin-right: 0;
+      margin-left: em(6);
+    }
+  }
+}
+
+
+/* Counter Widget
+========================*/
+.widget-counter {
+  padding-left: em(10);
+
+  h6 {
+    text-transform: uppercase;
+    font-weight: bold;
+    margin-top: em(10);
+    padding-right: em(30);
+  }
+
+  small {
+    font-weight: 700;
+    letter-spacing: .05em;
+    display: block;
+    opacity: .5;
+    margin-top: em(5, 10.5);
+    text-transform: none;
+  }
+
+  i {
+    position: absolute;
+    top: em(30,19);
+    right: em(40,19);
+    font-size: em(19,14);
+
+    &::before,
+    &::after {
+      content: "";
+      background: #e5e5e5;
+      position: absolute;
+      left: em(-7,19);
+    }
+
+    .text-inverse &::before,
+    .text-inverse &::after {
+      background: #fff;
+      background: rgba(255,255,255,.3);
+    }
+
+    &::before {
+      top: em(6,19);
+      height: em(20,19);
+      width: em(1,19);
+    }
+
+    &::after{
+      bottom: em(-8,19);
+      width: em(20,19);
+      height: em(1,19);
+    }
+  }
+
+  h3 {
+    font-family: $tertiary-font-family;
+    font-weight: 300;
+    font-size: em(40);
+  }
+}
+
+
+/* User List
+=======================*/
+ul.widget-user-list {
+  padding-top: em(10);
+
+  .d-flex a {
+    display: inline-block;
+  }
+
+  li {
+    padding-bottom: em(10);
+    padding-top: em(15);
+    border-bottom: rem(1) solid lighten($theme-border-color, 7%);
+    &:last-child {
+      border: none;
+    }
+  }
+
+  h5 {
+    font-size: em(15);
+    margin-top: 0;
+  }
+
+  small {
+    display: block;
+    font-size: em(11);
+  }
+
+  .media-body {
+    position: relative;
+
+    .btn {
+      padding: 0 em(28,13);
+      text-transform: uppercase;
+      margin-top: em(3,13);
+      line-height: em(32,13);
+      border-radius: em(4,13);
+      font-size: em(13,14);
+      float: right;
+    }
+
+    .btn-outline-secondary {
+      color: #ccc;
+      &:hover {
+        color: #555;
+        background-color: #e4e7ea;
+       }
+    }
+  }
+
+  body.rtl & {
+    @include padding(em(10) $card-spacer-x null);
+  }
+
+  @media (max-width: 480px) {
+    .media-body .btn {
+      display: none;
+    }
+  }
+
+  .media-heading a {
+    display: inline-block;
+    color: rgba(0,0,0,.7);
+    margin: em(4) 0 em(5);
+    &:hover{
+      color: $color-scheme;
+    }
+  }
+}
+
+
+/* Profile Add Content Widget
+============================*/
+.widget-profile-add-tabs {
+  margin-bottom: em(30);
+  .nav-pills .nav-link {
+    padding: .3em 2em;
+    font-weight: 500;
+    font-size: em(12);
+    &.active {
+      background: rgba($color-scheme, .1);
+      color: $color-scheme;
+    }
+    &.attach-file-link {
+      @include padding(null 0);
+      font-size: em(13);
+    }
+  }
+  .tab-content {
+    border: 1px solid $theme-border-color;
+    margin-top: em(20);
+  }
+  textarea {
+    border: 0;
+    box-shadow: 0;
+    width: 100%;
+    min-height: 50px;
+    font-family: $headings-font-family;
+    resize: none;
+  }
+}
+
+/* Status Table Widget
+============================*/
+.widget-status-table {
+
+  thead {
+    color: lighten($body-color, 20%);
+  }
+
+  span {
+    text-transform: uppercase;
+    letter-spacing: em(2,10.5);
+    border-radius: em(15,10.5);
+    padding: em(5,10.5) em(15,10.5);
+  }
+
+  i {
+    letter-spacing: em(10,18);
+    &:hover{ color: $body-color !important; }
+  }
+
+  tbody{
+    a { color: rgba(0,0,0,.7); }
+    a:hover { color: $color-scheme; }
+  }
+}
+
+
+/* User Activity Feed
+====================================*/
+.widget-activity-header {
+  .nav-pills {
+    .nav-link {
+      border-radius: em(20,12);
+      font-family: $tertiary-font-family;
+      font-size: em(12);
+      font-weight: 600;
+      color: $body-color;
+    }
+    .nav-link.active {
+      color: #fff;
+      background-color: map-get($theme-colors, info);
+    }
+  }
+  form {
+    position: relative;
+    .form-control {
+      border: 2px solid #f2f3f5;
+      border-radius: em(15);
+      padding: em(15) em(130) em(15) em(20);
+      box-shadow: none;
+      &:focus {
+        border-color: #f2f3f5;
+        box-shadow: none;
+      }
+      @include placeholder {
+        color: #b9bec3;
+        font-family: $tertiary-font-family;
+      }
+    }
+    div {
+      position: absolute;
+      bottom: em(20);
+      right: em(20);
+      i { color: #c9d2da; }
+      button {
+        border-radius: em(12);
+        font-family: $tertiary-font-family;
+        letter-spacing: em(1);
+        background-color: #c9d2da;
+      }
+    }
+  }
+}
+
+.widget-activitys {
+  padding-top: em(10);
+
+  li {
+    position: relative;
+    margin-top: 0;
+    padding: em(10) 0;
+
+    &::before {
+      content: "";
+      background: #e5e5e5;
+      position: absolute;
+      top: 0;
+      left: em(21);
+      width: rem(1);
+      height: 100%;
+    }
+
+    &:first-child { padding-top: 0; }
+    &:last-child {
+      &, .media-body { padding-bottom: 0; }
+    }
+  }
+
+  .media-body {
+    padding: em(12) 0;
+    font-family: $tertiary-font-family;
+  }
+
+  .media-heading {
+    line-height: em(21);
+    margin-top: 0;
+    strong a {
+      color: $headings-color;
+      &:hover { text-decoration: underline; }
+    }
+  }
+
+  .media-body-content {
+    padding-top: em(15);
+  }
+
+  .widget-body-image-list {
+    figcaption{
+      text-align: center;
+      padding-top: em(8);
+      font-family: $headings-font-family;
+      small{
+        display: block;
+        font-size: 70%;
+      }
+    }
+  }
+}
+
+
+/* Widget Social Twitter
+====================================*/
+.facebook-widget,
+.twitter-widget {
+  overflow: hidden;
+  position: relative;
+  padding: em(30) em(20);
+  display: flex;
+  min-height: rem(220);
+  .status {
+    font-size: em(15);
+    margin-top: 2em;
+  }
+  .status-container {
+    width: 100%;
+    display: flex;
+    flex-direction: column;
+  }
+  h5, h6 {
+    color: #fff;
+  }
+  .after {
+    font-family: 'feather';
+    font-size: em(300);
+    line-height: rem(100);
+    opacity: 0.3;
+    color: #fff;
+    @include position( absolute, null 0 0 null);
+    pointer-events: none;
+  }
+  .user-info {
+    width: 100%;
+    display: flex;
+    align-items: center;
+  }
+  .widget-icon {
+    font-size: em(24);
+  }
+  figure {
+    margin-bottom: 0;
+  }
+  .user-name-group { flex: 1 }
+  .user-profile-picture {
+    @include size( em(30) );
+    border-radius: em(100);
+    float: left;
+    margin-right: em(10);
+  }
+  .user-name {
+    margin-top: em(5);
+    margin-bottom: em(5);
+    text-transform: uppercase;
+    font-weight: 600;
+    font-size: em(12);
+    letter-spacing: .05em;
+  }
+  .user-screen-name {
+    margin: 0;
+    opacity: 0.7;
+    font-weight: normal;
+    font-size: em(11);
+    letter-spacing: 0;
+  }
+  p {
+    margin-bottom: 0;
+    font-family: $headings-font-family;
+  }
+  body.rtl & {
+    .user-profile-picture {
+      margin-right: 0;
+      margin-left: em(10);
+    }
+  }
+}
+
+
+/* Chart Specific Styles
+====================================*/
+.progress-stats-round {
+  position: relative;
+
+  .list-icon {
+    font-size: em(30);
+    font-weight: 600;
+    position: absolute;
+    top: em(30,30);
+    left: 50%;
+    transform: translateX(-50%);
+  }
+}
+
+.widget-social {
+  a{
+    margin-top: em(-20);
+    margin-bottom: em(-20);
+    padding-top: em(30);
+    padding-bottom: em(15);
+    &:hover {
+      text-decoration: none;
+    }
+    i {
+      font-size: em(40);
+    }
+  }
+}
+
+.widget-social-ft {
+  margin-top: em(-20);
+  margin-bottom: em(-20);
+  header {
+    padding: em(20) 0;
+    i {
+      font-size: em(40);
+    }
+  }
+  div {
+    div {
+      &:last-child {
+        border-left: rem(1) solid $theme-border-color;
+      }
+    }
+  }
+}
+
+.doughnut-widget {
+  position: relative;
+  section {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    transform: translate(-50%, -50%);
+    small {
+      display: inline-block;
+    }
+  }
+}
+
+.doughnut-widget-details {
+  ul {
+    width: em(100);
+    line-height: em(30);
+    margin-left: 50%;
+    transform: translateX(-50%);
+  }
+}
+
+.statistic-squares {
+  [class*="col-"] {
+    border-top: rem(1) solid #eee;
+    border-left: rem(1) solid #eee;
+    padding-top: em(30);
+    padding-bottom: em(30);
+
+    &:first-child {
+      border-left: 0;
+    }
+  }
+
+  > .row:first-child [class*="col-"] {
+    border-top: 0;
+  }
+}
+
+.knob-widget {
+  section {
+    position: relative;
+    i {
+      font-size: em(60);
+      color: rgba(0,0,0,.1);
+      position: absolute;
+      left: 50%;
+      top: 50%;
+      transform: translate(-50%, -50%);
+    }
+  }
+
+  ul {
+    li{
+      padding-left: em(20);
+      padding-right: em(20);
+      &:last-child{
+        border-left: rem(1) solid $theme-border-color;
+      }
+    }
+  }
+}
+
+.card-user-info-widget {
+  .caption-btn  {
+    > a {
+      margin-bottom: em(10,15);
+      letter-spacing: em(2,15);
+    }
+  }
+  .followers-details-list {
+    li {
+      border: rem(1) solid $theme-border-color;
+      padding: 0 em(40);
+      &:first-child {
+        border-left: 0;
+      }
+      &:last-child {
+        border-left: 0;
+        border-right: 0;
+      }
+    }
+  }
+
+  .email-details-list {
+    li {
+      padding: 0px em(30);
+      line-height: em(30);
+    }
+  }
+}
+
+
+/********************************
+*********************************
+Light Box Gallery
+*********************************
+*********************************/
+.lightbox-gallery {
+  .lightbox {
+    img {
+      width: 100%;
+      height: auto;
+    }
+    a {
+      overflow: hidden;
+      display: block;
+      position: relative;
+
+      img {
+        transition: all 250ms;
+      }
+
+      &:hover {
+        img { transform: scale(1.1); }
+      }
+    }
+  }
+}
+
+.promo-code-widget {
+  header {
+    h5 {
+      background-color: #adc1c8;
+      width: em(40);
+      height: em(40);
+      line-height: em(40);
+      color: #ffffff;
+    }
+  }
+
+  section {
+    > a {
+      display: inline-block;
+      border: 1px dashed $theme-border-color;
+    }
+    > input {
+      max-width: 100%;
+    }
+  }
+}
+
+
+.social-icon-widget {
+  div:first-child {
+    position: relative;
+    &::after {
+      content: "";
+      position: absolute;
+      width: em(1);
+      height: em(50);
+      background-color: #dfe3e9;
+      right: 0;
+      top: 50%;
+      transform: translateY(-50%);
+    }
+  }
+}
+
+
+.latest-widget {
+  header {
+    border-bottom: 1px solid #efefef;
+  }
+  section {
+    .col-md-3 {
+      border-right: 1px solid #efefef;
+      &:last-child {
+        border-right: 0;
+      }
+      h5 {
+        line-height: em(22);
+      }
+    }
+  }
+  footer {
+    .btn {
+      background-color: #333333;
+      color: #fff;
+      outline: none;
+    }
+    .btn-default:active {
+      background-color: #333333;
+      color: #fff;
+    }
+  }
+}
+
+.card-bench-widget {
+  figure {
+    position: relative;
+    header {
+      position: absolute;
+      top: em(20);
+      right: em(20);
+      .btn {
+        font-weight: 700;
+        letter-spacing: em(1);
+        color: #fff;
+        border-color: #fff;
+        &:hover {
+          background-color: #fff;
+          color: #000;
+        }
+      }
+    }
+
+    section {
+      position: absolute;
+      bottom: em(40);
+      right: em(20);
+    }
+
+    ul {
+      position: absolute;
+      bottom: em(0);
+      right: em(20);
+    }
+  }
+}
+
+.city-card-widget {
+  figure {
+    position: relative;
+    .city-card-status,
+    .city-card-details {
+      position: absolute;
+      left: em(20);
+    }
+
+    .city-card-status {
+      top: em(20);
+    }
+
+    .city-card-details {
+      bottom: 0;
+    }
+
+    .city-card-button {
+      position: absolute;
+      right: em(20);
+      bottom: em(20);
+      .btn {
+        color: #fff;
+        border-color: #fff;
+        &:hover {
+          color: #000;
+          background-color: #fff;
+        }
+      }
+    }
+  }
+}
+
+
+.ecommerce-products-card {
+  figure {
+    position: relative;
+    figcaption {
+      position: absolute;
+      top: em(20);
+      right: em(20);
+    }
+  }
+
+  .ecommerce-products-card-details {
+    padding: em(30) em(40) em(25);
+    .product-title {
+      h6 {
+        color: #bbc7d3;
+      }
+    }
+
+    .buy-button {
+      .btn {
+        border-radius: 0;
+        color: #ffffff;
+        background-color: #88bf57;
+        outline: none;
+      }
+    }
+
+    .buyer-button {
+      .btn {
+        color: #bbc7d3;
+        border-color: #bbc7d3;
+        &:hover,
+        &:focus {
+          color: #000;
+        }
+      }
+    }
+
+    .product-ratings {
+      li {
+        a {
+          i {
+            color: #f3a855;
+          }
+        }
+      }
+    }
+  }
+}
+
+
+/* Simple Thumnail Gallery
+========================*/
+.gallery-small {
+  a {
+    display: inline-block;
+    overflow: hidden;
+    background: #000;
+    position: relative;
+    text-align: center;
+  }
+
+  img {
+    transition: 250ms transform, 250ms opacity;
+    width: 100%;
+    height: auto;
+  }
+
+  a:hover > img,
+  a.active > img {
+    transform: scale(1.1);
+  }
+
+  a:hover,
+  .active {
+    img {
+      opacity: .7;
+    }
+
+    span {
+      display: block;
+      width: 100%;
+      position: absolute;
+      color: #fff;
+      top: 50%;
+      left: 0;
+      transform: translateY(-50%);
+      font-size: em(24,15);
+      line-height: 1;
+      font-weight: 700;
+      letter-spacing: -2px;
+      font-family: $headings-font-family;
+    }
+
+    small {
+      display: block;
+      color: #fff;
+      font-size: .8rem;
+      margin-top: 5px;
+      letter-spacing: 0;
+    }
+  }
+}
+
+
+/* Chart Widgets
+============================*/
+.chart-widget {
+
+  .card {
+    .card-header {
+      padding-left: em(30);
+      background-color: #f9faff;
+      span {
+        color: #9ca0a8;
+      }
+    }
+    .card-body { background-color: #f9faff; }
+    .card-footer {
+      background: none;
+      border-color: #edf3f8;
+    }
+  }
+
+  .pie-chart {
+    position: relative;
+    section {
+      color: #9ca0a8;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      transform: translate(-50%, -50%);
+    }
+  }
+}
+
+.online-course-widget {
+  .card-header {
+    background: none;
+    position: relative;
+    &::after {
+      content: "";
+      position: absolute;
+      height: em(3);
+      width: em(40);
+      bottom: 0;
+      left: em(20);
+      background: #e9ecf0;
+    }
+    a {
+      i {
+        font-size: em(22);
+        background: #e9ecf0;
+        padding: em(15,22);
+      }
+      &:hover i { background-color: $color-scheme; }
+    }
+    span {
+      color: #6a768c;
+      font-size: em(13);
+      font-weight: 600;
+      padding: em(15,13) em(20,13);
+    }
+  }
+  .card-body {
+    margin-bottom: em(10);
+    h5 {
+      a {
+        font-weight: 300;
+        line-height: em(25);
+        color: #6a768c;
+      }
+    }
+  }
+  .card-footer {
+    padding: em(15) em(20);
+    background-color: #fff;
+    border-color: $theme-border-color;
+  }
+}
+
+.select-widget {
+  font-family: $tertiary-font-family;
+  margin-bottom: em(30);
+  section {
+    margin-top: em(30);
+    a {
+      div {
+        margin-left: em(-10);
+        margin-right: em(-10);
+        border: 1px solid $theme-border-color;
+        border-radius: em(5);
+        padding: 0 em(10) em(40) em(10);
+      }
+    }
+    i {
+      font-size: em(76);
+      vertical-align: bottom;
+    }
+  }
+}
+
+.subscribe-widget {
+  border: em(2) dashed $theme-border-color;
+  padding: em(20) em(20) em(40) em(20);
+  .col-md-2 {
+    position: relative;
+    i {
+      font-size: em(76);
+      &::before {
+        position: absolute;
+        transform: rotate(15deg);
+        left: 40%;
+        top: 20%;
+      }
+    }
+  }
+  .form-control { box-shadow: none; }
+}
+
+.tickets-table {
+  table {
+    thead {
+      background: #fbfbfc;
+      th {
+        padding: em(20);
+        border-top: 1px solid $theme-border-color;
+        border-bottom: 1px solid $theme-border-color;
+      }
+    }
+
+    tbody {
+      tr {
+        margin: em(10) 0;
+        &:last-child {
+          td { border: none; }
+        }
+        td {
+          padding: em(10) em(20);
+          border-bottom: 1px solid $theme-border-color;
+          i {
+            font-size: em(18);
+            &::before {
+              vertical-align: -webkit-baseline-middle;
+            }
+          }
+        }
+      }
+    }
+  }
+}
+
+.schedule-widget {
+  .col-md-3 {
+    position: relative;
+    &::after {
+      content: "";
+      position: absolute;
+      height: em(40);
+      width: em(1);
+      right: 0;
+      top: 50%;
+      transform: translateY(-50%);
+      background-color: $theme-border-color;
+    }
+    &:last-child {
+      &::after {
+        display: none;
+      }
+    }
+  }
+  a {
+    i {
+      position: relative;
+      background: $theme-border-color;
+      font-size: em(18);
+      @include size(em(50), em(50));
+      &::before {
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        transform: translate(-50%, -50%);
+      }
+    }
+  }
+}
+
+.purpose-widget {
+  .card {
+    .card-body {
+      .col-md-6 {
+        padding: em(30);
+        border-right: 1px solid $theme-border-color;
+        &:last-child { border: none; }
+      }
+      border-bottom: 1px solid $theme-border-color;
+      &:last-child { border: none; }
+    }
+
+  }
+}
+
+.status-view-widget {
+  .col-md-6 {
+    a {
+      padding: em(35) em(25);
+      border: 1px solid #fff;
+      border-radius: em(5);
+      background: #f9f9f9;
+      i {
+        font-size: em(20);
+        &::before { vertical-align: -webkit-baseline-middle; }
+      }
+      h3 { color: #444; }
+
+      &:hover {
+        background: none;
+        border-color: map-get($theme-colors, success);
+      }
+    }
+  }
+}
+
+.sports-card {
+  .card {
+    .card-header {
+      .list-icon {
+        width: auto;
+        height: auto;
+        line-height: normal;
+      }
+    }
+    .card-body {
+      > div {
+        > a {
+          small {
+            border-bottom: 1px solid $theme-border-color;
+          }
+        }
+      }
+    }
+  }
+}
+
+/* Map Widgets
+============================*/
+.widget-map {
+  .gmap {
+    position: relative;
+    &:after {
+      content: '';
+      display: block;
+      @include position(absolute,0);
+      box-shadow: inset 0 0 10px 0 rgba(0,0,0,.2);
+      pointer-events: none;
+    }
+  }
+  .card {
+    box-shadow: 0 0 10px 0 rgba(0,0,0,.2);
+  }
+}
+
+/* Project Index 
+============================*/
+.widget-project-index {
+  .card {
+    border: 0;
+    .card-header {
+      background: $widget-bg;
+      border: 0;
+      a {
+        padding-right: rem(20);
+        padding-left: rem(20);
+      }
+      a::after {
+        display: none;
+      }
+    }
+    .card-title {
+      padding: 0;
+    }
+
+    .count {
+      @include size(rem(20));
+      line-height: rem(18);
+      text-align: center;
+      border-radius: 100%;
+      border: 2px solid $theme-border-color;
+      display: inline-block;
+    }
+  }
+  .list-group {
+    border: 0;
+    background: $body-bg;
+    .list-group-item {
+      @include padding(0.75em rem(20));
+      display: flex;
+      align-items: top;
+      background: $body-bg;
+      border: 0;
+      color: $text-muted;
+      font-size: em(13);
+      font-weight: 500;
+      &.active {
+        color: $headings-color;
+        box-shadow: inset 4px 0 0 0 $primary;
+      }
+    }
+    small {
+      margin-left: 1em;
+    }
+
+    .list-icon {
+      line-height: em(30);
+      margin-right: 1em;
+      color: $text-muted;
+    }
+
+    .done-icon {
+      display: block;
+      font-size: rem(12);
+      @include size(em(20,12));
+      line-height: em(20,12);
+      text-align: center;
+      border-radius: 100%;
+      margin-top: .2em;
+    }
+  }
+
+  body.rtl & {
+    .list-group {
+      .list-group-item.active {
+        box-shadow: inset -4px 0 0 0 $primary;
+      }
+      .list-icon {
+        margin-right: 0;
+        margin-left: 1em;
+      }
+    }
+  }
+}