/*
html,body{
	font-size: 16px;
}
.navbar{
	border-radius: 0;
	border:none;
}
.navbar-collapse{
	padding-right: initial;
    padding-left: initial;
}
@media (min-width: 768px) {
	.navbar-nav > li > a {
        padding-top: 8px;
        padding-bottom: 8px;
    }
	.navbar > .container .navbar-brand, .navbar > .container-fluid .navbar-brand {
        margin-left: initial;
    }
}
.nav > li > a:hover, .nav > li > a:focus {
    background-color: initial;
}
.nav > li > a {
    position: initial;
}
.nav > li  {
    position: initial;
}
.navbar-brand {
    float: initial;
    height: auto;
    padding: 0;
}
*/
/**
 * Bootstrap validation states
 */
.has-error select,.has-error input {
    border-color: #dc3545;
	box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
}
.has-error .help-block {
    color: #dc3545;
}

.has-success select,.has-success input {
    border-color: #28a745;
}
main > .container {
    padding: 70px 15px 20px;
}

.footer {
    background-color: #f5f5f5;
    font-size: .9em;
    height: 60px;
}

.footer > .container {
    padding-right: 15px;
    padding-left: 15px;
}

.not-set {
    color: #c55;
    font-style: italic;
}

/* add sorting icons to gridview sort links */
a.asc:after, a.desc:after {
    content: '';
    left: 3px;
    display: inline-block;
    width: 0;
    height: 0;
    border: solid 5px transparent;
    margin: 4px 4px 2px 4px;
    background: transparent;
}

a.asc:after {
    border-bottom: solid 7px #212529;
    border-top-width: 0;
}

a.desc:after {
    border-top: solid 7px #212529;
    border-bottom-width: 0;
}

.grid-view th {
    white-space: nowrap;
}

.hint-block {
    display: block;
    margin-top: 5px;
    color: #999;
}

.error-summary {
    color: #a94442;
    background: #fdf7f7;
    border-left: 3px solid #eed3d7;
    padding: 10px 20px;
    margin: 0 0 15px 0;
}

/* align the logout "link" (button in form) of the navbar */
.nav li > form > button.logout {
    padding-top: 7px;
    color: rgba(255, 255, 255, 0.5);
}

/* Chats */
.chat-directory, .chat-shell { color: #203246; }
.chat-directory-list { margin-left: -5px; margin-right: -5px; }
.chat-directory-item { display: flex; align-items: center; gap: 15px; padding: 17px; border: 1px solid #e4eaf0; border-radius: 16px; background: #fff; color: inherit; box-shadow: 0 5px 18px rgba(24,49,74,.04); }
.chat-directory-form { width: 100%; height: 100%; text-align: left; cursor: pointer; }
.chat-directory-form button { cursor: pointer; }
.chat-directory-item:hover { text-decoration: none; color: inherit; border-color: #a9c8ea; box-shadow: 0 9px 25px rgba(24,49,74,.09); }
.chat-avatar { flex: 0 0 44px; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 15px; background: #dcecff; color: #19528a; font-size: 20px; font-weight: 700; }
.chat-directory-copy { display: grid; min-width: 0; flex: 1; }
.chat-directory-copy strong, .chat-directory-copy small, .chat-directory-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-directory-copy small { color: #728397; }
.chat-directory-copy span { color: #56697b; }
.chat-directory-meta { display: grid; justify-items: end; gap: 8px; align-self: flex-start; color: #7a8a98; }
.chat-empty { padding: 40px 22px; text-align: center; background: #f2f6fa; border-radius: 16px; color: #5a6d7d; }
.chat-heading { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.chat-shell { display: flex; flex-direction: column; height: min(75vh, 760px); min-height: 500px; border: 1px solid #dbe5ef; border-radius: 18px; overflow: hidden; background: #f3f7fb; box-shadow: 0 14px 35px rgba(24,49,74,.08); }
.chat-toolbar { min-height: 54px; padding: 9px 18px; display: flex; justify-content: space-between; align-items: center; gap: 12px; border-bottom: 1px solid #e3eaf2; background: #fff; }
.chat-presence { font-size: 13px; color: #5f7387; }
.chat-presence-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #27a66a; margin-right: 5px; }
.chat-more { align-self: center; border: 0; background: transparent; color: #2d6dad; padding: 10px; font-size: 13px; }
.chat-messages { flex: 1; overflow-y: auto; padding: 18px; display: flex; flex-direction: column; gap: 12px; }
.chat-message { max-width: min(77%, 620px); align-self: flex-start; padding: 10px 14px; border-radius: 16px 16px 16px 4px; background: #fff; box-shadow: 0 2px 8px rgba(34,58,83,.07); overflow-wrap: anywhere; }
.chat-message-mine { align-self: flex-end; border-radius: 16px 16px 4px 16px; background: #dceeff; }
.chat-message-bot, .chat-message-system { align-self: center; background: #fff5de; border: 1px solid #f4dfaa; }
.chat-message-author { font-weight: 700; font-size: 12px; color: #395d81; margin-bottom: 4px; }
.chat-message-body { white-space: pre-wrap; line-height: 1.45; }
.chat-message-reply { border-left: 3px solid #77a3cd; padding-left: 8px; margin: 5px 0 8px; color: #516b84; font-size: 13px; max-height: 3em; overflow: hidden; }
.chat-message-footer { display: flex; justify-content: flex-end; gap: 2px; margin-top: 6px; color: #75889a; font-size: 11px; }
.chat-message-actions { display: flex; gap: 12px; flex-wrap: wrap; margin-top: 5px; }
.chat-message-actions button, .chat-compose-mode button { border: 0; background: transparent; color: #3175b5; padding: 0; font-size: 12px; }
.chat-composer { padding: 12px; background: #fff; border-top: 1px solid #e2eaf2; }
.chat-composer form { display: flex; gap: 10px; align-items: end; }
.chat-composer textarea { flex: 1; min-width: 0; resize: vertical; max-height: 180px; padding: 10px 12px; border: 1px solid #cad8e6; border-radius: 12px; outline: none; }
.chat-composer textarea:focus { border-color: #5297d8; box-shadow: 0 0 0 3px #d8eaff; }
.chat-compose-mode { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 7px; color: #4c718f; font-size: 13px; }
.chat-error { margin: 0; padding: 13px 18px; border: 2px solid #dc3545; border-radius: 0 0 16px 16px; background: #fff0f1; color: #8f1d2c; font-size: 16px; font-weight: 700; line-height: 1.4; box-shadow: 0 -2px 8px rgba(220,53,69,.12); }
.chat-bot-panel { padding: 13px 18px; background: #fff9ed; border-top: 1px solid #f3deb2; max-height: 40%; overflow-y: auto; }
.chat-bot-header { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 5px; }
.chat-bot-header-actions { display: flex; gap: 6px; }
.chat-bot-close { font-size: 20px; line-height: 1; min-width: 36px; }
.chat-bot-title { font-weight: 700; color: #9b6a13; font-size: 12px; letter-spacing: .08em; }
.chat-bot-text { white-space: pre-wrap; margin: 5px 0 10px; }
.chat-bot-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.chat-bot-actions input { max-width: 180px; }
.customer-chat-page { background: #eaf1f7; }
.customer-chat-main { max-width: 760px; padding: 12px; margin: 0 auto; }
.customer-chat-header { display: flex; align-items: center; gap: 11px; padding: 10px 4px 16px; }
.customer-chat-page .chat-shell { height: calc(100dvh - 104px); min-height: 400px; }
@media (max-width: 600px) {
    .chat-directory-item { padding: 12px; gap: 10px; }
    .chat-directory-meta { font-size: 12px; }
    .chat-message { max-width: 90%; }
    .chat-messages { padding: 12px; }
    .customer-chat-main { padding: 0; }
    .customer-chat-header { padding: 10px 12px; }
    .customer-chat-page .chat-shell { border-radius: 0; border-left: 0; border-right: 0; height: calc(100dvh - 70px); }
}

@media(max-width:767px) {
    .nav li > form > button.logout {
        display:block;
        text-align: left;
        width: 100%;
        padding: 10px 0;
    }
}

.nav > li > form > button.logout:focus,
.nav > li > form > button.logout:hover {
    text-decoration: none;
    color: rgba(255, 255, 255, 0.75);
}

.nav > li > form > button.logout:focus {
    outline: none;
}

/* Administrative application shell */
:root {
    --admin-navy: #16283d;
    --admin-navy-light: #20364f;
    --admin-blue: #0879ed;
    --admin-blue-soft: #e8f2ff;
    --admin-bg: #f4f7fb;
    --admin-border: #e2e9f2;
    --admin-text: #142238;
    --admin-muted: #71829a;
}

html, body { min-height: 100%; }
body.admin-body { margin: 0; background: var(--admin-bg); color: var(--admin-text); font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
body.admin-body main > .container { padding: 0; }
.admin-shell { min-height: 100vh; display: flex; }
.admin-sidebar { position: fixed; z-index: 1035; top: 0; bottom: 0; left: 0; width: 252px; overflow-y: auto; background: linear-gradient(180deg, var(--admin-navy) 0%, #132237 100%); color: #d6e1ef; box-shadow: 8px 0 28px rgba(16,36,60,.08); }
.admin-brand { height: 116px; display: flex; align-items: center; gap: 13px; padding: 0 25px; border-bottom: 1px solid rgba(255,255,255,.1); color: #fff; font-size: 20px; font-weight: 700; }
.admin-brand-mark { display: inline-grid; place-items: center; width: 31px; height: 31px; border-radius: 7px; color: #45a7ff; font-size: 28px; line-height: 1; }
.admin-brand-mark .app-brand-icon { display: block; width: 31px; height: 31px; }
.admin-nav { padding: 18px 12px 26px; }
.admin-nav-link { min-height: 51px; display: flex; align-items: center; gap: 16px; margin: 3px 0; padding: 0 17px; border-radius: 10px; color: #c7d3e2; font-size: 15px; text-decoration: none !important; transition: background .15s ease, color .15s ease, transform .15s ease; }
.admin-nav-link:hover { color: #fff; background: rgba(255,255,255,.08); transform: translateX(2px); }
.admin-nav-link.is-active { color: #fff; background: linear-gradient(100deg, #126de0, #087bea); box-shadow: 0 8px 18px rgba(2,101,219,.28); }
.admin-nav-icon { width: 24px; color: #c3d1e2; font-size: 22px; line-height: 1; text-align: center; }
.admin-nav-link.is-active .admin-nav-icon { color: #fff; }
.admin-main { width: calc(100% - 252px); min-height: 100vh; margin-left: 252px; display: flex; flex-direction: column; }
.admin-header { min-height: 76px; display: flex; align-items: center; gap: 16px; padding: 0 30px; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--admin-border); }
.admin-header-spacer { flex: 1; }
.admin-user { display: flex; align-items: center; gap: 10px; color: var(--admin-text); font-size: 14px; font-weight: 600; }
.admin-user-avatar { display: inline-grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: #e6eef8; color: #324d70; font-size: 18px; }
.admin-user-chevron { color: #49617e; font-size: 17px; }
.admin-logout-form { margin: 0; }
.admin-logout { padding: 10px 16px; border: 1px solid var(--admin-border); border-radius: 10px; background: #f8fafc; color: var(--admin-text); font-size: 14px; font-weight: 600; cursor: pointer; }
.admin-logout:hover { border-color: #cbd8e8; background: #eef4fa; }
.admin-content { flex: 1; padding: 28px 30px 38px; }
.admin-content > .container-fluid { width: 100%; max-width: 1440px; margin: 0 auto; padding: 0; }
.admin-content .breadcrumb { margin: 0 0 22px; padding: 0; background: transparent; color: var(--admin-muted); font-size: 13px; }
.admin-content .breadcrumb a { color: #7287a4; }
.admin-content h1 { margin: 0 0 7px; color: var(--admin-text); font-size: 36px; font-weight: 750; letter-spacing: -.03em; }
.admin-content h2, .admin-content h3 { color: var(--admin-text); font-weight: 700; }
.admin-footer { padding: 0 30px 20px; color: #98a6b8; font-size: 12px; }
.admin-menu-toggle, .admin-sidebar-close { border: 0; background: transparent; color: var(--admin-text); font-size: 25px; line-height: 1; }
.admin-mobile-brand { display: inline-flex; align-items: center; gap: 8px; color: var(--admin-text); font-size: 17px; font-weight: 700; text-decoration: none !important; }
.admin-mobile-brand .app-brand-icon { width: 22px; height: 22px; color: var(--admin-blue); }
.admin-sidebar-backdrop { display: none; }

/* Shared CRUD surfaces */
.admin-content .index > .d-flex, .admin-content .view > .d-flex, .admin-content .create > .d-flex, .admin-content .update > .d-flex { margin-bottom: 24px; }
.admin-content .index > h1 { display: inline-block; vertical-align: middle; }
.admin-content .index > h1 + p { float: right; margin: 2px 0 20px; }
.admin-content .index > h1 + p:after { content: ''; display: block; clear: both; }
.admin-content .index > h1 + p .btn { padding: 11px 18px; }
.admin-content .index > .grid-view, .admin-content .index > .table-responsive { clear: both; }
.admin-content .site-login, .admin-content .site-signup { max-width: 760px; padding: 28px; border: 1px solid var(--admin-border); border-radius: 14px; background: #fff; box-shadow: 0 8px 28px rgba(27,55,88,.05); }
.admin-content .form-control, .admin-content .custom-select { min-height: 42px; border-color: #d8e2ee; border-radius: 9px; color: var(--admin-text); box-shadow: none; }
.admin-content .form-control:focus, .admin-content .custom-select:focus { border-color: #79b6f8; box-shadow: 0 0 0 3px rgba(8,121,237,.12); }
.admin-content .btn { border-radius: 9px; font-weight: 600; }
.admin-content .btn-primary { background: var(--admin-blue); border-color: var(--admin-blue); }
.admin-content .btn-success { background: #159447; border-color: #159447; }
.admin-content .btn-outline-primary { color: var(--admin-blue); border-color: #b9d8fa; }
.admin-content .btn-outline-primary:hover { color: #fff; background: var(--admin-blue); border-color: var(--admin-blue); }
.admin-content .table-responsive, .admin-content .grid-view { overflow-x: auto; border: 1px solid var(--admin-border); border-radius: 14px; background: #fff; box-shadow: 0 6px 22px rgba(27,55,88,.04); }
.admin-content .table { min-width: 720px; margin: 0; color: var(--admin-text); background: #fff; }
.admin-content .table thead th { padding: 17px 15px; border-top: 0; border-bottom: 1px solid var(--admin-border); color: #52657f; background: #fbfcfe; font-size: 13px; font-weight: 700; white-space: nowrap; }
.admin-content .table tbody td { padding: 15px; border-color: #edf1f6; vertical-align: middle; }
.admin-content .table tbody tr:hover { background: #f8fbff; }
.admin-content .grid-view .filters td { padding: 9px 10px; background: #f8fbff; border-top: 0; }
.admin-content .grid-view .filters input, .admin-content .grid-view .filters select { min-height: 36px; border: 1px solid #d8e2ee; border-radius: 7px; }
.admin-content .grid-view .action-column { width: 130px; white-space: nowrap; }
.admin-content .grid-view .action-column a { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-right: 4px; border-radius: 8px; background: var(--admin-blue-soft); color: var(--admin-blue); font-size: 0; text-decoration: none; }
.admin-content .grid-view .action-column a:hover { background: var(--admin-blue); color: #fff; }
.admin-content .grid-view .action-column a:before { font-size: 16px; }
.admin-content .grid-view .action-column a[title="View"]:before, .admin-content .grid-view .action-column a[aria-label="View"]:before { content: '◉'; }
.admin-content .grid-view .action-column a[title="Update"]:before, .admin-content .grid-view .action-column a[aria-label="Update"]:before { content: '✎'; }
.admin-content .grid-view .action-column a[title="Delete"] { background: #fff0f1; color: #e12c3f; }
.admin-content .grid-view .action-column a[title="Delete"]:before, .admin-content .grid-view .action-column a[aria-label="Delete"]:before { content: '×'; font-size: 22px; }
.admin-content .table a { color: #076fe0; }
.admin-content .pagination { margin-top: 18px; }
.admin-content .pagination .page-link { border-color: var(--admin-border); color: var(--admin-blue); border-radius: 7px; margin-right: 4px; }
.admin-content .card, .admin-content .customers-form, .admin-content .dogovors-form { border-color: var(--admin-border); border-radius: 14px; box-shadow: 0 6px 22px rgba(27,55,88,.04); }
.admin-content .alert { border: 0; border-radius: 10px; }
.admin-content .form-group label { color: #53667f; font-size: 13px; font-weight: 600; }
.admin-content .hint-block, .admin-content .help-block { color: var(--admin-muted); }

@media (max-width: 991.98px) {
    .admin-sidebar { left: -270px; width: 270px; transition: left .2s ease; }
    .admin-sidebar.is-open { left: 0; }
    .admin-sidebar-backdrop { position: fixed; z-index: 1030; inset: 0; background: rgba(10,25,43,.45); }
    body.admin-menu-open .admin-sidebar-backdrop { display: block; }
    .admin-main { width: 100%; margin-left: 0; }
    .admin-header { min-height: 64px; padding: 0 18px; }
    .admin-content { padding: 23px 18px 30px; }
    .admin-content h1 { font-size: 30px; }
    .admin-footer { padding: 0 18px 18px; }
    .admin-user-name { max-width: 150px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
    .admin-logout { padding: 8px 10px; font-size: 0; }
    .admin-logout:first-letter { font-size: 18px; }
}

@media (max-width: 575.98px) {
    .admin-header { gap: 10px; }
    .admin-user-name, .admin-user-chevron { display: none; }
    .admin-logout { padding: 8px 11px; }
    .admin-content { padding: 18px 12px 25px; }
    .admin-content h1 { font-size: 27px; }
    .admin-content .breadcrumb { margin-bottom: 16px; }
}
