/*
 * File name : main.css
 * Author    : mayuri@rtac.in
 * DOC       : 25-Aug-2026
 */
 
 :root {
     --dc-orange: #F4623A;
     --dc-purple: #5B4FE9;
 }

 html,
 body {
     height: 100%;
     overflow: hidden;
 }

 #loginPage {
     height: 100vh;
     background: #f4f5f9;
     font-family: 'Source Sans Pro', 'Segoe UI', sans-serif;
     overflow: hidden;
 }

 #tfaSetupPage {
     align-items: flex-start;
     height: 100vh;
     overflow-y: auto;
     padding-top: 3rem;
     padding-bottom: 3rem;
 }

 #tfaSetupDiv .dcLoginCard {
     max-width: 480px;
 }

 #loginPage::before,
 #loginPage::after {
     content: "";
     position: absolute;
     left: 0;
     right: 0;
 }

 .dcSetupTfa {
     display: block;
 }

 #loginPage::before {
     top: 0;
     height: 4px;
     background: var(--dc-orange);
 }

 #loginPage::after {
     bottom: 0;
     height: 3px;
     background: var(--dc-purple);
 }

 .dcLoginCard {
     max-width: 400px;
     border-radius: 14px;
     box-shadow: 0 4px 24px rgba(20, 20, 43, .08);
 }

 .dcLogoBadge {
     background: #FDEFEA;
     border-radius: 10px;
 }

 .dcLogoBadge .dcLogoIcon {
     color: var(--dc-orange);
     transform: translateY(-6px);
 }

 .dcOrange {
     color: var(--dc-orange);
 }

 a.dcLink,
 .dcSetupTfa {
     color: var(--dc-orange) !important;
     text-decoration: none;
 }

 a.dcLink:hover,
 .dcSetupTfa:hover {
     text-decoration: underline;
 }

 .dcInput {
     font-size: .9rem;
 }

 .dcInput:focus {
     border-color: var(--dc-orange) !important;
     box-shadow: 0 0 0 3px rgba(244, 98, 58, .1) !important;
 }

 .dcInput::placeholder {
     color: #B7BECC;
 }

 .dcInputIcon,
 .dcToggleIcon {
     color: #A6ADBB;
 }

 .dcToggleIcon {
     cursor: pointer;
 }

 .dcOtpDigit {
     aspect-ratio: 1/1;
     font-size: 1.1rem;
 }

 .dcOtpDigit:focus {
     border-color: var(--dc-orange) !important;
     box-shadow: 0 0 0 3px rgba(244, 98, 58, .1) !important;
 }

 #loginRecaptchaDiv {
     background: #F6F7FB;
 }

 .dcRecaptchaBadge {
     color: #A6ADBB;
 }

 .dcRecaptchaBadge .dcSpin {
     font-size: 1.1rem;
     color: #7B8AF7;
 }

 .dcRecaptchaBadge small {
     font-size: .55rem;
     letter-spacing: .5px;
 }

 .form-check-input:checked {
     background-color: var(--dc-orange);
     border-color: var(--dc-orange);
 }

 .dcSubmitBtn {
     background: linear-gradient(180deg, #F5734C, #F0532B);
     color: #fff;
     transition: filter .15s ease;
 }

 .dcSubmitBtn:hover {
     filter: brightness(1.05);
     color: #fff;
 }

 .dcSubmitBtn:active {
     filter: brightness(.95);
 }

 #appShell {
     height: 100vh;
     overflow: hidden;
 }

 /* Admin index.php wraps the shell in an inner .d-flex div. */
 #appShell>.d-flex>.flex-grow-1 {
     display: flex;
     flex-direction: column;
     height: 100vh;
 }

 #pageContainer {
     flex: 1 1 auto;
     overflow-y: auto;
     overflow-x: hidden;
 }

 .dcSidebar {
     height: 100vh;
     overflow-y: auto;
 }

 /* ---------- Post-login shell: copied from APIConsumer css/dashboard.css ---------- */
 :root {
     --dc-orange-hover: #DB5027;
     --dc-peach: #FDEFEA;
     --dc-border: #ECECEE;
     --dc-muted: #9A9DA6;
 }

 /* Sidebar */
 .dcSidebar {
     width: 240px;
     flex: 0 0 240px;
     min-height: 100vh;
     background: #fff;
     border-right: 1px solid var(--dc-border);
 }

 .dcSidebarLogo {
     font-size: 1.15rem;
     letter-spacing: 0.2px;
 }

 .dcSidebarLogo .dcOrange {
     color: var(--dc-orange);
 }

 .dcNavItem {
     display: flex;
     align-items: center;
     gap: 10px;
     padding: 9px 12px;
     border-radius: 8px;
     color: #4A4B57;
     text-decoration: none;
     border-left: 3px solid transparent;
     font-size: 0.92rem;
 }

 .dcNavItem:hover {
     background-color: #F7F7F9;
     color: #2B2C34;
 }

 .dcNavItem.active {
     background-color: var(--dc-peach);
     color: var(--dc-orange);
     border-left: 3px solid var(--dc-orange);
     font-weight: 600;
 }

 .dcNavItem .dcNavIcon {
     width: 18px;
     text-align: center;
     font-size: 0.95rem;
 }

 /* Topbar */
 .dcTopbar {
     height: 64px;
     min-height: 64px;
     flex-shrink: 0;
     box-sizing: border-box;
     background: #fff;
     border-bottom: 1px solid var(--dc-border);
 }

 .dcBreadcrumb {
     font-size: 0.85rem;
 }

 .dcBreadcrumb a {
     color: #6A6B75;
     text-decoration: none;
 }

 .dcBreadcrumb .dcCrumbActive {
     color: #2B2C34;
     font-weight: 600;
 }

 .dcAvatarCircle {
     width: 36px;
     height: 36px;
     border-radius: 50%;
     background-color: var(--dc-orange);
     color: #fff;
     font-weight: 700;
     font-size: 0.82rem;
     cursor: pointer;
 }