/* * Booky Premium Theme — SB Admin 2 / Bootstrap overlay * Requires tokens.css and a `booky-premium` class on . */ /* Shell ------------------------------------------------------------------- */ .booky-premium #wrapper, .booky-premium #content-wrapper, .booky-premium #content { background: var(--bp-canvas); } .booky-premium #content-wrapper { min-width: 0; } .booky-premium #content { position: relative; } .booky-premium #content > .mb-4:first-of-type { margin-bottom: 1.25rem !important; } .booky-premium #content > .container, .booky-premium #content > .container-fluid { padding-right: clamp(1rem, 2vw, 2rem); padding-left: clamp(1rem, 2vw, 2rem); } .booky-premium .dashboard-hero h1, .booky-premium .dashboard-hero h2, .booky-premium .dashboard-hero h3, .booky-premium .dashboard-hero h4, .booky-premium .dashboard-hero h5, .booky-premium .dashboard-hero h6, .booky-premium .dashboard-hero .dashboard-title { color: inherit; } /* Sidebar ----------------------------------------------------------------- */ .booky-premium .sidebar.bg-gradient-primary { background-color: var(--bp-sidebar-start) !important; background-image: linear-gradient(155deg, var(--bp-sidebar-start) 0%, var(--bp-sidebar-mid) 62%, var(--bp-sidebar-end) 100%) !important; box-shadow: 8px 0 30px rgba(26, 31, 80, .16); } .booky-premium .sidebar { width: 15rem; min-height: 100vh; padding: .75rem .7rem 1.25rem; } .booky-premium .sidebar .sidebar-brand { height: 4.75rem; margin: 0 0 .45rem !important; border-radius: var(--bp-radius-md); } .booky-premium .sidebar .sidebar-divider { margin: .65rem .45rem; border-top-color: rgba(255, 255, 255, .13); } .booky-premium .sidebar .nav-item { margin: .13rem 0; } .booky-premium .sidebar .nav-item .nav-link { width: 100%; padding: .72rem .8rem; border-radius: var(--bp-radius-sm); color: rgba(255, 255, 255, .72); font-size: .82rem; font-weight: 700; transition: color var(--bp-transition), background-color var(--bp-transition), transform var(--bp-transition); } .booky-premium .sidebar .nav-item .nav-link i { width: 1.3rem; margin-right: .38rem; color: rgba(255, 255, 255, .52); font-size: .85rem; text-align: center; transition: color var(--bp-transition); } .booky-premium .sidebar .nav-item .nav-link:hover { color: #fff; background: rgba(255, 255, 255, .1); transform: translateX(2px); } .booky-premium .sidebar .nav-item .nav-link:hover i, .booky-premium .sidebar .nav-item.active .nav-link i { color: #fff; } .booky-premium .sidebar .nav-item.active .nav-link { color: #fff; background: rgba(255, 255, 255, .16); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08), 0 8px 18px rgba(10, 15, 55, .12); } .booky-premium .sidebar .nav-item .collapse, .booky-premium .sidebar .nav-item .collapsing { margin: .25rem .2rem .5rem; } .booky-premium .sidebar .nav-item .collapse .collapse-inner, .booky-premium .sidebar .nav-item .collapsing .collapse-inner { padding: .55rem; border: 1px solid rgba(255, 255, 255, .12); border-radius: var(--bp-radius-md); background: rgba(255, 255, 255, .96); box-shadow: var(--bp-shadow-md); } .booky-premium .sidebar .collapse-inner .collapse-header { padding: .45rem .65rem .35rem; color: var(--bp-muted); font-size: .62rem; font-weight: 900; letter-spacing: .08em; } .booky-premium .sidebar .collapse-inner .collapse-item { margin: .1rem 0; padding: .58rem .65rem; border-radius: var(--bp-radius-xs); color: var(--bp-ink-soft); font-size: .77rem; font-weight: 700; } .booky-premium .sidebar .collapse-inner .collapse-item:hover, .booky-premium .sidebar .collapse-inner .collapse-item.active { color: var(--bp-primary); background: var(--bp-primary-soft); } .booky-premium .sidebar .sidebar-card { border: 1px solid rgba(255, 255, 255, .14); border-radius: var(--bp-radius-lg); background: rgba(255, 255, 255, .1); backdrop-filter: blur(10px); } .booky-premium .sidebar #sidebarToggle, .booky-premium .sidebar.toggled #sidebarToggle { background-color: rgba(255, 255, 255, .14); transition: background-color var(--bp-transition), transform var(--bp-transition); } .booky-premium .sidebar #sidebarToggle:hover { background-color: rgba(255, 255, 255, .24); transform: scale(1.05); } /* Topbar ------------------------------------------------------------------ */ .booky-premium .topbar { position: sticky; z-index: 1020; top: 0; height: 4.65rem; margin: .75rem clamp(.75rem, 1.5vw, 1.5rem) 0; border: 1px solid rgba(229, 233, 241, .92); border-radius: var(--bp-radius-lg); background: rgba(255, 255, 255, .94) !important; box-shadow: var(--bp-shadow-sm) !important; backdrop-filter: blur(14px); } .booky-premium .topbar .nav-item .nav-link { color: var(--bp-muted); } .booky-premium .topbar .nav-item .nav-link:hover, .booky-premium .topbar .nav-item .nav-link:focus { color: var(--bp-primary); } .booky-premium .topbar .topbar-divider { height: 2rem; border-right-color: var(--bp-border); } .booky-premium .topbar .img-profile, .booky-premium .topbar .logo-profile { border: 2px solid #fff; box-shadow: 0 0 0 2px var(--bp-primary-soft); } .booky-premium .navbar-search .form-control { border-color: transparent !important; background: var(--bp-surface-subtle) !important; } /* Cards and panels -------------------------------------------------------- */ .booky-premium .card { border: 1px solid var(--bp-border); border-radius: var(--bp-radius-lg); background: var(--bp-surface); box-shadow: var(--bp-shadow-sm); } .booky-premium .card.shadow, .booky-premium .card.shadow-sm, .booky-premium .card.shadow-lg { box-shadow: var(--bp-shadow-md) !important; } .booky-premium .card-header { min-height: 3.65rem; padding: 1rem 1.2rem; border-bottom: 1px solid var(--bp-border); border-radius: var(--bp-radius-lg) var(--bp-radius-lg) 0 0 !important; color: var(--bp-ink); background: var(--bp-surface) !important; } .booky-premium .card-header h6, .booky-premium .card-header .font-weight-bold { color: var(--bp-ink) !important; font-size: .9rem; font-weight: 800 !important; } .booky-premium .card-body { padding: 1.25rem; } .booky-premium .card-footer { padding: 1rem 1.2rem; border-top: 1px solid var(--bp-border); border-radius: 0 0 var(--bp-radius-lg) var(--bp-radius-lg) !important; background: var(--bp-surface-subtle); } /* The agenda positions slots and appointments from this compact header. */ .booky-premium .operator-card .card-header { min-height: 48.5px; padding: .45rem .85rem; } .booky-premium .border-left-primary, .booky-premium .border-left-success, .booky-premium .border-left-info, .booky-premium .border-left-warning, .booky-premium .border-left-danger { border-left-width: .28rem !important; } .booky-premium .border-left-primary { border-left-color: var(--bp-primary) !important; } .booky-premium .border-left-success { border-left-color: var(--bp-success) !important; } .booky-premium .border-left-info { border-left-color: var(--bp-info) !important; } .booky-premium .border-left-warning { border-left-color: var(--bp-warning) !important; } .booky-premium .border-left-danger { border-left-color: var(--bp-danger) !important; } /* Buttons ----------------------------------------------------------------- */ .booky-premium .btn { padding: .56rem .88rem; border-width: 1px; border-radius: var(--bp-radius-sm); font-size: .8rem; font-weight: 800; letter-spacing: .005em; box-shadow: none; transition: transform var(--bp-transition), box-shadow var(--bp-transition), background-color var(--bp-transition), border-color var(--bp-transition), color var(--bp-transition); } .booky-premium .btn:hover { transform: translateY(-1px); box-shadow: 0 7px 16px rgba(33, 43, 70, .12); } .booky-premium .btn:active, .booky-premium .btn.active { transform: translateY(0); box-shadow: none !important; } .booky-premium .btn:focus, .booky-premium .btn.focus { box-shadow: var(--bp-focus) !important; } .booky-premium .btn-sm { padding: .38rem .65rem; border-radius: 8px; font-size: .72rem; } .booky-premium .btn-lg { padding: .72rem 1.1rem; border-radius: var(--bp-radius-md); font-size: .9rem; } .booky-premium .btn-primary, .booky-premium .bg-primary { border-color: var(--bp-primary) !important; background-color: var(--bp-primary) !important; } .booky-premium .btn-primary, .booky-premium .btn-success, .booky-premium .btn-info, .booky-premium .btn-warning, .booky-premium .btn-danger, .booky-premium .btn-secondary, .booky-premium .btn-dark { color: #fff !important; } .booky-premium .btn-primary:hover, .booky-premium .btn-primary:focus { border-color: var(--bp-primary-dark) !important; color: #fff !important; background-color: var(--bp-primary-dark) !important; } .booky-premium .btn-success { border-color: var(--bp-success-dark); background: var(--bp-success-dark); } .booky-premium .btn-info { border-color: #176b87; background: #176b87; } .booky-premium .btn-warning { border-color: #dfa13b; color: #2d1d04 !important; background: #e7aa48; } .booky-premium .btn-danger { border-color: #c83f52; background: #c83f52; } .booky-premium .btn-secondary { border-color: #69758b; background: #69758b; } .booky-premium .btn-light { border-color: var(--bp-border); color: var(--bp-ink-soft); background: var(--bp-surface); } .booky-premium .btn-link { color: var(--bp-primary); box-shadow: none; } .booky-premium .btn-success:hover, .booky-premium .btn-success:focus, .booky-premium .btn-success:active, .booky-premium .btn-info:hover, .booky-premium .btn-info:focus, .booky-premium .btn-info:active, .booky-premium .btn-warning:hover, .booky-premium .btn-warning:focus, .booky-premium .btn-warning:active, .booky-premium .btn-danger:hover, .booky-premium .btn-danger:focus, .booky-premium .btn-danger:active, .booky-premium .btn-secondary:hover, .booky-premium .btn-secondary:focus, .booky-premium .btn-secondary:active, .booky-premium .btn-dark:hover, .booky-premium .btn-dark:focus, .booky-premium .btn-dark:active { color: #fff !important; } .booky-premium .btn-warning:hover, .booky-premium .btn-warning:focus, .booky-premium .btn-warning:active { color: #2d1d04 !important; } .booky-premium .btn.disabled, .booky-premium .btn:disabled { color: #fff !important; opacity: .58; transform: none; box-shadow: none; } .booky-premium .btn-light.disabled, .booky-premium .btn-light:disabled, .booky-premium .btn-outline-primary.disabled, .booky-premium .btn-outline-primary:disabled, .booky-premium .btn-outline-secondary.disabled, .booky-premium .btn-outline-secondary:disabled { color: var(--bp-muted) !important; } .booky-premium .btn-outline-primary { border-color: #bfc3fb; color: var(--bp-primary); } .booky-premium .btn-outline-primary:hover { border-color: var(--bp-primary); color: #fff; background: var(--bp-primary); } .booky-premium .btn-outline-secondary { border-color: var(--bp-border-strong); color: var(--bp-ink-soft); } .booky-premium .btn-outline-success { border-color: var(--bp-success-dark); color: var(--bp-success-dark); } .booky-premium .btn-outline-info { border-color: var(--bp-info); color: #176b87; } .booky-premium .btn-outline-warning { border-color: #dfa13b; color: #79500f; } .booky-premium .btn-outline-danger { border-color: var(--bp-danger); color: #b93848; } .booky-premium .btn-outline-dark { border-color: var(--bp-ink); color: var(--bp-ink); } .booky-premium .btn-outline-success:hover, .booky-premium .btn-outline-info:hover, .booky-premium .btn-outline-danger:hover, .booky-premium .btn-outline-dark:hover { color: #fff !important; } .booky-premium .btn-outline-warning:hover { color: #2d1d04 !important; } .booky-premium .btn-circle { border-radius: 50%; } /* Forms ------------------------------------------------------------------- */ .booky-premium label, .booky-premium .col-form-label { margin-bottom: .38rem; color: var(--bp-ink-soft); font-size: .78rem; font-weight: 800; } .booky-premium .form-control, .booky-premium .form-select, .booky-premium .custom-select, .booky-premium .bootstrap-select > .dropdown-toggle { min-height: 2.75rem; padding: .62rem .8rem; border: 1px solid var(--bp-border-strong); border-radius: var(--bp-radius-sm); color: var(--bp-ink); background-color: var(--bp-surface); font-size: .82rem; box-shadow: none; transition: border-color var(--bp-transition), box-shadow var(--bp-transition), background-color var(--bp-transition); } .booky-premium textarea.form-control { min-height: 7rem; } .booky-premium .form-control-sm, .booky-premium .custom-select-sm { min-height: 2.2rem; padding: .4rem .62rem; border-radius: 8px; font-size: .75rem; } .booky-premium .form-control:focus, .booky-premium .form-select:focus, .booky-premium .custom-select:focus, .booky-premium .bootstrap-select.show > .dropdown-toggle, .booky-premium .bootstrap-select > .dropdown-toggle:focus { border-color: var(--bp-primary-light); background-color: #fff; box-shadow: var(--bp-focus) !important; outline: 0 !important; } .booky-premium .form-control::placeholder { color: #aab2c0; } .booky-premium .form-control:disabled, .booky-premium .form-control[readonly], .booky-premium .form-select:disabled, .booky-premium fieldset:disabled .form-control { color: var(--bp-muted); background: #f1f3f7; } .booky-premium .form-control.is-invalid, .booky-premium .was-validated .form-control:invalid { border-color: var(--bp-danger); background-color: #fffafb; } .booky-premium .form-control.is-valid, .booky-premium .was-validated .form-control:valid { border-color: var(--bp-success); background-color: #fbfffd; } .booky-premium .invalid-feedback { color: var(--bp-danger); font-size: .72rem; } .booky-premium .valid-feedback { color: var(--bp-success); font-size: .72rem; } .booky-premium .form-text { color: var(--bp-muted); font-size: .71rem; } .booky-premium .input-group-text { border-color: var(--bp-border-strong); color: var(--bp-muted); background: var(--bp-surface-subtle); font-size: .78rem; } /* Keep adjoining controls flush after the premium radius overrides. */ .booky-premium .input-group > .form-control:not(:last-child), .booky-premium .input-group > .form-select:not(:last-child), .booky-premium .input-group > .custom-select:not(:last-child), .booky-premium .input-group > .bootstrap-select:not(:last-child) > .dropdown-toggle { border-top-right-radius: 0; border-bottom-right-radius: 0; } .booky-premium .input-group > .form-control:not(:first-child), .booky-premium .input-group > .form-select:not(:first-child), .booky-premium .input-group > .custom-select:not(:first-child), .booky-premium .input-group > .bootstrap-select:not(:first-child) > .dropdown-toggle { border-top-left-radius: 0; border-bottom-left-radius: 0; } .booky-premium .input-group-prepend > .btn, .booky-premium .input-group-prepend > .input-group-text { border-top-right-radius: 0; border-bottom-right-radius: 0; } .booky-premium .input-group-prepend > :not(:first-child), .booky-premium .input-group-append > .btn, .booky-premium .input-group-append > .input-group-text { border-top-left-radius: 0; border-bottom-left-radius: 0; } .booky-premium .input-group-append > :not(:last-child) { border-top-right-radius: 0; border-bottom-right-radius: 0; } .booky-premium .custom-control-label::before { border-color: var(--bp-border-strong); background: #fff; } .booky-premium .custom-control-input:checked ~ .custom-control-label::before { border-color: var(--bp-primary); background: var(--bp-primary); } .booky-premium .custom-control-input:focus ~ .custom-control-label::before { box-shadow: var(--bp-focus); } .booky-premium .form-check-input:checked { border-color: var(--bp-primary); background-color: var(--bp-primary); } .booky-premium .form-check-input:focus { border-color: var(--bp-primary-light); box-shadow: var(--bp-focus); } .booky-premium .bootstrap-select .dropdown-menu { min-width: 100% !important; } /* Tables and DataTables --------------------------------------------------- */ .booky-premium .table-responsive { border: 1px solid var(--bp-border); border-radius: var(--bp-radius-md); background: var(--bp-surface); } .booky-premium .table { margin-bottom: 0; color: var(--bp-ink-soft); font-size: .875rem; } .booky-premium .table th, .booky-premium .table td { padding: .82rem .85rem; border-color: var(--bp-border); vertical-align: middle; } .booky-premium .table thead th { border-top: 0; border-bottom: 1px solid var(--bp-border-strong); color: var(--bp-muted); background: #f7f8fb; font-size: .75rem; font-weight: 900; letter-spacing: .045em; text-transform: uppercase; white-space: nowrap; } .booky-premium .table-bordered, .booky-premium .table-bordered th, .booky-premium .table-bordered td { border-color: var(--bp-border); } .booky-premium .table-hover tbody tr { transition: background-color var(--bp-transition); } .booky-premium .table-hover tbody tr:hover { color: var(--bp-ink); background: var(--bp-primary-faint); } .booky-premium .table-striped tbody tr:nth-of-type(odd) { background: rgba(247, 248, 251, .72); } .booky-premium .dataTables_wrapper .dataTables_length, .booky-premium .dataTables_wrapper .dataTables_filter, .booky-premium .dataTables_wrapper .dataTables_info, .booky-premium .dataTables_wrapper .dataTables_paginate { padding: .75rem .25rem; color: var(--bp-muted); font-size: .8rem; } .booky-premium .table .badge { font-size: 75%; } .booky-premium .dataTables_wrapper .dataTables_filter input, .booky-premium .dataTables_wrapper .dataTables_length select { min-height: 2.25rem; margin: 0 .35rem; border: 1px solid var(--bp-border-strong); border-radius: 8px; color: var(--bp-ink); background: #fff; } .booky-premium .page-link, .booky-premium .dataTables_wrapper .page-link { min-width: 2.2rem; border-color: var(--bp-border); color: var(--bp-ink-soft); background: #fff; text-align: center; } .booky-premium .page-item:first-child .page-link { border-radius: 9px 0 0 9px; } .booky-premium .page-item:last-child .page-link { border-radius: 0 9px 9px 0; } .booky-premium .page-item.active .page-link { z-index: 1; border-color: var(--bp-primary); color: #fff; background: var(--bp-primary); } .booky-premium .page-link:focus { box-shadow: var(--bp-focus); } /* Navigation and tabs ----------------------------------------------------- */ .booky-premium .nav-tabs { gap: .35rem; padding: .35rem; border: 1px solid var(--bp-border); border-radius: var(--bp-radius-md); background: #f0f2f7; } .booky-premium .nav-tabs .nav-item { margin-bottom: 0; } .booky-premium .nav-tabs .nav-link { border: 0; border-radius: var(--bp-radius-sm); color: var(--bp-muted); font-size: .78rem; font-weight: 800; } .booky-premium .nav-tabs .nav-link:hover { color: var(--bp-primary); background: rgba(255, 255, 255, .65); } .booky-premium .nav-tabs .nav-link.active, .booky-premium .nav-tabs .nav-item.show .nav-link { color: var(--bp-primary); background: #fff; box-shadow: var(--bp-shadow-xs); } .booky-premium .nav-tabs + .border, .booky-premium .horizontal-tabs ~ [class*="sect-"] { margin-top: .55rem; border: 1px solid var(--bp-border) !important; border-radius: var(--bp-radius-lg); box-shadow: var(--bp-shadow-xs); } .booky-premium .breadcrumb { padding: .72rem 1rem; border: 1px solid var(--bp-border); border-radius: var(--bp-radius-sm); background: var(--bp-surface); font-size: .75rem; } /* Modals, dropdowns, popovers -------------------------------------------- */ .booky-premium .modal.fade.show { background: rgba(15, 21, 42, .52); backdrop-filter: blur(3px); } .booky-premium .modal-content { overflow: hidden; border: 0; border-radius: var(--bp-radius-lg); background: var(--bp-surface); box-shadow: var(--bp-shadow-lg); } .booky-premium .modal-header { min-height: 4.25rem; padding: 1.1rem 1.3rem; border-bottom: 1px solid var(--bp-border); background: #fff; } .booky-premium .modal-title { color: var(--bp-ink); font-size: 1rem; font-weight: 800; } .booky-premium .modal-body { padding: 1.3rem; } .booky-premium .modal-footer { padding: .9rem 1.3rem; border-top: 1px solid var(--bp-border); background: var(--bp-surface-subtle); } .booky-premium .modal-header .close { width: 2.25rem; height: 2.25rem; margin: -.35rem -.35rem -.35rem auto; padding: 0; border-radius: 50%; color: var(--bp-muted); background: #f1f3f7; font-size: 1.3rem; line-height: 2.25rem; text-shadow: none; opacity: 1; } .booky-premium .dropdown-menu { padding: .45rem; border: 1px solid var(--bp-border); border-radius: var(--bp-radius-md); background: rgba(255, 255, 255, .98); box-shadow: var(--bp-shadow-md) !important; } .booky-premium .dropdown-item { padding: .58rem .7rem; border-radius: 8px; color: var(--bp-ink-soft); font-size: .78rem; font-weight: 700; } .booky-premium .dropdown-item:hover, .booky-premium .dropdown-item:focus, .booky-premium .dropdown-item.active, .booky-premium .dropdown-item:active { color: var(--bp-primary); background: var(--bp-primary-soft); } .booky-premium .dropdown-divider { border-top-color: var(--bp-border); } .booky-premium .popover, .booky-premium .tooltip-inner { border-color: var(--bp-border); border-radius: var(--bp-radius-sm); box-shadow: var(--bp-shadow-md); } .booky-premium .popover-header { border-bottom-color: var(--bp-border); color: var(--bp-ink); background: var(--bp-surface-subtle); font-weight: 800; } /* Feedback, badges and lists --------------------------------------------- */ .booky-premium .alert { border-width: 1px; border-radius: var(--bp-radius-md); font-size: .8rem; } .booky-premium .alert-primary { border-color: #d8dafd; color: var(--bp-primary-dark); background: var(--bp-primary-soft); } .booky-premium .alert-success { border-color: #c8eddf; color: var(--bp-success-dark); background: var(--bp-success-soft); } .booky-premium .alert-info { border-color: #c9eaf4; color: #176b87; background: var(--bp-info-soft); } .booky-premium .alert-warning { border-color: #f2d9ae; color: #8a5712; background: var(--bp-warning-soft); } .booky-premium .alert-danger { border-color: #f2cdd2; color: #a63443; background: var(--bp-danger-soft); } .booky-premium .alert-light { border-color: var(--bp-border); color: var(--bp-ink-soft); background: var(--bp-surface-subtle); } .booky-premium .badge { padding: .35em .58em; border-radius: var(--bp-radius-pill); font-size: 68%; font-weight: 800; letter-spacing: .015em; } .booky-premium .badge-primary, .booky-premium .badge.bg-primary, .booky-premium a.badge-primary:hover, .booky-premium a.badge-primary:focus, .booky-premium a.badge.bg-primary:hover, .booky-premium a.badge.bg-primary:focus { color: #fff; background: var(--bp-primary); } .booky-premium .badge-secondary, .booky-premium a.badge-secondary:hover, .booky-premium a.badge-secondary:focus { color: #fff; background: #69758b; } .booky-premium .badge-success, .booky-premium a.badge-success:hover, .booky-premium a.badge-success:focus { color: var(--bp-success-dark); background: var(--bp-success-soft); } .booky-premium .badge-info, .booky-premium a.badge-info:hover, .booky-premium a.badge-info:focus { color: #176b87; background: var(--bp-info-soft); } .booky-premium .badge-warning, .booky-premium a.badge-warning:hover, .booky-premium a.badge-warning:focus { color: #8a5712; background: var(--bp-warning-soft); } .booky-premium .badge-danger, .booky-premium a.badge-danger:hover, .booky-premium a.badge-danger:focus { color: #a63443; background: var(--bp-danger-soft); } .booky-premium .badge-light, .booky-premium a.badge-light:hover, .booky-premium a.badge-light:focus { color: var(--bp-ink-soft); background: #f0f2f7; } .booky-premium .badge-dark, .booky-premium a.badge-dark:hover, .booky-premium a.badge-dark:focus { color: #fff; background: var(--bp-ink-soft); } .booky-premium .list-group { border-radius: var(--bp-radius-md); } .booky-premium .list-group-item { padding: .85rem 1rem; border-color: var(--bp-border); color: var(--bp-ink-soft); background: #fff; } .booky-premium .list-group-item-action:hover, .booky-premium .list-group-item-action:focus { color: var(--bp-primary); background: var(--bp-primary-faint); } .booky-premium .list-group-item.active { border-color: var(--bp-primary); color: #fff; background: var(--bp-primary); } .booky-premium .accordion > .card { margin-bottom: .65rem; overflow: hidden; } .booky-premium .accordion-item { margin-bottom: .65rem; overflow: hidden; border: 1px solid var(--bp-border); border-radius: var(--bp-radius-md) !important; background: #fff; box-shadow: var(--bp-shadow-xs); } .booky-premium .accordion-button { padding: 1rem 1.1rem; color: var(--bp-ink); background: #fff; font-size: .84rem; font-weight: 800; box-shadow: none; } .booky-premium .accordion-button:not(.collapsed) { color: var(--bp-primary); background: var(--bp-primary-faint); box-shadow: inset 0 -1px 0 var(--bp-border); } .booky-premium .accordion-button:focus { border-color: transparent; box-shadow: var(--bp-focus); } .booky-premium .accordion-body { padding: 1.1rem; color: var(--bp-ink-soft); } .booky-premium .nav-pills { gap: .3rem; } .booky-premium .nav-pills .nav-link { border-radius: var(--bp-radius-sm); color: var(--bp-muted); font-size: .78rem; font-weight: 800; } .booky-premium .nav-pills .nav-link.active, .booky-premium .nav-pills .show > .nav-link { color: #fff; background: var(--bp-primary); } .booky-premium .toast { overflow: hidden; border: 1px solid var(--bp-border); border-radius: var(--bp-radius-md); background: rgba(255, 255, 255, .98); box-shadow: var(--bp-shadow-md); } .booky-premium .toast-header { border-bottom-color: var(--bp-border); color: var(--bp-ink); background: var(--bp-surface-subtle); } .booky-premium .progress { height: .65rem; border-radius: var(--bp-radius-pill); background: #e9ecf3; } .booky-premium .progress-bar { border-radius: var(--bp-radius-pill); background: var(--bp-primary); } /* Footer and utility surfaces -------------------------------------------- */ .booky-premium footer.bg-dark { margin: 1.5rem clamp(.75rem, 1.5vw, 1.5rem) .75rem; border-radius: var(--bp-radius-lg); background: var(--bp-sidebar-start) !important; box-shadow: var(--bp-shadow-sm); } .booky-premium .scroll-to-top { right: 1.25rem; bottom: 1.25rem; border-radius: var(--bp-radius-sm) !important; background: var(--bp-primary); box-shadow: var(--bp-shadow-md); } .booky-premium hr { border-top-color: var(--bp-border); } .booky-premium code { padding: .14rem .32rem; border-radius: 5px; color: #b23b6c; background: #f8edf3; } /* Authentication pages --------------------------------------------------- */ .booky-premium.booky-auth #content-wrapper, .booky-premium.booky-auth #content { background: radial-gradient(circle at 12% 12%, rgba(91, 92, 226, .13), transparent 32rem), radial-gradient(circle at 88% 80%, rgba(35, 133, 170, .1), transparent 30rem), var(--bp-canvas); } .booky-premium .card.o-hidden { border-radius: var(--bp-radius-xl); box-shadow: var(--bp-shadow-lg) !important; } .booky-premium .form-control-user, .booky-premium .btn-user { border-radius: var(--bp-radius-md); } /* Responsive ------------------------------------------------------------- */ @media (min-width: 768px) { .booky-premium .sidebar { width: 15rem !important; } .booky-premium .sidebar .nav-item .nav-link { width: auto; } .booky-premium .sidebar.toggled { width: 6.5rem !important; padding-right: .45rem; padding-left: .45rem; } .booky-premium .sidebar.toggled .nav-item .nav-link { width: 100%; padding: .72rem .35rem; text-align: center; } .booky-premium .sidebar.toggled .nav-item .nav-link i { margin-right: 0; font-size: 1rem; } } @media (max-width: 767.98px) { .booky-premium .sidebar { flex: 0 0 clamp(9rem, 35vw, 18rem); width: clamp(9rem, 35vw, 18rem); padding-right: .55rem; padding-left: .55rem; transition: width var(--bp-transition), flex-basis var(--bp-transition), padding var(--bp-transition); } .booky-premium .sidebar.toggled { flex-basis: 0; width: 0 !important; min-width: 0; padding-right: 0; padding-left: 0; overflow: hidden; border: 0; box-shadow: none; } .booky-premium #content-wrapper { flex: 0 0 100vw; width: 100vw; min-width: 100vw !important; } .booky-premium .sidebar .nav-item .nav-link { display: flex; width: 100%; align-items: center; padding: .68rem .65rem; text-align: left; } .booky-premium .sidebar .nav-item .nav-link i { display: inline-block; flex: 0 0 1.25rem; width: 1.25rem; margin: 0 .4rem 0 0; } .booky-premium .sidebar .nav-item .nav-link span { display: inline; overflow: hidden; font-size: .76rem; text-overflow: ellipsis; white-space: nowrap; } .booky-premium .topbar { height: 4.25rem; margin: .5rem .5rem 0; border-radius: var(--bp-radius-md); } .booky-premium #content > .mb-4:first-of-type { margin-bottom: .8rem !important; } .booky-premium .card-body, .booky-premium .modal-body { padding: 1rem; } .booky-premium .table th, .booky-premium .table td { padding: .7rem .65rem; } .booky-premium footer.bg-dark { margin: 1rem .5rem .5rem; } } @media (max-width: 575.98px) { .booky-premium .btn:not(.btn-circle) { white-space: normal; } .booky-premium .modal-dialog { margin: .6rem; } .booky-premium .modal-content { border-radius: var(--bp-radius-md); } } @media print { .booky-premium, .booky-premium #wrapper, .booky-premium #content-wrapper, .booky-premium #content { color: #000 !important; background: #fff !important; } .booky-premium .sidebar, .booky-premium .topbar, .booky-premium footer, .booky-premium .scroll-to-top { display: none !important; } .booky-premium .card, .booky-premium .table-responsive { border-color: #ccc !important; box-shadow: none !important; } }