/* =========================================================
   ROMAN CONCRETE ERP — PREMIUM BRAND THEME
   MUT-SEK TECH
   Frappe / ERPNext v16
   ========================================================= */

:root {
    --rc-green: #00A651;
    --rc-green-dark: #008A43;
    --rc-green-deep: #006F37;
    --rc-green-soft: #EAF8F0;

    --rc-charcoal: #272A2E;
    --rc-charcoal-2: #34383D;
    --rc-grey: #62676D;

    --rc-bg: #F5F7F6;
    --rc-card: #FFFFFF;
    --rc-border: #E3E8E5;

    --rc-radius: 12px;
    --rc-radius-lg: 18px;

    --rc-shadow:
        0 8px 24px rgba(23, 35, 29, 0.08);

    --rc-shadow-hover:
        0 14px 35px rgba(0, 166, 81, 0.14);
}


/* =========================================================
   GLOBAL
   ========================================================= */

body {
    background: var(--rc-bg);
}

a {
    transition:
        color .2s ease,
        background-color .2s ease,
        border-color .2s ease,
        box-shadow .2s ease;
}

.text-primary,
a:not(.btn):hover {
    color: var(--rc-green) !important;
}


/* =========================================================
   BUTTONS
   ========================================================= */

.btn-primary,
.btn.btn-primary,
button.btn-primary {
    background: var(--rc-green) !important;
    border-color: var(--rc-green) !important;
    color: #fff !important;
    border-radius: 9px !important;
    box-shadow: 0 5px 14px rgba(0, 166, 81, .18);
}

.btn-primary:hover,
.btn.btn-primary:hover {
    background: var(--rc-green-dark) !important;
    border-color: var(--rc-green-dark) !important;
    box-shadow: 0 8px 20px rgba(0, 166, 81, .24);
}

.btn-default:hover,
.btn-secondary:hover {
    border-color: rgba(0, 166, 81, .4) !important;
}


/* =========================================================
   LOGIN PAGE
   ========================================================= */

body[data-path="login"],
body:has(.for-login) {
    min-height: 100vh;
    background:
        radial-gradient(
            circle at 15% 15%,
            rgba(0, 166, 81, .20),
            transparent 32%
        ),
        radial-gradient(
            circle at 85% 75%,
            rgba(0, 166, 81, .12),
            transparent 34%
        ),
        linear-gradient(
            135deg,
            #171A1D 0%,
            #25292D 52%,
            #171A1D 100%
        ) !important;
}


/* subtle premium construction grid */

body:has(.for-login)::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: .13;

    background-image:
        linear-gradient(
            rgba(255,255,255,.12) 1px,
            transparent 1px
        ),
        linear-gradient(
            90deg,
            rgba(255,255,255,.12) 1px,
            transparent 1px
        );

    background-size: 42px 42px;
}


body:has(.for-login) .page_content,
body:has(.for-login) .page-content-wrapper {
    min-height: 100vh;
}


/* login card */

body:has(.for-login) .login-content.page-card {
    position: relative;
    max-width: 430px !important;

    padding: 34px 34px 30px !important;

    background:
        rgba(255, 255, 255, .97) !important;

    border:
        1px solid rgba(255, 255, 255, .45) !important;

    border-radius:
        var(--rc-radius-lg) !important;

    box-shadow:
        0 30px 80px rgba(0, 0, 0, .32) !important;

    overflow: hidden;
}


/* green premium accent */

body:has(.for-login) .login-content.page-card::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;

    height: 5px;

    background:
        linear-gradient(
            90deg,
            var(--rc-green-deep),
            var(--rc-green),
            #16CB6E
        );
}


/* login logo */

body:has(.for-login) .page-card-head {
    text-align: center !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
}

body:has(.for-login) .page-card-head .app-logo {
    width: auto !important;
    height: auto !important;
    max-width: 190px !important;
    max-height: 105px !important;

    margin:
        0 auto 20px !important;

    object-fit: contain !important;
}


/* login title */

body:has(.for-login) .page-card-head h4 {
    color: var(--rc-charcoal) !important;

    font-size: 26px !important;
    font-weight: 750 !important;

    margin-bottom: 7px !important;
}

body:has(.for-login) .page-card-subtitle {
    color: #70757A !important;
    font-size: 14px !important;
}


/* login form */

body:has(.for-login) .form-control {
    min-height: 44px !important;

    border:
        1px solid #DDE3DF !important;

    border-radius:
        9px !important;

    background:
        #FAFBFA !important;

    transition:
        border .2s ease,
        box-shadow .2s ease,
        background .2s ease;
}

body:has(.for-login) .form-control:focus {
    background:
        #FFFFFF !important;

    border-color:
        var(--rc-green) !important;

    box-shadow:
        0 0 0 3px rgba(0, 166, 81, .12) !important;
}


/* Continue button */

body:has(.for-login) .btn-login {
    min-height: 44px !important;

    background:
        var(--rc-green) !important;

    border-color:
        var(--rc-green) !important;

    color:
        #fff !important;

    border-radius:
        9px !important;

    font-weight:
        650 !important;

    box-shadow:
        0 8px 20px rgba(0, 166, 81, .20);
}

body:has(.for-login) .btn-login:hover {
    background:
        var(--rc-green-dark) !important;

    border-color:
        var(--rc-green-dark) !important;
}


/* login links */

body:has(.for-login) .forgot-password-message a,
body:has(.for-login) .sign-up-message a {
    color:
        var(--rc-green) !important;
}


/* =========================================================
   TOP NAVBAR
   ========================================================= */

.navbar {
    background:
        rgba(255,255,255,.97) !important;

    border-bottom:
        1px solid var(--rc-border) !important;

    box-shadow:
        0 2px 12px rgba(29, 40, 34, .05);
}

.navbar .navbar-brand img,
.navbar .app-logo {
    object-fit:
        contain !important;
}


/* search */

.navbar .search-bar,
.navbar input[type="search"],
.awesomplete > input {
    border-radius:
        10px !important;
}


/* =========================================================
   DESK PAGE
   ========================================================= */

.desk-page,
.layout-main-section,
.page-container {
    background:
        var(--rc-bg);
}


/* =========================================================
   SIDEBAR
   ========================================================= */

.layout-side-section,
.desk-sidebar {
    background:
        #FFFFFF !important;

    border-right:
        1px solid var(--rc-border) !important;
}


/* sidebar section headings */

.sidebar-label,
.standard-sidebar-label {
    color:
        #8A8F8C !important;

    font-size:
        11px !important;

    font-weight:
        700 !important;

    letter-spacing:
        .08em !important;

    text-transform:
        uppercase;
}


/* sidebar entries */

.standard-sidebar-item,
.sidebar-item {
    border-radius:
        9px !important;

    margin:
        2px 6px !important;

    transition:
        background .18s ease,
        color .18s ease,
        transform .18s ease;
}

.standard-sidebar-item:hover,
.sidebar-item:hover {
    background:
        var(--rc-green-soft) !important;

    color:
        var(--rc-green-dark) !important;
}


/* selected sidebar */

.standard-sidebar-item.selected,
.standard-sidebar-item.active,
.sidebar-item.selected,
.sidebar-item.active {
    background:
        linear-gradient(
            90deg,
            rgba(0,166,81,.15),
            rgba(0,166,81,.06)
        ) !important;

    color:
        var(--rc-green-dark) !important;

    font-weight:
        650 !important;
}


/* sidebar selected indicator */

.standard-sidebar-item.selected::before,
.sidebar-item.selected::before {
    background:
        var(--rc-green) !important;
}


/* =========================================================
   WORKSPACE / MODULE ICONS
   ========================================================= */

.widget.shortcut-widget-box,
.shortcut-widget-box,
.widget.links-widget-box,
.widget.number-widget-box,
.dashboard-widget-box {
    background:
        var(--rc-card) !important;

    border:
        1px solid var(--rc-border) !important;

    border-radius:
        var(--rc-radius) !important;

    box-shadow:
        var(--rc-shadow);

    transition:
        transform .18s ease,
        box-shadow .18s ease,
        border-color .18s ease;
}

.widget.shortcut-widget-box:hover,
.shortcut-widget-box:hover,
.widget.links-widget-box:hover,
.widget.number-widget-box:hover,
.dashboard-widget-box:hover {
    transform:
        translateY(-2px);

    border-color:
        rgba(0,166,81,.30) !important;

    box-shadow:
        var(--rc-shadow-hover);
}


/* icon containers */

.widget .widget-head .widget-title,
.widget .widget-title {
    color:
        var(--rc-charcoal) !important;
}


/* common ERPNext blue icons -> Roman Concrete green */

.widget .icon,
.shortcut-widget-box .icon,
.module-icon,
.workspace-icon,
.sidebar-item-icon {
    --icon-stroke:
        var(--rc-green) !important;
}


/* =========================================================
   LIST / FORM / REPORT CARDS
   ========================================================= */

.list-row-container,
.form-layout,
.form-dashboard,
.report-wrapper,
.frappe-card {
    border-radius:
        var(--rc-radius) !important;
}

.frappe-card,
.form-layout {
    border:
        1px solid var(--rc-border) !important;

    box-shadow:
        0 4px 16px rgba(29,40,34,.04);
}


/* =========================================================
   PAGE HEADERS
   ========================================================= */

.page-head {
    background:
        rgba(255,255,255,.97) !important;

    border-bottom:
        1px solid var(--rc-border) !important;
}

.page-title .title-text,
.page-head .title-text {
    color:
        var(--rc-charcoal) !important;

    font-weight:
        700 !important;
}


/* =========================================================
   TABS
   ========================================================= */

.nav-tabs .nav-link.active,
.form-tabs-list .form-tabs .nav-link.active {
    color:
        var(--rc-green-dark) !important;

    border-bottom-color:
        var(--rc-green) !important;
}


/* =========================================================
   CHECKBOX / CONTROL ACCENTS
   ========================================================= */

input[type="checkbox"]:checked {
    accent-color:
        var(--rc-green);
}

input[type="radio"]:checked {
    accent-color:
        var(--rc-green);
}


/* =========================================================
   INDICATORS
   ========================================================= */

.indicator.green::before,
.indicator-pill.green::before {
    background:
        var(--rc-green) !important;
}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {

    body:has(.for-login) .login-content.page-card {
        width:
            calc(100vw - 28px) !important;

        padding:
            28px 22px 24px !important;

        border-radius:
            16px !important;
    }

    body:has(.for-login) .page-card-head .app-logo {
        max-width:
            160px !important;

        max-height:
            90px !important;
    }

    .layout-side-section {
        border-right:
            0 !important;
    }

}


/* =========================================================
   ACCESSIBILITY
   ========================================================= */

*:focus-visible {
    outline:
        2px solid rgba(0,166,81,.55) !important;

    outline-offset:
        2px;
}