.icon {
  display: inline-block;
  width: 1.1rem;
  height: 1.1rem;
  background: currentColor;
  mask-size: contain;
  mask-position: center;
  mask-repeat: no-repeat;
}

.icon-dashboard { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 13h8V3H3v10Zm0 8h8v-6H3v6Zm10 0h8V11h-8v10Zm0-18v6h8V3h-8Z'/%3E%3C/svg%3E"); }
.icon-devices { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 2h10a2 2 0 0 1 2 2v16a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2Zm3 17h4'/%3E%3C/svg%3E"); }
.icon-updates { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M12 3v12m0 0 5-5m-5 5-5-5M5 21h14'/%3E%3C/svg%3E"); }
.icon-jobs { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M9 11l3 3L22 4M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11'/%3E%3C/svg%3E"); }
.icon-unlock,.icon-lock { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3M5 10h14v11H5z'/%3E%3C/svg%3E"); }
.icon-pulse { mask-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 24 24' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M3 12h4l3-8 4 16 3-8h4'/%3E%3C/svg%3E"); }

html {
  scroll-behavior: smooth;
}

body {
  letter-spacing: 0;
}

/* Management forms use local styles and do not require a CSS build. */
.gk-card { margin-bottom: 1.25rem; padding: 1.4rem; border: 1px solid #dce3ea; border-radius: .75rem; background: #fff; }
.gk-card h2 { font-size: 1.2rem; font-weight: 800; margin-bottom: .8rem; }
.gk-card h3, .gk-card legend { font-weight: 700; margin-bottom: .6rem; }
.gk-card p { margin: .5rem 0; }
.gk-form { display: grid; gap: 1rem; margin-top: 1rem; }
.gk-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 1rem; }
.gk-form label { display: grid; gap: .4rem; font-size: .9rem; }
.gk-form input:not([type=checkbox]), .gk-form select { width: 100%; padding: .65rem; border: 1px solid #bbc8d4; border-radius: .4rem; background: white; color: #17212b; }
.gk-form .gk-check { display: flex; align-items: center; gap: .55rem; }
.gk-check input { width: 1.1rem; height: 1.1rem; }
.gk-button { display: inline-block; justify-self: start; padding: .7rem 1.2rem; border-radius: .4rem; background: #126d8f; color: #fff; font-weight: 700; }
.gk-danger { color: #ad2034; padding: .4rem 0; }
.gk-muted { color: #536376; font-size: .85rem; }
.gk-url { overflow-wrap: anywhere; }
.gk-actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: .8rem; }
.gk-card a { color: #126d8f; text-decoration: underline; }
.gk-card a.gk-button { color: white; }
.gk-table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.gk-table th, .gk-table td { text-align: right; padding: .85rem; border-bottom: 1px solid #e2e8f0; vertical-align: top; }
.gk-table th { background: #f4f7fa; }
.gk-scroll { overflow: auto; }
.gk-form [hidden] { display: none; }
.gk-form details summary { cursor: pointer; }
