@font-face {
  font-family: "Almarai";
  src: url("/assets/demo_standard/fonts/Almarai-Regular.ttf") format("truetype");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}

@font-face {
  font-family: "Cairo Saudi";
  src: url("/assets/demo_standard/fonts/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("https://cdn.jsdelivr.net/gh/UsmanSanawar/Cairo-with-Saudi-Currency@main/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("https://cosmacare.trilogy-erp.com/assets/cosma_ksa/fonts/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("/assets/cosma_ksa/fonts/Cairo-Regular-Saudi.ttf") format("truetype");
  unicode-range: U+00A7;
  font-display: swap;
}

@font-face {
  font-family: "Cosma Saudi Riyal Symbol";
  src: url("/assets/demo_standard/fonts/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("https://cosmacare.trilogy-erp.com/assets/cosma_ksa/fonts/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("/assets/cosma_ksa/fonts/Cairo-Regular-Saudi.ttf") format("truetype"),
       url("https://cdn.jsdelivr.net/gh/UsmanSanawar/Cairo-with-Saudi-Currency@main/Cairo-Regular-Saudi.ttf") format("truetype");
  unicode-range: U+00A7;
  font-display: swap;
}

:root,
[data-theme="light"] {
  --font-stack: "Cairo Saudi", "Cosma Saudi Riyal Symbol", "Almarai", "Noto Sans Arabic", "Segoe UI", sans-serif;
  --font-family-sans-serif: "Cairo Saudi", "Cosma Saudi Riyal Symbol", "Almarai", "Noto Sans Arabic", "Segoe UI", sans-serif;
  --demo-accent: #8a5a24;
  --demo-accent-soft: #f6efe5;
  --demo-surface: #fffdf9;
  --demo-border: #e8dccd;
}

html:root,
html[data-theme="light"],
body {
  --primary: #b87433;
  --primary-color: #b87433;
  --text-color: #181818;
  --heading-color: #181818;
  --us-accent: #b87433;
  --us-accent-soft: #fff3df;
  --us-border-soft: #eadcc6;
  --us-surface-tint: #fffaf3;
  --us-glow: rgba(184, 116, 51, 0.18);
  --demo-accent: #b87433;
  --demo-accent-soft: #fff3df;
  --demo-surface: #fffaf3;
  --demo-border: #eadcc6;
}

body,
button,
input,
select,
textarea,
.modal,
.form-control,
.widget,
.page-title,
.ellipsis,
.indicator-pill,
.comment-box,
.form-message,
.grid-heading-row,
.sidebar-item-label,
.awesomplete > ul > li {
  font-family: var(--font-family-sans-serif) !important;
}

.currency,
.money,
.frappe-list .level-item,
.frappe-list .list-row,
.report-wrapper,
.query-report,
.datatable,
.dt-scrollable,
.dt-cell,
.dt-cell__content,
.dt-header__cell,
.dt-row,
.text-right,
.text-end,
.number-widget-box .widget-content,
.number-widget-box .number,
.frappe-control[data-fieldtype="Currency"] input,
.frappe-control[data-fieldtype="Currency"] .control-value,
[data-fieldtype="Currency"],
.list-row-col,
.grid-static-col[data-fieldtype="Currency"] {
  font-family: "Cairo Saudi", "Cosma Saudi Riyal Symbol", "Almarai", "Noto Sans Arabic", "Segoe UI", sans-serif !important;
}

.demo-saudi-currency,
.demo-saudi-currency * {
  font-family: "Cairo Saudi", "Cosma Saudi Riyal Symbol", "Almarai", "Noto Sans Arabic", "Segoe UI", sans-serif !important;
}

.layout-side-section,
.desk-sidebar {
  background: linear-gradient(180deg, #fffdf9 0%, #fbf5ee 100%);
}

.desk-sidebar .standard-sidebar-item.selected,
.layout-side-section .standard-sidebar-item.selected,
.workspace-sidebar .standard-sidebar-item.selected,
.standard-sidebar-item:hover {
  background: var(--demo-accent-soft);
  color: var(--demo-accent);
  border-radius: 12px;
}

.page-head,
.layout-main-section,
.widget,
.form-dashboard,
.section-body,
.page-form,
.frappe-card {
  border-radius: 16px;
}

.layout-main-section,
.frappe-card,
.widget {
  border: 1px solid var(--demo-border);
  box-shadow: 0 10px 30px rgba(93, 57, 18, 0.04);
}

.workspace-page .widget.links-widget-box,
.workspace-page .widget.shortcut-widget-box,
.workspace-page .widget.number-widget-box {
  background: var(--demo-surface);
}

.workspace-page .widget-head .widget-title,
.page-title .title-text {
  color: #3d2a15;
}

.indicator-pill.green,
.indicator-pill.blue,
.indicator-pill.orange {
  border-radius: 999px;
}

.navbar,
.desk-sidebar,
.page-head {
  border-color: var(--demo-border) !important;
}

body .navbar,
body .page-head {
  background: linear-gradient(180deg, #ffffff 0%, #fffaf3 100%) !important;
  border-bottom: 1px solid #eadcc6 !important;
}

body .navbar::after {
  background: linear-gradient(90deg, transparent 0%, #b87433 50%, transparent 100%) !important;
  opacity: 0.55 !important;
}

body .navbar-brand img,
body .app-logo,
body img[alt="App Logo"] {
  max-height: 42px !important;
  max-width: 190px !important;
  object-fit: contain !important;
}

body .page-title .title-text,
body .workspace-page .widget-head .widget-title,
body .sidebar-item-label,
body .standard-sidebar-item .item-anchor {
  color: #181818 !important;
}

body .desk-sidebar .standard-sidebar-item.selected,
body .layout-side-section .standard-sidebar-item.selected,
body .workspace-sidebar .standard-sidebar-item.selected {
  background: #fff3df !important;
  color: #7a4618 !important;
  box-shadow: inset 0 0 0 1px #e6cda9 !important;
}

body .standard-sidebar-item:hover {
  background: #fff8ee !important;
}

body .workspace-page .widget:hover,
body .frappe-card:hover {
  box-shadow: 0 10px 24px rgba(184, 116, 51, 0.08) !important;
  border-color: #e8d3b4 !important;
}

body .btn-primary,
body .btn.btn-primary,
body .login-content .btn-primary {
  background-color: #111111 !important;
  border-color: #111111 !important;
  color: #ffffff !important;
}

body .btn-primary:hover,
body .btn-primary:focus,
body .login-content .btn-primary:hover {
  background-color: #b87433 !important;
  border-color: #b87433 !important;
}

body .indicator-pill.green,
body .indicator-pill.blue,
body .indicator-pill.orange {
  background: #fff3df !important;
  color: #7a4618 !important;
  border: 1px solid #e6cda9 !important;
}

.for-login,
.for-forgot,
.for-signup,
.for-email-login {
  background: #f7f3ee !important;
}

.login-content {
  border-top: 3px solid #b87433;
}

.login-content .page-card {
  border: 1px solid #e8d3b4 !important;
  box-shadow: 0 18px 45px rgba(17, 17, 17, 0.08) !important;
}

.login-content .page-card-head h4,
.login-content h4,
.login-content .form-signin-heading {
  color: #181818 !important;
}

.login-content .form-control:focus {
  border-color: #b87433 !important;
  box-shadow: 0 0 0 2px rgba(184, 116, 51, 0.12) !important;
}

.login-content .form-control,
.login-content .btn {
  border-radius: 12px;
}

[dir="rtl"] .layout-side-section,
[dir="rtl"] .desk-sidebar {
  border-left: 1px solid var(--demo-border);
  border-right: 0;
}