/* Trusty Personal Assistant - Tinexta Infocert Colors */
:root {
--primary-blue: #0072ce;
--dark-blue: #0B2E4F;
--light-blue: #E8F4FD;
--success-green: #28a745;
--success-bg: #d4edda;
--success-text: #155724;
--error-red: #dc3545;
--error-bg: #f8d7da;
--error-text: #721c24;
--info-bg: #d1ecf1;
--info-text: #0c5460;
--light-gray: #f5f5f5;
--medium-gray: #6c757d;
--border-gray: #dee2e6;
}
body {
font-family: Arial, sans-serif;
padding: 50px;
background: var(--light-gray);
margin: 0;
}
.container {
background: white;
padding: 40px;
border-radius: 10px;
box-shadow: 0 2px 10px rgba(0,0,0,0.1);
max-width: 800px;
margin: 0 auto;
}
.header {
text-align: center;
margin-bottom: 30px;
}
.logo {
max-width: 300px;
height: auto;
margin-bottom: 20px;
}
h1 {
color: var(--dark-blue);
margin: 20px 0;
}
h2 {
color: var(--primary-blue);
}
h3 {
color: var(--medium-gray);
}
.success {
background: var(--success-bg);
color: var(--success-text);
padding: 15px;
border-radius: 5px;
margin: 20px 0;
border-left: 4px solid var(--success-green);
}
.error {
background: var(--error-bg);
color: var(--error-text);
padding: 15px;
border-radius: 5px;
margin: 20px 0;
border-left: 4px solid var(--error-red);
}
.info {
background: white;
color: var(--dark-blue);
padding: 15px;
border-radius: 5px;
margin: 20px 0;
text-align: left;
border: 2px solid var(--primary-blue);
}
.info-box {
background: #e9ecef;
padding: 15px;
border-radius: 5px;
margin: 15px 0;
}
.token-box {
background: #f8f9fa;
border: 1px solid var(--border-gray);
padding: 15px;
border-radius: 5px;
margin: 15px 0;
}
.btn {
display: inline-block;
padding: 12px 30px;
margin: 10px;
background: var(--primary-blue);
color: white;
text-decoration: none;
border-radius: 5px;
font-weight: bold;
cursor: pointer;
border: none;
transition: opacity 0.2s;
}
.btn:hover {
opacity: 0.85;
}
.btn-secondary {
background: var(--medium-gray);
}
.btn-success {
background: var(--success-green);
}
.copy-btn {
font-size: 12px;
padding: 5px 10px;
margin-left: 10px;
}
code {
background: #fff3cd;
padding: 2px 6px;
border-radius: 3px;
font-size: 12px;
}
pre {
white-space: pre-wrap;
word-break: break-all;
font-size: 11px;
background: white;
padding: 10px;
border: 1px solid var(--border-gray);
border-radius: 3px;
}
ul {
list-style: none;
padding-left: 0;
}
li {
margin: 5px 0;
font-size: 13px;
}
details summary {
cursor: pointer;
color: var(--primary-blue);
user-select: none;
}
.subtitle {
color: var(--medium-gray);
font-size: 18px;
margin-bottom: 30px;
}
